Improve the layout and styles

CHANGELOG.adoc

@@ -9,6 +9,15 @@ and this project adheres to https://semver.org/spec/v2.0.0.html[Semantic Version
 
 
 
+
+== [2.2.1] - 2019-09-15
+=== Changed
+* Revise the MathJax script loading mechanism.
+* Polish the stylesheets and layouts. 
+
+
+
+
 == [2.2.0] - 2019-09-12
 === Removed 
 * Remove the syntax highlighter choices and make PrismJS as the primary syntax highlighter. 

MANUAL.adoc

@@ -562,12 +562,6 @@ There are some parameters in the site configuration you might want to try out if
 | Yes 
 | 
 
-| `params.enableContentReaderMode`
-| boolean 
-| Previews single page templates in the theme's custom reader mode by showing less post metadata and cutting off the site header.  
-| Yes 
-| Doesn't affect top-level pages. 
-
 | `params.enableJsonLdSchema` 
 | boolean 
 | Creates a https://www.w3.org/TR/json-ld/[JSON+LD] schema for additional SEO capabilities. 
@@ -841,23 +835,6 @@ In order to be able to use it, set the `params.enableBreadcrumbs` to `true` in y
 
 
 
-=== Content reader mode 
-
-You can set your content (single page templates) to the theme's custom reader mode to declutter your posts and to make reading experience more soothing. 
-
-Enable it by setting `params.enableContentReaderMode` to `true`. 
-
-Here's the default look of the content page of the theme:
-
-image::docs/content-reader-mode-disabled.png[Content reader mode disabled, width=100%]
-
-And here's the content reader mode in action:
-
-image::docs/content-reader-mode-enabled.png[Content reader mode enabled, width=100%]
-
-NOTE: This doesn't apply to top-level pages. 
-
-
 
 === Content image zoom  
 

assets/scss/base.scss

@@ -69,6 +69,8 @@ code {
     font-size: 0.95rem; 
 }
 
+h1 { line-height: initial; }
+
 h1, h2, h3, 
 h4, h5, h6 {
     margin: var(--verticalRhythm) auto;

layouts/partials/head.html

@@ -95,7 +95,3 @@
 {{ range .AlternativeOutputFormats -}}
     {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
 {{- end }}
-
-{{- if $.Site.GoogleAnalytics -}}
-{{- template "_internal/google_analytics.html" . -}}
-{{- end -}}

layouts/partials/optional/breadcrumbs.html

@@ -10,6 +10,6 @@
 {{ template "breadcrumbnav" (dict "p1" .p1.Site.Home "p2" .p2 "childClass" .childClass)  }}
 {{- end -}}
 
-{{ $isCurrent := eq .p1 .p2 -}}
+{{- $isCurrent := eq .p1 .p2 -}}
 <a class="{{ .childClass }}{{ if $isCurrent }}--active{{ end }}" href="{{ .p1.Permalink }}">{{ .p1.Title }}</a> 
-{{ end -}}
+{{- end -}}

layouts/partials/scripts.html

@@ -8,12 +8,20 @@
     {{ $array = $array | append $highlighter }}
 {{- end -}}
 
-{{ if $.Site.Params.enableMathjax -}}
+{{ if $.Site.Params.enableMathSupport -}}
     <!-- MathJax -->
     <!-- Put your custom MathJax configuration over here. -->
 
-    <script defer src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
-    <script defer id="MathJax-script" src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
+    <!-- <script defer src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script> -->
+    <script>
+        window.addEventListener("load", function () {
+            const script = document.createElement("script");
+            script.src = "https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"
+            script.async = true
+
+            document.head.appendChild(script);
+        })
+    </script>
 {{- end -}}
 
 {{ if $.Site.Params.enableContentImageZoom -}}
@@ -50,4 +58,8 @@
 <!-- If you're modifying to add your own thing, I recommend to start here. -->
 <!-- Otherwise, you do you. :) -->
 
+{{- if $.Site.GoogleAnalytics -}}
+{{- template "_internal/google_analytics.html" . -}}
+{{- end -}}
+
 {{- end -}}