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

For better maintainability
This commit is contained in:
Jimmy Cai 2020-09-12 10:33:53 +02:00
parent cca10c7947
commit ed91cb7629
No known key found for this signature in database
GPG key ID: 3EA408E527F37B18
9 changed files with 122 additions and 168 deletions

View file

@ -1,6 +1,6 @@
@import "variables.scss"; @import "variables.scss";
.article-and-sidebar { .keep-sidebar {
@media (min-width: $on-phone) and (max-width: $on-tablet) { @media (min-width: $on-phone) and (max-width: $on-tablet) {
--main-top-padding: 50px; --main-top-padding: 50px;
} }
@ -13,7 +13,7 @@
} }
} }
.left-sidebar { &:not(.keep-sidebar) .left-sidebar {
@media (max-width: $on-tablet) { @media (max-width: $on-tablet) {
display: none; display: none;
} }

View file

@ -1,13 +1,7 @@
{{ define "body_class" }}2-column{{ end }}
{{ define "main" }} {{ 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"> <div class="not-found-card">
<h1 class="article-title">{{ T "notFoundTitle" }}</h1> <h1 class="article-title">{{ T "notFoundTitle" }}</h1>
<h2 class="article-subtitle">{{ T "notFoundSubtitle" }}</h2> <h2 class="article-subtitle">{{ T "notFoundSubtitle" }}</h2>
</div> </div>
</main> {{ partialCached "footer/footer" . }}
</div>
{{ end }} {{ end }}

View file

@ -1,9 +1,13 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}"> <html lang="{{ .Site.LanguageCode }}">
{{- partial "head/head.html" . -}} {{- partial "head/head.html" . -}}
<body> <body class="{{ block `body-class` . }}{{ end }}">
<div id="content"> <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 }} {{- block "main" . }}{{- end }}
</main>
{{- block "right-sidebar" . -}}{{ end }}
</div> </div>
{{ partial "footer/script.html" . }} {{ partial "footer/script.html" . }}
{{ partial "footer/style.html" . }} {{ partial "footer/style.html" . }}

View file

@ -1,9 +1,4 @@
{{ define "body_class" }}3-column{{ end }}
{{ define "main" }} {{ define "main" }}
<div class="container extended flex on-phone--column align-items--flex-start">
{{ partialCached "sidebar/left.html" . }}
<main class="main full-width">
<div class="widget"> <div class="widget">
<h3 class="widget-title">{{ .Title }}</h3> <h3 class="widget-title">{{ .Title }}</h3>
</div> </div>
@ -17,8 +12,8 @@
{{- partial "pagination.html" . -}} {{- partial "pagination.html" . -}}
{{ partialCached "footer/footer" . }} {{ partialCached "footer/footer" . }}
</main> {{ end }}
{{ partialCached "sidebar/right.html" . }} {{ define "right-sidebar" }}
</div> {{ partialCached "sidebar/right.html" . }}
{{ end }} {{ end }}

View file

@ -1,10 +1,5 @@
{{ define "body_class" }}2-column{{ end }} {{ define "container-class" }}article-page with-toolbar{{ end }}
{{ define "main" }} {{ 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"> <div id="article-toolbar">
<a href="{{ .Site.BaseURL }}" class="back-home"> <a href="{{ .Site.BaseURL }}" class="back-home">
{{ (resources.Get "icons/back.svg").Content | safeHTML }} {{ (resources.Get "icons/back.svg").Content | safeHTML }}
@ -21,10 +16,6 @@
{{ end }} {{ end }}
{{ partialCached "footer/footer" . }} {{ partialCached "footer/footer" . }}
</main>
</div>
</div>
{{- partial "article/components/photoswipe.html" . -}}
{{- partial "article/components/photoswipe.html" . -}}
{{ end }} {{ end }}

View file

@ -1,10 +1,4 @@
{{ define "body_class" }}2-column{{ end }}
{{ define "main" }} {{ define "main" }}
<div class="container extended flex on-phone--column">
{{ partial "sidebar/left.html" . }}
<main class="main">
<h3 class="taxonomy-type">{{ .Type | singularize | humanize }}</h3> <h3 class="taxonomy-type">{{ .Type | singularize | humanize }}</h3>
<div class="taxonomy-card"> <div class="taxonomy-card">
<div class="taxonomy-details"> <div class="taxonomy-details">
@ -40,6 +34,4 @@
{{- partial "pagination.html" . -}} {{- partial "pagination.html" . -}}
{{ partialCached "footer/footer" . }} {{ partialCached "footer/footer" . }}
</main>
</div>
{{ end }} {{ end }}

View file

@ -1,9 +1,4 @@
{{ define "body_class" }}3-column{{ end }}
{{ define "main" }} {{ define "main" }}
<div class="container extended flex on-phone--column align-items--flex-start">
{{ partialCached "sidebar/left.html" . }}
<main class="main full-width">
{{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }} {{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
{{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }} {{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }}
{{ $filtered := ($pages | intersect $notHidden) }} {{ $filtered := ($pages | intersect $notHidden) }}
@ -16,10 +11,9 @@
</section> </section>
{{- partial "pagination.html" . -}} {{- partial "pagination.html" . -}}
{{ partialCached "footer/footer" . }} {{ partialCached "footer/footer" . }}
</main> {{ end }}
{{ partialCached "sidebar/right.html" . }} {{ define "right-sidebar" }}
</div> {{ partialCached "sidebar/right.html" . }}
{{ end }} {{ end }}

View file

@ -1,10 +1,5 @@
{{ define "body_class" }}2-column{{ end }} {{ define "body-class" }}template-archive{{ end }}
{{ define "main" }} {{ 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 }} {{ $categories := ($.Site.GetPage "taxonomyTerm" "categories").Pages }}
{{ if $categories }} {{ if $categories }}
<div class="widget"> <div class="widget">
@ -36,7 +31,4 @@
{{ end }} {{ end }}
{{ partialCached "footer/footer" . }} {{ partialCached "footer/footer" . }}
</main>
</div>
{{ end }} {{ end }}

View file

@ -1,10 +1,5 @@
{{ define "body_class" }}2-column{{ end }} {{ define "body-class" }}article-page keep-sidebar{{ end }}
{{ define "main" }} {{ define "main" }}
<div class="container extended flex on-phone--column align-items--flex-start article-and-sidebar">
{{ partial "sidebar/left.html" . }}
<main class="main article-page do-not-overflow full-width">
{{ partial "article/article.html" . }} {{ partial "article/article.html" . }}
{{ if or (not (isset .Params "comments")) (eq .Params.comments "true")}} {{ if or (not (isset .Params "comments")) (eq .Params.comments "true")}}
@ -12,9 +7,6 @@
{{ end }} {{ end }}
{{ partialCached "footer/footer" . }} {{ partialCached "footer/footer" . }}
</main>
</div>
{{ partial "article/components/photoswipe" . }}
{{ partial "article/components/photoswipe" . }}
{{ end }} {{ end }}