Initial commit

2 files changed, 78 insertions, 0 deletions

diff --git a/assets/sass/_custom.scss b/assets/sass/_custom.scss
new file mode 100644
index 0000000..7f1bab3
--- /dev/null
+++ b/assets/sass/_custom.scss
@@ -0,0 +1,25 @@
+.nav_brand picture, .nav_brand img {
+	max-width: 22rem;
+}
+
+a {
+	text-decoration: underline;
+}
+
+a.button, nav a {
+	text-decoration: none;
+}
+
+b, strong {
+	font-weight: 700;
+}
+
+.page-home .content img {
+	border-radius: 1rem;
+}
+
+@media screen and (min-width: 557px) {
+	.button_grid {
+		max-width: 30rem;
+	}
+}
diff --git a/assets/sass/_variables.sass b/assets/sass/_variables.sass
new file mode 100644
index 0000000..3ddef89
--- /dev/null
+++ b/assets/sass/_variables.sass
@@ -0,0 +1,53 @@
+html
+  --color-mode: "light"
+  --light: #fff
+  --dark:  rgb(28,28,30)
+  --haze: #c5d3dd
+  --bubble: rgb(36,36,38)
+  --accent: var(--haze)
+  --bg: var(--light)
+  --code-bg: var(--accent)
+  --overlay: var(--light)
+  --text: #111
+  --font: 'Metropolis', sans-serif
+  --border-color: #eee
+  --inline-color: darkgoldenrod
+  --theme: #3366CC
+  --ease: ease
+  --scroll-thumb: rgba(0,0,0,.06)
+  --search-border-color: transparent
+  --next-icon-path: url(../images/icons/double-arrow.svg)
+  --never-icon-path: url(../images/sitting.svg)
+
+  @mixin darkmode
+    --color-mode: "dark"
+    --theme: #3366CC
+    --bg: var(--dark)
+    --text: #eee
+    --accent: var(--bubble)
+    --overlay: var(--bubble)
+    --border-color: transparent
+    --scroll-thumb: rgba(255,255,255,.06)
+    --search-bg: var(--accent)
+    --search-border-color: var(--accent)
+    *
+      box-shadow: none !important
+
+  &[data-mode="dark"]
+    @include darkmode
+    .color
+      &_choice
+        &::after
+          background-image: var(--moon-icon)
+
+  &[data-mode="auto"]
+    @media (prefers-color-scheme: dark)
+      @include darkmode
+
+%narrow
+  max-width: 750px
+  margin: 0 auto
+
+blockquote
+  + .highlight_wrap
+    margin-top: 2.25rem