Initial commit 🚀

scss/layout/_document.scss

@@ -0,0 +1,68 @@
+/**
+ * Document
+ * Content-box & Responsive typography
+ */
+
+
+// Reboot
+// Based on normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// ––––––––––––––––––––
+
+// Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
+*,
+*::before,
+*::after {
+  box-sizing: border-box; // 1
+}
+
+// 1. Correct the line height in all browsers.
+// 2. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.
+// 3. Change the default tap highlight to be completely transparent in iOS.
+html {
+  -webkit-text-size-adjust: 100%; // 2
+  -webkit-tap-highlight-color: rgba(0,0,0,0); // 3
+  background: var(--background);
+  color: var(--text);
+  font-family: $sans-serif;
+  font-size: map-get($base-font, "xs");
+  font-weight: $text-weight;
+  line-height: $line-height; // 1
+  text-rendering: optimizeLegibility;
+
+  @if map-get($breakpoints, "sm") and
+    map-get($base-font, "sm") and
+    $enable-responsive-typography {
+
+    @media (min-width: map-get($breakpoints, "sm")) {
+      font-size: map-get($base-font, "sm");
+    }
+  }
+
+  @if map-get($breakpoints, "md") and
+    map-get($base-font, "md") and
+    $enable-responsive-typography {
+
+    @media (min-width: map-get($breakpoints, "md")) {
+      font-size: map-get($base-font, "md");
+    }
+  }
+
+  @if map-get($breakpoints, "lg") and
+    map-get($base-font, "lg") and
+    $enable-responsive-typography {
+
+    @media (min-width: map-get($breakpoints, "lg")) {
+      font-size: map-get($base-font, "lg");
+    }
+  }
+
+  @if map-get($breakpoints, "xl") and
+    map-get($base-font, "xl") and
+    $enable-responsive-typography {
+
+    @media (min-width: map-get($breakpoints, "xl")) {
+      font-size: map-get($base-font, "xl");
+    }
+  }
+
+}