feat: add back to top support

reuixiy · Aug 13, 2019 · bf4d8a3 · bf4d8a3
1 parent 32f00bb
commit bf4d8a3
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 0 deletions.
diff --git a/assets/scss/_common/back-to-top.scss b/assets/scss/_common/back-to-top.scss
@@ -0,0 +1,7 @@
+.back-to-top {
+    font-size: 90%;
+    color: var(--color-contrast-medium);
+    position: fixed;
+    bottom: 1em;
+    right: 1em;
+}
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
@@ -280,6 +280,10 @@
     }
 {{ end }}
 
+{{ if .Site.Params.enableBackToTop }}
+    @import "_common/back-to-top.scss";
+{{ end }}
+
 {{ if .Site.Params.enableFooter }}
     @import "_common/footer.scss";
     {{ with .Site.Params.iconColor }}

diff --git a/data/SVG.toml b/data/SVG.toml
@@ -25,6 +25,7 @@ code-branch = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" cla
 info = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512" class="icon"><path d="M20 424.229h20V279.771H20c-11.046 0-20-8.954-20-20V212c0-11.046 8.954-20 20-20h112c11.046 0 20 8.954 20 20v212.229h20c11.046 0 20 8.954 20 20V492c0 11.046-8.954 20-20 20H20c-11.046 0-20-8.954-20-20v-47.771c0-11.046 8.954-20 20-20zM96 0C56.235 0 24 32.235 24 72s32.235 72 72 72 72-32.235 72-72S135.764 0 96 0z"/></svg>'
 question = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" class="icon"><path d="M202.021 0C122.202 0 70.503 32.703 29.914 91.026c-7.363 10.58-5.093 25.086 5.178 32.874l43.138 32.709c10.373 7.865 25.132 6.026 33.253-4.148 25.049-31.381 43.63-49.449 82.757-49.449 30.764 0 68.816 19.799 68.816 49.631 0 22.552-18.617 34.134-48.993 51.164-35.423 19.86-82.299 44.576-82.299 106.405V320c0 13.255 10.745 24 24 24h72.471c13.255 0 24-10.745 24-24v-5.773c0-42.86 125.268-44.645 125.268-160.627C377.504 66.256 286.902 0 202.021 0zM192 373.459c-38.196 0-69.271 31.075-69.271 69.271 0 38.195 31.075 69.27 69.271 69.27s69.271-31.075 69.271-69.271-31.075-69.27-69.271-69.27z"/></svg>'
 edit = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon"><path d="M402.3 344.9l32-32c5-5 13.7-1.5 13.7 5.7V464c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V112c0-26.5 21.5-48 48-48h273.5c7.1 0 10.7 8.6 5.7 13.7l-32 32c-1.5 1.5-3.5 2.3-5.7 2.3H48v352h352V350.5c0-2.1.8-4.1 2.3-5.6zm156.6-201.8L296.3 405.7l-90.4 10c-26.2 2.9-48.5-19.2-45.6-45.6l10-90.4L432.9 17.1c22.9-22.9 59.9-22.9 82.7 0l43.2 43.2c22.9 22.9 22.9 60 .1 82.8zM460.1 174L402 115.9 216.2 301.8l-7.3 65.3 65.3-7.3L460.1 174zm64.8-79.7l-43.2-43.2c-4.1-4.1-10.8-4.1-14.8 0L436 82l58.1 58.1 30.9-30.9c4-4.2 4-10.8-.1-14.9z"/></svg>'
+arrow-up = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon"><path d="M34.9 289.5l-22.2-22.2c-9.4-9.4-9.4-24.6 0-33.9L207 39c9.4-9.4 24.6-9.4 33.9 0l194.3 194.3c9.4 9.4 9.4 24.6 0 33.9L413 289.4c-9.5 9.5-25 9.3-34.3-.4L264 168.6V456c0 13.3-10.7 24-24 24h-32c-13.3 0-24-10.7-24-24V168.6L69.2 289.1c-9.3 9.8-24.8 10-34.3.4z"/></svg>'
 
 # Chinese Zodiac
 # Extract from https://github.com/forsigner/fexo/blob/master/source/fonts/fontello.ttf

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
@@ -8,6 +8,7 @@
             {{ partial "multilingual.html" . }}
             {{ partial "dark-mode.html" . }}
             {{ block "main" . }}{{ end }}
+            {{ partial "back-to-top.html" . }}
             {{ partial "footer.html" . }}
         </div>
     </body>

diff --git a/layouts/partials/back-to-top.html b/layouts/partials/back-to-top.html
@@ -0,0 +1,3 @@
+{{ if or (and .IsHome .Site.Params.displayBackToTopInHome) (and (not .IsHome) .Site.Params.enableBackToTop) }}
+    <a href="#" class="back-to-top">{{ index .Site.Data.SVG .Site.Params.backToTopIcon | safeHTML }}</a>
+{{ end }}