feat: tidy style and layout

2019-08-24 19:32:41 +08:00
parent c8bb0770e9
commit 5cc4fdbe46
98 changed files with 751 additions and 500 deletions
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -1,26 +1,26 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="robots" content="noodp" />
-{{ with .Site.Params.google_verification }}
+{{ with .Site.Params.google_verification -}}
    <meta name="google-site-verification" content="{{ . }}" />
-{{ end }}
-{{ with .Site.Params.bing_verification }}
+{{ end -}}
+{{ with .Site.Params.bing_verification -}}
    <meta name="msvalidate.01" content="{{ . }}" />
-{{end}}
-{{ with .Site.Params.yandex_verification }}
+{{ end -}}
+{{ with .Site.Params.yandex_verification -}}
    <meta name="yandex-verification" content="{{ . }}" />
-{{ end }}
-{{ with .Site.Params.pinterest_verification }}
+{{ end -}}
+{{ with .Site.Params.pinterest_verification -}}
    <meta name="p:domain_verify" content="{{ . }}" />
-{{ end }}
-{{ with .Site.Params.baidu_verification }}
+{{ end -}}
+{{ with .Site.Params.baidu_verification -}}
    <meta name=”baidu-site-verification” content="{{ . }}" />
-{{ end }}
-{{ if .PrevInSection }}
-    <link rel="prev" href="{{.PrevInSection.Permalink}}" />
-{{ end }}
-{{ if .NextInSection}}
+{{ end -}}
+{{ if .PrevInSection -}}
+    <link rel="prev" href="{{ .PrevInSection.Permalink }}" />
+{{ end -}}
+{{ if .NextInSection -}}
    <link rel="next" href="{{ .NextInSection.Permalink }}" />
-{{end}}
+{{ end -}}
 <link rel="canonical" href="{{ .Permalink }}" />
 <link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
 <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
@@ -30,20 +30,26 @@
 <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
 <meta name="msapplication-TileColor" content="#da532c">
 <meta name="theme-color" content="#ffffff">
-{{- with .OutputFormats.Get "RSS" -}}
-    <link rel="alternate" href="{{ .RelPermalink }}" type="application/rss+xml" title="{{ site.Title }}">
-    <link rel="feed" href="{{ .RelPermalink }}" type="application/rss+xml" title="{{ site.Title }}">
-{{- end -}}
+{{ with .OutputFormats.Get "RSS" -}}
+    <link rel="alternate" href="{{ .RelPermalink }}" type="application/rss+xml" title="{{ $.Site.Title }}">
+    <link rel="feed" href="{{ .RelPermalink }}" type="application/rss+xml" title="{{ $.Site.Title }}">
+{{ end -}}

-{{- template "_internal/twitter_cards.html" . -}}
+{{ template "_internal/twitter_cards.html" . -}}

-{{- partial "seo_schema.html" . -}}
+{{ partial "seo.html" . -}}

-{{- $res := resources.Get "css/style.scss" | resources.ToCSS | resources.Minify -}}
+{{ $res := resources.Get "css/style.scss" | resources.ToCSS | resources.Minify -}}
 <link rel="stylesheet" href="{{ $res.RelPermalink }}">
-{{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.fontawesome_free_css }}
+{{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.fontawesome_free_css -}}
    {{ .Site.Params.cdn.fontawesome_free_css | safeHTML }}
-{{ else }}
-    {{- $res := resources.Get "css/lib/fontawesome-free/all.min.css" | resources.Minify | resources.Fingerprint "sha512" -}}
+{{ else -}}
+    {{ $res := resources.Get "css/lib/fontawesome-free/all.min.css" | resources.Minify -}}
+    <link rel="stylesheet" href="{{ $res.RelPermalink }}">
+{{ end }}
+{{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.animate_css -}}
+    {{ .Site.Params.cdn.animate_css | safeHTML }}
+{{ else -}}
+    {{ $res := resources.Get "css/lib/animate/animate.min.css" | resources.Minify -}}
    <link rel="stylesheet" href="{{ $res.RelPermalink }}">
 {{ end }}
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,10 +1,9 @@
 <nav class="navbar">
-    <div class="container">
-        <div class="navbar-header header-logo">
+    <div class="navbar-container">
+        <div class="navbar-header">
            <a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
        </div>
-
-        <div class="menu navbar-right">
+        <div class="navbar-menu">
            {{ $currentPage := . }}
            {{ range .Site.Menus.main }}
                <a class="menu-item{{ if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) | or (eq $currentPage.RelPermalink .URL) }} active{{ end }}" href="{{ .URL | absLangURL }}" title="{{ .Title }}">{{ .Name }}</a>
@@ -13,19 +12,18 @@
        </div>
    </div>
 </nav>
-<nav class="navbar-mobile" id="nav-mobile" style="display: none">
-     <div class="container">
+<nav class="navbar-mobile">
+     <div class="navbar-container">
        <div class="navbar-header">
-            <div><a href="javascript:void(0);" class="theme-switch"><i class="fas fa-adjust fa-rotate-180"></i></a>&nbsp;<a href="{{.Site.BaseURL}}">{{ .Site.Title }}</a></div>
-            <div class="menu-toggle">
+            <div><a href="javascript:void(0);" class="theme-switch"><i class="fas fa-adjust fa-rotate-180"></i></a>&nbsp;&nbsp;<a href="{{.Site.BaseURL}}">{{ .Site.Title }}</a></div>
+            <div class="menu-toggle" id="menu-toggle">
                <span></span><span></span><span></span>
            </div>
        </div>
-
-        <div class="menu" id="mobile-menu">
+        <div class="navbar-menu" id="mobile-menu">
            {{ $currentPage := . }}
            {{ range .Site.Menus.main }}
-                <a class="menu-item{{if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }} active{{ end }}" href="{{ .URL | absLangURL }}" title="{{ .Title }}">{{ .Name }}</a>
+                <a class="menu-item" href="{{ .URL | absLangURL }}" title="{{ .Title }}">{{ .Name }}</a>
            {{ end }}
        </div>
    </div>
--- a/layouts/partials/home/profile.html
+++ b/layouts/partials/home/profile.html
@@ -1,4 +1,4 @@
-<div class="intro">
+<div class="home-intro">
    {{ $avatar := "" }}
    {{ if .Site.Params.gravatar.email }}
        {{ $avatar = (printf "https://www.gravatar.com/avatar/%s?s=240&d=mp" (md5 .Site.Params.gravatar.email)) }}
@@ -6,7 +6,7 @@
        {{ $avatar = .Site.Params.avatar }}
    {{ end }}
    {{ if $avatar }}
-        <div class="avatar">
+        <div class="home-avatar">
            <a href="/posts/">
                <img src={{ $avatar }} alt="avatar">
            </a>
@@ -14,7 +14,7 @@
    {{ end }}

    {{ with .Site.Params.subtitle }}
-        <h2 class="description">
+        <h2 class="home-description">
            {{ $id := md5 . | printf "tp-%s" }}
            <div id={{ printf "r%s" $id }} hidden=true>{{ . | safeHTML }}</div>
            <div id={{ $id }} class="typeit"></div>
@@ -26,7 +26,7 @@
        </h2>
    {{ end }}

-    <div class="social-links">
+    <div class="home-social-links">
        {{ partial "home/social.html" . }}
    </div>
 </div>
--- a/layouts/partials/post/footer.html
+++ b/layouts/partials/post/footer.html
@@ -1,5 +1,5 @@
 {{ $modify_date := .Lastmod.Format (.Site.Params.dateFormatToUse | default "2006-01-02") -}}
-<div class="post-footer">
+<div class="post-footer" id="post-footer">
    <div class="post-info">
        <div class="post-info-line">
            <div class="post-info-mod">
--- a/layouts/partials/scripts.html
+++ b/layouts/partials/scripts.html
@@ -3,7 +3,7 @@
 {{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.jquery_js }}
    {{ $jquery = .Site.Params.cdn.jquery_js }}
 {{ else }}
-    {{ $res := resources.Get "js/lib/jquery/jquery.min.js" | resources.Minify }}
+    {{ $res := resources.Get "js/lib/jquery/jquery.slim.min.js" | resources.Minify }}
    {{ $jquery = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
 {{ end }}
 <!-- lazysizes https://github.com/aFarkas/lazysizes -->
@@ -34,26 +34,34 @@
    {{ $katex_auto_render_js = .Site.Params.cdn.katex_auto_render_js }}
 {{ else }}
    {{ $res := resources.Get "js/lib/katex/auto-render.min.js" | resources.Minify }}
-    {{ $katex_auto_render_js = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
+    {{ $katex_auto_render_js = printf "<script defer src=\"%s\" onload=\"renderMathInElement(document.body);\"></script>" $res.RelPermalink }}
 {{ end }}
 {{ $katex := delimit (slice $katex_css $katex_js $katex_auto_render_js) "" }}
 <!-- mermaid https://github.com/knsv/mermaid -->
-{{ $diagram := "" }}
+{{ $mermaid := "" }}
 {{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.mermaid_js }}
-    {{ $diagram = .Site.Params.cdn.mermaid_js }}
+    {{ $mermaid = .Site.Params.cdn.mermaid_js }}
 {{ else }}
    {{ $res := resources.Get "js/lib/mermaid/mermaid.min.js" | resources.Minify }}
-    {{ $diagram = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
+    {{ $mermaid = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
 {{ end }}
-{{ $diagram = delimit (slice $diagram "<script>mermaid.initialize({startOnLoad: true, theme: null,});</script>") "" }}
+{{ $mermaid = delimit (slice $mermaid "<script>mermaid.initialize({startOnLoad: true, theme: null,});</script>") "" }}
 <!-- ECharts https://github.com/apache/incubator-echarts -->
-{{ $echarts := "" }}
+{{ $echarts_js := "" }}
 {{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.echarts_js }}
-    {{ $echarts = .Site.Params.cdn.echarts_js }}
+    {{ $echarts_js = .Site.Params.cdn.echarts_js }}
 {{ else }}
    {{ $res := resources.Get "js/lib/echarts/echarts.min.js" | resources.Minify }}
-    {{ $echarts = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
+    {{ $echarts_js = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
 {{ end }}
+{{ $echarts_macarons_js := "" }}
+{{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.echarts_macarons_js }}
+    {{ $echarts_macarons_js = .Site.Params.cdn.echarts_macarons_js }}
+{{ else }}
+    {{ $res := resources.Get "js/lib/echarts/macarons.js" | resources.Minify }}
+    {{ $echarts_macarons_js = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
+{{ end }}
+{{ $echarts := delimit (slice $echarts_js $echarts_macarons_js) "" }}
 <!-- TypeIt https://github.com/alexmacarthur/typeit -->
 {{ $typeit := "" }}
 {{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.typeit_js }}
@@ -70,7 +78,7 @@
    {{ $res := resources.Get "js/lib/jquery-countdown/jquery.countdown.min.js" | resources.Minify }}
    {{ $countdown = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
 {{ end }}
-<!-- MetingJS https://github.com/metowolf/MetingJS -->
+<!-- APlayer https://github.com/MoePlayer/APlayer -->
 {{ $aplayer_css := "" }}
 {{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.aplayer_css }}
    {{ $aplayer_css = .Site.Params.cdn.aplayer_css }}
@@ -85,31 +93,44 @@
    {{ $res := resources.Get "js/lib/aplayer/APlayer.min.js" | resources.Minify }}
    {{ $aplayer_js = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
 {{ end }}
-{{ $meting_js := "" }}
+{{ $aplayer := delimit (slice $aplayer_css $aplayer_js) "" }}
+<!-- MetingJS https://github.com/metowolf/MetingJS -->
+{{ $meting := "" }}
 {{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.meting_js }}
-    {{ $meting_js = .Site.Params.cdn.meting_js }}
+    {{ $meting = .Site.Params.cdn.meting_js }}
 {{ else }}
    {{ $res := resources.Get "js/lib/meting/Meting.min.js" | resources.Minify }}
-    {{ $meting_js = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
+    {{ $meting = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
+{{ end }}
+<!-- Smooth Scroll https://github.com/cferdinandi/smooth-scroll -->
+{{ $smooth_scroll := "" }}
+{{ if eq (getenv "HUGO_ENV") "production" | and .Site.Params.cdn.smooth_scroll_js }}
+    {{ $smooth_scroll = .Site.Params.cdn.smooth_scroll_js }}
+{{ else }}
+    {{ $res := resources.Get "js/lib/smooth-scroll/smooth-scroll.polyfills.min.js" | resources.Minify }}
+    {{ $smooth_scroll = printf "<script src=\"%s\"></script>" $res.RelPermalink }}
 {{ end }}
-{{ $metingjs := delimit (slice $aplayer_css $aplayer_js $meting_js) "" }}

 {{ $jquery | safeHTML }}
 {{ $lazysizes | safeHTML }}
+{{ $smooth_scroll | safeHTML }}

 {{ if .IsPage }}
-    {{ if .Scratch.Get "diagram" }}
-        {{ $diagram | safeHTML }}
+    {{/*  dev feature */}}
+    {{ if .Params.dev }}
+        {{ with .Scratch.Get "echartsMap" }}
+            {{ $echarts | safeHTML }}
+            {{ $echartsMap := . }}
+            <script>window.echartsMap = {
+                {{ range $key, $var := $echartsMap }}
+                    {{ $key }}: {{ $var | safeJS }},
+                {{ end }}
+            };window.echartsArr=[];</script>
+        {{ end }}
    {{ end }}

-    {{ with .Scratch.Get "echartsMap" }}
-        {{ $echarts | safeHTML }}
-        {{ $echartsMap := . }}
-        <script>var echartsMap = {
-            {{ range $key, $var := $echartsMap }}
-                {{ $key }}: {{ $var | safeJS }},
-            {{ end }}
-        };var echartsArr=[];</script>
+    {{ if .Scratch.Get "diagram" }}
+        {{ $mermaid | safeHTML }}
    {{ end }}

    {{ if or .Params.math .Site.Params.math }}
@@ -117,12 +138,13 @@
    {{ end }}

    {{ if .Scratch.Get "music" }}
-        {{ $metingjs | safeHTML }}
+        {{ $aplayer | safeHTML }}
+        {{ $meting | safeHTML }}
    {{ end }}

    {{ with .Scratch.Get "countdownMap" }}
        {{ $countdown | safeHTML }}
-        <script>var countdownMap = {{ . | jsonify | safeJS }};</script>
+        <script>window.countdownMap = {{ . | jsonify | safeJS }};</script>
    {{ end }}
 {{ end }}

@@ -133,7 +155,7 @@
    {{ range $key, $val := $typeitMap }}
        {{ $typeitArr = $typeitArr | append (slice $val) }}
    {{ end }}
-    <script>var typeitArr = {{ $typeitArr | jsonify | safeJS }};</script>
+    <script>window.typeitArr = {{ $typeitArr | jsonify | safeJS }};</script>
 {{ end }}

 {{ $res := resources.Get "/js/blog.js" | resources.Minify }}
--- a/layouts/partials/seo_schema.html
+++ b/layouts/partials/seo_schema.html
@@ -1,17 +1,17 @@
-{{ if .IsHome }}
+{{ if .IsHome -}}
    <script type="application/ld+json">
    {
    "@context": "http://schema.org",
    "@type": "WebSite",
    "url": "{{ .Site.BaseURL }}",
-    {{ if .Site.Author.name }}
+    {{ with .Site.Author.name }}
        "author": {
            "@type": "Person",
-            "name": "{{ .Site.Author.name }}"
+            "name": "{{ . }}"
        },
    {{ end }}
-    {{ if .Site.Params.description }}
-        "description": "{{ .Site.Params.description }}",
+    {{ with .Site.Params.description }}
+        "description": "{{ . }}",
    {{ end }}
    {{ with .Site.Params.image }}
        "image": "{{ .url | absURL }}",
@@ -25,8 +25,7 @@
    "name": "{{ .Site.Title }}"
    }
    </script>
-
-{{ else if .IsPage }}
+{{ else if .IsPage -}}
    <script type="application/ld+json">
    {
    "@context": "http://schema.org",
@@ -80,13 +79,13 @@
            }
        },
    {{ end }}
-    {{ if .Site.Author.Name }}
+    {{ with .Site.Author.Name }}
        "author": {
            "@type": "Person",
-            "name": "{{ .Site.Author.Name }}"
+            "name": "{{ . }}"
        },
    {{ end }}
    "description": "{{ .Description }}"
    }
    </script>
-{{ end }}
+{{ end }}