Remove fixed height on .top-navbar (#68)

* Remove fixed height on .top-navbar

* Fix responsiveness

Co-authored-by: Emruz Hossain <emruz@appscode.com>

static/assets/css/layouts/single.css

@@ -44,7 +44,6 @@ body {
   overflow-y: auto;
   background-color: #f9fafc;
   margin-right: 0.5rem;
-  max-height: 100vh;
   /* box-shadow: 0px 8px 56px rgba(15, 80, 100, 0.16); */
   transition: all ease-out 0.3s;
 }
@@ -246,7 +245,7 @@ a.header-anchor code {
 .content li > ol,
 .content li > ul {
   -webkit-padding-start: 1rem;
-          padding-inline-start: 1rem;
+  padding-inline-start: 1rem;
 }
 
 kbd {
@@ -363,6 +362,7 @@ mark {
 
   .toc-holder {
     top: 3rem;
+    max-height: calc(100vh - 3rem);
   }
 
   .navbar-toggler {
@@ -403,70 +403,6 @@ mark {
 /* Medium devices (tablets, 768px and up) */
 
 @media only screen and (max-width: 768px) {
-  .wrapper {
-    padding-left: 0px;
-    padding-right: 0px;
-  }
-
-  .content-section {
-    padding: 0;
-    flex: 60%;
-    max-width: 100%;
-    order: 2;
-    overflow: hidden;
-  }
-  .content {
-    overflow: hidden;
-  }
-  .container {
-    max-width: 100%;
-  }
-
-  .toc-section {
-    order: 3;
-    flex: 0%;
-    max-width: 0%;
-    transition: all ease-out 0.3s;
-  }
-  .toc-section.hide {
-    flex: 40%;
-    max-width: 40%;
-    margin-left: 0.5rem;
-    transition: all ease-out 0.3s;
-  }
-
-  .toc-holder {
-    top: 3rem;
-  }
-
-  .navbar-toggler {
-    display: block;
-  }
-
-  .hero-area {
-    height: 300px;
-    margin-top: 1rem;
-  }
-
-  .page-content {
-    padding: 0px;
-  }
-
-  pre {
-    margin: 0px;
-  }
-  code {
-    padding: 0px;
-  }
-
-  .btn-improve-page {
-    margin-right: 1rem;
-  }
-
-  #disqus_thread,
-  .dsq-brlink {
-    padding: 5px;
-  }
 }
 
 /* Small devices (landscape phones, 576px and up) */
@@ -488,7 +424,7 @@ mark {
   .toc-section {
     order: 2;
     width: 100%;
-    height: 0;
+    height: fit-content;
     max-height: 0;
     max-width: 100%;
     transition: all ease-out 0.5s;
@@ -530,9 +466,6 @@ mark {
     margin-top: 1rem;
   }
 
-  .hero-area.hide {
-    margin-top: 1rem;
-  }
   .page-content {
     padding: 0px;
   }