add WIP pure-CSS scroll indicator

Amolith created 2 years ago

Change summary

themes/secluded/assets/scss/_header.scss     | 18 ++++++++++++++++++
themes/secluded/layouts/partials/header.html |  1 +
2 files changed, 19 insertions(+)

Detailed changes

themes/secluded/assets/scss/_header.scss

@@ -1,3 +1,21 @@
+/*
+body {
+    background: linear-gradient(to right top, $button-border 50%, $button-background 50%);
+    background-size: 100% calc(100% - 100vh + #{5px});
+    background-repeat: no-repeat;
+}
+
+body:before {
+    content:'';
+    position: fixed;
+    top: 5px;
+    bottom: 0;
+    width: 100%;
+    z-index: -1;
+    background: $light;
+}
+ */
+
 .title-wrapper {
     max-width: 800px;
     margin: 0 auto;

themes/secluded/layouts/partials/header.html

@@ -1,3 +1,4 @@
+<header class="scroller"></header>
 <div class="title-wrapper">
     <span class="title"><a href="{{ .Site.BaseURL }}">{{ $.Site.Title }}</a></span>
     <span class="menu">