diff options
| -rw-r--r-- | _config.yml | 9 | ||||
| -rw-r--r-- | _sass/misc/click-to-top.scss | 11 | ||||
| -rw-r--r-- | assets/css/main.scss | 6 |
3 files changed, 24 insertions, 2 deletions
diff --git a/_config.yml b/_config.yml index 40d9762..742c7f2 100644 --- a/_config.yml +++ b/_config.yml @@ -195,6 +195,15 @@ yat: # left: 100 # right: 100 +# Click to top settings +# click_to_top: +# light: +# background_color: "white" +# color: "#454545" +# dark: +# background_color: "#34323d" +# color: "#bbb" + # Disqus comments # disqus: # shortname: "Your Disqus username" diff --git a/_sass/misc/click-to-top.scss b/_sass/misc/click-to-top.scss index 00f543c..84495aa 100644 --- a/_sass/misc/click-to-top.scss +++ b/_sass/misc/click-to-top.scss @@ -9,7 +9,6 @@ border-radius: 32px; right: 60px; bottom: 48px; - background: white; cursor: pointer; opacity: 0; transform: translateY(10px); @@ -39,8 +38,16 @@ transform: translateY(0); } +html[data-theme="light"] { + .click-to-top { + background-color: $click-to-top-light-background-color; + color: $click-to-top-light-color; + } +} + html[data-theme="dark"] { .click-to-top { - background: #34323D; + background-color: $click-to-top-dark-background-color; + color: $click-to-top-dark-color; } } diff --git a/assets/css/main.scss b/assets/css/main.scss index 8b7bcb4..4b1b4ca 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -35,4 +35,10 @@ $brand-color: map-get($brand-colors, "orangered"); $content-width: {{ site.content_width | default: '920px' }}; +// Click to top theme +$click-to-top-light-background-color: {{ site.click_to_top.light.background_color | default: "white" }}; +$click-to-top-light-color: {{ site.click_to_top.light.color | default: "#454545" }}; +$click-to-top-dark-background-color: {{ site.click_to_top.dark.background_color | default: "#34323d" }}; +$click-to-top-dark-color: {{ site.click_to_top.dark.color | default: "#bbb" }}; + @import "yat"; |