theme: simplify DOM to introduce flex later #210

layouts/partials/footer.html

@@ -1,11 +1,10 @@
-          <footer class=" footline">
-          {{- with .Params.LastModifierDisplayName }}
-            <i class='fas fa-user'></i> <a href="mailto:{{ $.Params.LastModifierEmail }}">{{ . }}</a> {{ with $.Date }} <i class='fas fa-calendar'></i> {{ .Format "02/01/2006" }}{{ end }}
-          {{- end }}
-          </footer>
-        </main><!-- #body-inner -->
+        <footer class="footline">
+        {{- with .Params.LastModifierDisplayName }}
+          <i class='fas fa-user'></i> <a href="mailto:{{ $.Params.LastModifierEmail }}">{{ . }}</a> {{ with $.Date }} <i class='fas fa-calendar'></i> {{ .Format "02/01/2006" }}{{ end }}
+        {{- end }}
+        </footer>
+      </main><!-- #body-inner -->
 {{- partial "custom-comments.html" . }}
-      </div>
     </div><!-- #body -->
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>

layouts/partials/header.html

@@ -28,8 +28,8 @@
     {{- partial "menu.html" . }}
     <div id="body" class="default-animation">
       <div id="sidebar-overlay"></div>
-      <div class="padding highlightable">
-        <div id="top-bar"><div>
+      <div id="top-bar" class="highlightable">
+        <div>
         {{- $showPrevNext := (and (not .Params.disableNextPrev) (not .Site.Params.disableNextPrev)) }}
         {{- if $showPrevNext }}
           {{- $parent := .Parent }}
@@ -97,13 +97,14 @@
         {{- if $toc }}
           {{- partial "toc.html" . }}
         {{- end }}
-        </div></div>
-        <main id="body-inner"{{if .Params.chapter}} class="chapter"{{end}}>
-          <div id="head-tags">
+        </div>
+      </div>
+      <main id="body-inner" class="highlightable {{if .Params.chapter}} chapter{{end}}">
+        <div id="head-tags">
 {{- partial "tags.html" . }}
-          </div>
+        </div>
       {{- if and (not .IsHome) (not .Params.chapter) }}
-          <h1>{{ if eq .Kind "term" }}{{ .Data.Singular | humanize }} {{ default "::" .Site.Params.titleSeparator }} {{ end }}{{ .Title }}</h1>
+        <h1>{{ if eq .Kind "term" }}{{ .Data.Singular | humanize }} {{ default "::" .Site.Params.titleSeparator }} {{ end }}{{ .Title }}</h1>
       {{- end }}
 
 {{- define "breadcrumb" }}

static/css/print.css

@@ -17,10 +17,6 @@ body {
 pre code {
     font-size: 8.3pt;
 }
-#body .padding {
-    /* remove page padding - this can be set exactly in the print setup */
-    padding: 0;
-}
 code.copy-to-clipboard-code {
     border-bottom-right-radius: 2px;
     border-top-right-radius: 2px;

static/css/theme.css

@@ -359,16 +359,10 @@ th {
     vertical-align: bottom;
 }
 
-#body .padding {
-    padding: 0;
-}
 #body-inner {
     padding: 0 3rem 4rem 3rem;
 }
 @media only all and (max-width: 59.938em) {
-    #body .padding {
-        position: static;
-    }
     #body-inner {
         padding: 0 2rem 15px 2rem;
     }
@@ -908,7 +902,7 @@ td {
     top: 50%;
 }
 
-.highlightable {
+#sidebar .highlightable {
     padding: 1rem 0 1rem;
     position: relative;
 }

static/js/theme.js

@@ -281,7 +281,7 @@ function initMenuScrollbar(){
         ps && ps.update();
     };
 
-    var ps = new PerfectScrollbar('#sidebar .highlightable');
+    var ps = new PerfectScrollbar('#content-wrapper');
 
     // to inform scrollbar of resizing
     $(window).resize(function() {