refactor(layouts): move layout HTML to baseof.html

For better maintainability
author: Jimmy Cai <jimmehcai@gmail.com> 2020-09-12 11:33:53 +0300
committer: Jimmy Cai <jimmehcai@gmail.com> 2020-09-12 11:33:53 +0300
commit: ed91cb76293411884cbe88793d8a3394ac72e95f (patch)
tree: 2d22602deb46b5b3783c1cd3cfa0af41327e0027
parent: cca10c7947d6f0d6db579905e07b406c6c773ebc (diff)
9 files changed, 118 insertions, 164 deletions
diff --git a/assets/scss/partials/layout/article.scss b/assets/scss/partials/layout/article.scss
index 23b8763..76e0fad 100644
--- a/assets/scss/partials/layout/article.scss
+++ b/assets/scss/partials/layout/article.scss
@@ -1,6 +1,6 @@
 @import "variables.scss";
 
-.article-and-sidebar {
+.keep-sidebar {
     @media (min-width: $on-phone) and (max-width: $on-tablet) {
         --main-top-padding: 50px;
     }
@@ -13,7 +13,7 @@
         }
     }
 
-    .left-sidebar {
+    &:not(.keep-sidebar) .left-sidebar {
         @media (max-width: $on-tablet) {
             display: none;
         }
diff --git a/layouts/404.html b/layouts/404.html
index d882c30..dd5e49d 100644
--- a/layouts/404.html
+++ b/layouts/404.html
@@ -1,13 +1,7 @@
-{{ define "body_class" }}2-column{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column align-items--flex-start">
-    {{ partial "sidebar/left.html" . }}
-
-    <main class="main full-width">
-        <div class="not-found-card">
-            <h1 class="article-title">{{ T "notFoundTitle" }}</h1>
-            <h2 class="article-subtitle">{{ T "notFoundSubtitle" }}</h2>
-        </div>
-    </main>
-</div>
+    <div class="not-found-card">
+        <h1 class="article-title">{{ T "notFoundTitle" }}</h1>
+        <h2 class="article-subtitle">{{ T "notFoundSubtitle" }}</h2>
+    </div>
+    {{ partialCached "footer/footer" . }}
 {{ end }}
 \ No newline at end of file
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 52e5df2..bf3d511 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -1,9 +1,13 @@
 <!DOCTYPE html>
 <html lang="{{ .Site.LanguageCode }}">
     {{- partial "head/head.html" . -}}
-    <body>
-        <div id="content">
-            {{- block "main" . }}{{- end }}
+    <body class="{{ block `body-class` . }}{{ end }}">
+        <div class="container extended flex on-phone--column align-items--flex-start {{ block `container-class` . }}{{end}}">
+            {{ partial "sidebar/left.html" . }}
+            <main class="main full-width">
+                {{- block "main" . }}{{- end }}
+            </main>
+            {{- block "right-sidebar" . -}}{{ end }}
         </div>
         {{ partial "footer/script.html" . }}
         {{ partial "footer/style.html" . }}
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 54206c4..8bd33d0 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,24 +1,19 @@
-{{ define "body_class" }}3-column{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column align-items--flex-start">
-    {{ partialCached "sidebar/left.html" . }}
+    <div class="widget">
+        <h3 class="widget-title">{{ .Title }}</h3>
+    </div>
 
-    <main class="main full-width">
-        <div class="widget">
-            <h3 class="widget-title">{{ .Title }}</h3>
-        </div>
+    <section class="article-list--compact">
+        {{ range .Paginator.Pages }}
+            {{ partial "article-list/compact" . }}
+        {{ end }}
+    </section>
 
-        <section class="article-list--compact">
-            {{ range .Paginator.Pages }}
-                {{ partial "article-list/compact" . }}
-            {{ end }}
-        </section>
+    {{- partial "pagination.html" . -}}
 
-        {{- partial "pagination.html" . -}}
-
-        {{ partialCached "footer/footer" . }}
-    </main>
+    {{ partialCached "footer/footer" . }}
+{{ end }}
 
+{{ define "right-sidebar" }}
     {{ partialCached "sidebar/right.html" . }}
-</div>
 {{ end }}
 \ No newline at end of file
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 82013b3..aabeee7 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,30 +1,21 @@
-{{ define "body_class" }}2-column{{ end }}
+{{ define "container-class" }}article-page with-toolbar{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column align-items--flex-start article-page with-toolbar">
-    {{ partial "sidebar/left.html" . }}
-
-    <div class="flex column do-not-overflow full-width">
-        <main class="main">
-            <div id="article-toolbar">
-                <a href="{{ .Site.BaseURL }}" class="back-home">
-                    {{ (resources.Get "icons/back.svg").Content | safeHTML }}
-                    <span>Back</span>
-                </a>
-            </div>
-
-            {{ partial "article/article.html" . }}
+    <div id="article-toolbar">
+        <a href="{{ .Site.BaseURL }}" class="back-home">
+            {{ (resources.Get "icons/back.svg").Content | safeHTML }}
+            <span>Back</span>
+        </a>
+    </div>
 
-            {{ partial "article/components/related-contents" . }}
+    {{ partial "article/article.html" . }}
 
-            {{ if or (not (isset .Params "comments")) (eq .Params.comments "true")}}
-                {{ partial "comments/include" . }}
-            {{ end }}
+    {{ partial "article/components/related-contents" . }}
 
-            {{ partialCached "footer/footer" . }}
-        </main>
-    </div>
-</div>
+    {{ if or (not (isset .Params "comments")) (eq .Params.comments "true")}}
+        {{ partial "comments/include" . }}
+    {{ end }}
 
-{{- partial "article/components/photoswipe.html" . -}}
+    {{ partialCached "footer/footer" . }}
 
+    {{- partial "article/components/photoswipe.html" . -}}
 {{ end }}
 \ No newline at end of file
diff --git a/layouts/_default/term.html b/layouts/_default/term.html
index 9bf62fe..0d0a35f 100644
--- a/layouts/_default/term.html
+++ b/layouts/_default/term.html
@@ -1,45 +1,37 @@
-{{ define "body_class" }}2-column{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column">
-    {{ partial "sidebar/left.html" . }}
+    <h3 class="taxonomy-type">{{ .Type | singularize  | humanize }}</h3>
+    <div class="taxonomy-card">
+        <div class="taxonomy-details">
+            <h3 class="taxonomy-count">{{ len .Pages }} post{{ if gt (len .Pages) 1 }}s{{ end }}</h3>
+            <h1 class="taxonomy-term">{{ .Title }}</h1>
+            {{ with .Params.description }}
+                <h2 class="taxonomy-description">{{ . }}</h2>
+            {{ end }}
+        </div>
 
-    <main class="main">
-        
-        <h3 class="taxonomy-type">{{ .Type | singularize  | humanize }}</h3>
-        <div class="taxonomy-card">
-            <div class="taxonomy-details">
-                <h3 class="taxonomy-count">{{ len .Pages }} post{{ if gt (len .Pages) 1 }}s{{ end }}</h3>
-                <h1 class="taxonomy-term">{{ .Title }}</h1>
-                {{ with .Params.description }}
-                    <h2 class="taxonomy-description">{{ . }}</h2>
+        {{ $image := partial "helper/image" (dict "Context" . "Type" "taxonomy") }}
+        {{ if $image.exists }}
+            <div class="taxonomy-image">
+                {{ if $image.resource }}   
+                    {{- $thumbnail := $image.resource.Fill "120x120" -}}
+                    <img src="{{ $thumbnail.RelPermalink }}" width="{{ $thumbnail.Width }}"
+                        height="{{ $thumbnail.Height }}" loading="lazy">
+                {{ else }}
+                    <img src="{{ $image.permalink }}" loading="lazy">
                 {{ end }}
             </div>
+        {{ end }}
+    </div>
+    
+    <section class="article-list--compact">
+        {{ $v2 := where .Pages "Params.hidden" "!=" true }}
+        {{ $pag := .Paginate (.Pages) }}
+        {{ range $pag.Pages }}
+            {{ partial "article-list/compact" . }}
+        {{ end }}
+    </section>
+    
+    {{- partial "pagination.html" . -}}
 
-            {{ $image := partial "helper/image" (dict "Context" . "Type" "taxonomy") }}
-            {{ if $image.exists }}
-                <div class="taxonomy-image">
-                    {{ if $image.resource }}   
-                        {{- $thumbnail := $image.resource.Fill "120x120" -}}
-                        <img src="{{ $thumbnail.RelPermalink }}" width="{{ $thumbnail.Width }}"
-                            height="{{ $thumbnail.Height }}" loading="lazy">
-                    {{ else }}
-                        <img src="{{ $image.permalink }}" loading="lazy">
-                    {{ end }}
-                </div>
-            {{ end }}
-        </div>
-        
-        <section class="article-list--compact">
-            {{ $v2 := where .Pages "Params.hidden" "!=" true }}
-            {{ $pag := .Paginate (.Pages) }}
-            {{ range $pag.Pages }}
-                {{ partial "article-list/compact" . }}
-            {{ end }}
-        </section>
-        
-        {{- partial "pagination.html" . -}}
-
-        {{ partialCached "footer/footer" . }}
-    </main>
-</div>
+    {{ partialCached "footer/footer" . }}
 {{ end }}
 \ No newline at end of file
diff --git a/layouts/index.html b/layouts/index.html
index f3559b3..1811bd2 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,25 +1,19 @@
-{{ define "body_class" }}3-column{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column align-items--flex-start">
-    {{ partialCached "sidebar/left.html" . }}
+    {{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
+    {{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }}
+    {{ $filtered := ($pages | intersect $notHidden) }}
+    {{ $pag := .Paginate ($filtered) }}
 
-    <main class="main full-width">
-        {{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
-        {{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }}
-        {{ $filtered := ($pages | intersect $notHidden) }}
-        {{ $pag := .Paginate ($filtered) }}
-        
-        <section class="article-list">
-            {{ range $index, $element := $pag.Pages }}
-                {{ partial "article-list/default" . }}
-            {{ end }}
-        </section>
-        
-        {{- partial "pagination.html" . -}}
+    <section class="article-list">
+        {{ range $index, $element := $pag.Pages }}
+            {{ partial "article-list/default" . }}
+        {{ end }}
+    </section>
 
-        {{ partialCached "footer/footer" . }}
-    </main>
-    
+    {{- partial "pagination.html" . -}}
+    {{ partialCached "footer/footer" . }}
+{{ end }}
+
+{{ define "right-sidebar" }}
     {{ partialCached "sidebar/right.html" . }}
-</div>
 {{ end }}
 \ No newline at end of file
diff --git a/layouts/page/archive.html b/layouts/page/archive.html
index 6751ff3..b68e40a 100644
--- a/layouts/page/archive.html
+++ b/layouts/page/archive.html
@@ -1,42 +1,34 @@
-{{ define "body_class" }}2-column{{ end }}
+{{ define "body-class" }}template-archive{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column align-items--flex-start">
-
-    {{ partial "sidebar/left.html" . }}
-
-    <main class="main template-archive">
-        {{ $categories := ($.Site.GetPage "taxonomyTerm" "categories").Pages }}
-        {{ if $categories }}
-        <div class="widget">
-            <h1 class="widget-title">Categories</h1>
-            <div class="category-list">
-                <div class="article-list--tile">
-                    {{ range $categories }}
-                        {{ partial "article-list/tile" (dict "context" . "size" "250x150") }}
-                    {{ end }}
-                </div>
+    {{ $categories := ($.Site.GetPage "taxonomyTerm" "categories").Pages }}
+    {{ if $categories }}
+    <div class="widget">
+        <h1 class="widget-title">Categories</h1>
+        <div class="category-list">
+            <div class="article-list--tile">
+                {{ range $categories }}
+                    {{ partial "article-list/tile" (dict "context" . "size" "250x150") }}
+                {{ end }}
             </div>
         </div>
-        {{ end }}
+    </div>
+    {{ end }}
 
-        {{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
-        {{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }}
-        {{ $filtered := ($pages | intersect $notHidden) }}
+    {{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
+    {{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }}
+    {{ $filtered := ($pages | intersect $notHidden) }}
 
-        {{ range $filtered.GroupByDate "2006" }}
-        {{ $id := lower (replace .Key " " "-") }}
-        <div class="archive-group" id="{{ $id }}">
-            <h3 class="archive-date"><a href="{{ $.Permalink }}#{{ $id }}">{{ .Key }}</a></h3>
-            <div class="article-list--compact">
-                {{ range .Pages }}
-                    {{ partial "article-list/compact" . }}
-                {{ end }}
-            </div>
+    {{ range $filtered.GroupByDate "2006" }}
+    {{ $id := lower (replace .Key " " "-") }}
+    <div class="archive-group" id="{{ $id }}">
+        <h3 class="archive-date"><a href="{{ $.Permalink }}#{{ $id }}">{{ .Key }}</a></h3>
+        <div class="article-list--compact">
+            {{ range .Pages }}
+                {{ partial "article-list/compact" . }}
+            {{ end }}
         </div>
-        {{ end }}
-
-        {{ partialCached "footer/footer" . }}
-    </main>
-</div>
+    </div>
+    {{ end }}
 
+    {{ partialCached "footer/footer" . }}
 {{ end }}
 \ No newline at end of file
diff --git a/layouts/page/single.html b/layouts/page/single.html
index e5a1ed8..edf53fb 100644
--- a/layouts/page/single.html
+++ b/layouts/page/single.html
@@ -1,20 +1,12 @@
-{{ define "body_class" }}2-column{{ end }}
+{{ define "body-class" }}article-page keep-sidebar{{ end }}
 {{ define "main" }}
-<div class="container extended flex on-phone--column align-items--flex-start article-and-sidebar">
+    {{ partial "article/article.html" . }}
 
-    {{ partial "sidebar/left.html" . }}
+    {{ if or (not (isset .Params "comments")) (eq .Params.comments "true")}} 
+        {{ partial "comments/include" . }}
+    {{ end }}
 
-    <main class="main article-page do-not-overflow full-width">
-        {{ partial "article/article.html" . }}
-
-        {{ if or (not (isset .Params "comments")) (eq .Params.comments "true")}} 
-            {{ partial "comments/include" . }}
-        {{ end }}
-
-        {{ partialCached "footer/footer" . }}
-    </main>
-</div>
-
-{{ partial "article/components/photoswipe" . }}
+    {{ partialCached "footer/footer" . }}
 
+    {{ partial "article/components/photoswipe" . }}
 {{ end }}
 \ No newline at end of file
author	Jimmy Cai <jimmehcai@gmail.com>	2020-09-12 11:33:53 +0300
committer	Jimmy Cai <jimmehcai@gmail.com>	2020-09-12 11:33:53 +0300
commit	ed91cb76293411884cbe88793d8a3394ac72e95f (patch)
tree	2d22602deb46b5b3783c1cd3cfa0af41327e0027
parent	cca10c7947d6f0d6db579905e07b406c6c773ebc (diff)