summaryrefslogtreecommitdiffstats
path: root/assets/scss/_fuji-theme/_base.scss
diff options
context:
space:
mode:
authorDSRKafuU2020-06-04 07:21:13 -0500
committerGitHub2020-06-04 07:21:13 -0500
commit73244a2e55dffa158027126346eefd5bafa5fea8 (patch)
treec98ee9fbdb6f474579aa769a2a4b0b4c98fd21f1 /assets/scss/_fuji-theme/_base.scss
parentaa5290aeef9df1c583fdf30290351968df9215dc (diff)
parent914bf54c493b299268c293be33a8babf99b1cce2 (diff)
downloadhugo-theme-fuji-73244a2e55dffa158027126346eefd5bafa5fea8.tar.gz
hugo-theme-fuji-73244a2e55dffa158027126346eefd5bafa5fea8.tar.bz2
hugo-theme-fuji-73244a2e55dffa158027126346eefd5bafa5fea8.zip
Merge pull request #24 from amzrk2/dev
v2 pre-release
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..d9a6f7e
--- /dev/null
+++ b/assets/scss/_fuji-theme/_base.scss
@@ -0,0 +1,63 @@
+@mixin light {
+ --color-mode: 'light';
+ --color-primary: #{$light-color-primary};
+ --color-secondary: #{$light-color-secondary};
+ --color-focus: #{$light-color-focus};
+ --color-mute: #{$light-color-mute};
+ --color-font: #{$light-color-font};
+ --color-divider: #{$light-color-divider};
+ --color-bg: #{$light-color-bg};
+ --color-codebg: #{$light-color-codebg};
+}
+
+@mixin dark {
+ --color-mode: 'dark';
+ --color-primary: #{$dark-color-primary};
+ --color-secondary: #{$dark-color-secondary};
+ --color-focus: #{$dark-color-focus};
+ --color-mute: #{$dark-color-mute};
+ --color-font: #{$dark-color-font};
+ --color-divider: #{$dark-color-divider};
+ --color-bg: #{$dark-color-bg};
+ --color-codebg: #{$dark-color-codebg};
+}
+
+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);