aboutsummaryrefslogtreecommitdiffstats
path: root/app/assets/stylesheets/layout/_document.scss
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/stylesheets/layout/_document.scss')
-rw-r--r--app/assets/stylesheets/layout/_document.scss48
1 files changed, 48 insertions, 0 deletions
diff --git a/app/assets/stylesheets/layout/_document.scss b/app/assets/stylesheets/layout/_document.scss
new file mode 100644
index 0000000..1607659
--- /dev/null
+++ b/app/assets/stylesheets/layout/_document.scss
@@ -0,0 +1,48 @@
+/**
+ * Document
+ * Content-box & Responsive typography
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Add border box sizing in all browsers (opinionated)
+// 2. Backgrounds do not repeat by default (opinionated)
+*,
+*::before,
+*::after {
+ box-sizing: border-box; // 1
+ background-repeat: no-repeat; // 2
+}
+
+// 1. Add text decoration inheritance in all browsers (opinionated)
+// 2. Add vertical alignment inheritance in all browsers (opinionated)
+::before,
+::after {
+ text-decoration: inherit; // 1
+ vertical-align: inherit; // 2
+}
+
+// 1. Use the default cursor in all browsers (opinionated)
+// 2. Change the line height in all browsers (opinionated)
+// 3. Breaks words to prevent overflow in all browsers (opinionated)
+// 4. Use a 4-space tab width in all browsers (opinionated)
+// 5. Remove the grey highlight on links in iOS (opinionated)
+// 6. Prevent adjustments of font size after orientation changes in iOS
+:where(:root) {
+ -webkit-tap-highlight-color: transparent; // 5
+ -webkit-text-size-adjust: 100%; // 6
+ text-size-adjust: 100%; // 6
+ background-color: var(--background-color);
+ color: var(--color);
+ font-weight: var(--font-weight);
+ font-size: var(--font-size);
+ line-height: var(--line-height); // 2
+ font-family: var(--font-family);
+ text-rendering: optimizeLegibility;
+ overflow-wrap: break-word; // 3
+ cursor: default; // 1
+ tab-size: 4; // 4
+}