summaryrefslogtreecommitdiffstats
path: root/assets/scss/_fuji-theme/_base.scss
diff options
context:
space:
mode:
authoramzrk22020-06-01 15:44:04 +0800
committeramzrk22020-06-01 15:44:04 +0800
commit02c3891865c7741b8f772aea75cc01564d2f0ff4 (patch)
treedb0e4dd8c3ef95181f5e665ca09f731b75de0387 /assets/scss/_fuji-theme/_base.scss
parent2338da969d3bc1b2bc26df9f7192dd20a0906c5b (diff)
downloadhugo-theme-fuji-02c3891865c7741b8f772aea75cc01564d2f0ff4.tar.gz
hugo-theme-fuji-02c3891865c7741b8f772aea75cc01564d2f0ff4.tar.bz2
hugo-theme-fuji-02c3891865c7741b8f772aea75cc01564d2f0ff4.zip
Remove jQuery
Diffstat (limited to 'assets/scss/_fuji-theme/_base.scss')
-rw-r--r--assets/scss/_fuji-theme/_base.scss63
1 files changed, 63 insertions, 0 deletions
diff --git a/assets/scss/_fuji-theme/_base.scss b/assets/scss/_fuji-theme/_base.scss
new file mode 100644
index 0000000..d35d8b6
--- /dev/null
+++ b/assets/scss/_fuji-theme/_base.scss
@@ -0,0 +1,63 @@
+@mixin light {
+ --color-mode: 'light';
+ --color-primary: #8aa2d3; // https://irocore.com/aofuji/
+ --color-secondary: #8f82bc; // https://irocore.com/fujimurasaki/
+ --color-focus: #3b469b; // https://irocore.com/aomurasaki/
+ --color-mute: #9ea1a3; // https://irocore.com/suzu-iro/
+ --color-font: #3f4551; // https://irocore.com/konnezu/
+ --color-divider: #e5e2e4; // https://irocore.com/komachinezu/
+ --color-bg: #fffffd; // https://irocore.com/shiro/
+ --color-codebg: #f6f8fa; // GitHub
+}
+
+@mixin dark {
+ --color-mode: 'dark';
+ --color-primary: #8aa2d3; // https://irocore.com/aofuji/
+ --color-secondary: #bab1df; // kai https://irocore.com/fujimurasaki/
+ --color-focus: #e6e6e6; // https://irocore.com/shironezumi/
+ --color-mute: #9ea1a3; // https://irocore.com/suzu-iro/
+ --color-font: #c0c0c0; // https://irocore.com/gin-iro/
+ --color-divider: #4d5158; // Discord
+ --color-bg: #2f3136; // Discord
+ --color-codebg: #414449; // kai GitHub
+}
+
+body[data-theme='auto'] {
+ @include light();
+
+ @media (prefers-color-scheme: dark) {
+ @include dark();
+ @import '_dark-diff'; // things different from light
+ }
+}
+
+body[data-theme='light'] {
+ @include light();
+}
+
+body[data-theme='dark'] {
+ @include dark();
+ @import '_dark-diff'; // things different from light
+}
+
+@mixin link-1 {
+ a {
+ color: var(--color-primary);
+ }
+
+ a:hover {
+ color: var(--color-secondary);
+ }
+}
+
+@mixin link-2 {
+ a {
+ color: var(--color-secondary);
+ }
+
+ a:hover {
+ color: var(--color-focus);
+ }
+}
+
+$divider: 2px solid var(--color-divider);