Prevent overlap of toc with content

Author: bigtiger

custom-modern.hbs

@@ -1,9 +1,15 @@
-{{!< default}} 
+{{!< default}}
+{{#post}}
 <div id="modern">
-  {{#post}} 
-    <div class="{{post_class}}">
-      <h1 class="title">{{title}}</h1>
-      {{content}}
+  <div class="{{post_class}}">
+    <h1 class="title">{{title}}</h1>
+      <aside class="gh-sidebar">
+        <div class="gh-toc"></div>
+      </aside>
+      <div class="post-content">{{content}}</div>
     </div>
-  {{/post}}
 </div>
+{{/post}}
+{{#contentFor 'scripts'}}
+<script src="{{asset 'dist/post.js'}}" defer></script>
+{{/contentFor}}

src/css/modern.css

@@ -233,7 +233,7 @@
         .gh-toc {
             position: sticky;
             top: 4vmin;
-            max-width: calc((100vw - 800px) / 2);
+            max-width: calc((100vw - 900px) / 2);
             padding-right: 2rem;
         }
     }