From a6d3fbcfe90103ac3000d98cc97879d1c5c00915 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Fri, 10 Jun 2022 22:04:37 +0200
Subject: Updated headings

---
 src/scopes/_blockquote.scss      | 25 --------------
 src/scopes/_blockquotes.scss     | 25 ++++++++++++++
 src/scopes/_headings.scss        | 75 ++++++++++++++++++++++++++++++++++++++++
 src/scopes/_invisible-links.scss | 15 ++++++++
 4 files changed, 115 insertions(+), 25 deletions(-)
 delete mode 100644 src/scopes/_blockquote.scss
 create mode 100644 src/scopes/_blockquotes.scss
 create mode 100644 src/scopes/_headings.scss
 create mode 100644 src/scopes/_invisible-links.scss

(limited to 'src/scopes')

diff --git a/src/scopes/_blockquote.scss b/src/scopes/_blockquote.scss
deleted file mode 100644
index e997b9b..0000000
--- a/src/scopes/_blockquote.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-@use 'iro-sass/src/index' as iro;
-@use '../functions' as fn;
-
-@include iro.props-namespace('blockquote') {
-    @include iro.props-store((
-        --dims: (
-            --pad-x:      fn.global-dim(--size --250),
-            --margin-top: fn.global-dim(--paragraph --margin-top),
-        )
-    ), 'dims');
-
-    @include iro.props-store((
-        --colors: (
-            --border: fn.global-color(--obj-hi),
-        )
-    ), 'colors');
-
-    @include iro.bem-scope(iro.props-namespace()) {
-        blockquote {
-            margin:       fn.dim(--margin-top) 0 0 1px;
-            padding-left: calc(fn.dim(--pad-x) - 3px);
-            border-left:  3px solid fn.color(--border);
-        }
-    }
-}
diff --git a/src/scopes/_blockquotes.scss b/src/scopes/_blockquotes.scss
new file mode 100644
index 0000000..8f25df9
--- /dev/null
+++ b/src/scopes/_blockquotes.scss
@@ -0,0 +1,25 @@
+@use 'iro-sass/src/index' as iro;
+@use '../functions' as fn;
+
+@include iro.props-namespace('blockquotes') {
+    @include iro.props-store((
+        --dims: (
+            --pad-x:      fn.global-dim(--size --250),
+            --margin-top: fn.global-dim(--paragraph --margin-top),
+        )
+    ), 'dims');
+
+    @include iro.props-store((
+        --colors: (
+            --border: fn.global-color(--obj-hi),
+        )
+    ), 'colors');
+
+    @include iro.bem-scope(iro.props-namespace()) {
+        blockquote {
+            margin:       fn.dim(--margin-top) 0 0 1px;
+            padding-left: calc(fn.dim(--pad-x) - 3px);
+            border-left:  3px solid fn.color(--border);
+        }
+    }
+}
diff --git a/src/scopes/_headings.scss b/src/scopes/_headings.scss
new file mode 100644
index 0000000..b1ef537
--- /dev/null
+++ b/src/scopes/_headings.scss
@@ -0,0 +1,75 @@
+@use 'iro-sass/src/index' as iro;
+@use '../functions' as fn;
+@use '../mixins' as mx;
+
+@include iro.props-namespace('headings') {
+    @include iro.bem-scope(iro.props-namespace()) {
+        h1,
+        h2,
+        h3,
+        h4,
+        h5,
+        h6 {
+            @include mx.set-font(--headline);
+
+            display:        block;
+            letter-spacing: normal;
+            text-transform: none;
+        }
+
+
+        h1 {
+            color:     fn.foreign-color(--heading, --strong);
+            font-size: fn.global-dim(--font-size --1000);
+        }
+
+        h2 {
+            color:     fn.foreign-color(--heading, --strong);
+            font-size: fn.global-dim(--font-size --700);
+        }
+
+        h3 {
+            color:     fn.foreign-color(--heading, --strong);
+            font-size: fn.global-dim(--font-size --400);
+        }
+
+        h4 {
+            color:     fn.foreign-color(--heading, --strong);
+            font-size: fn.global-dim(--font-size --200);
+        }
+
+        h5 {
+            @include mx.set-font(--standard, (
+                --line-height: null,
+                --size:        fn.global-dim(--font-size --100),
+                --weight:      bold,
+                --transform:   uppercase,
+                --spacing:     1px
+            ));
+
+            color: fn.foreign-color(--heading, --strong);
+        }
+
+        h6 {
+            @include mx.set-font(--standard, (
+                --line-height: null,
+                --size:        fn.global-dim(--font-size --50),
+                --weight:      500,
+                --transform:   uppercase,
+                --spacing:     1px
+            ));
+
+            color: fn.foreign-color(--heading, --light);
+        }
+
+        @include iro.bem-elem('primary') {
+            background-image: linear-gradient(
+                to top,
+                transparent .15em,
+                fn.foreign-color(--heading, --bg) .15em,
+                fn.foreign-color(--heading, --bg) .6em,
+                transparent .6em
+            );
+        }
+    }
+}
diff --git a/src/scopes/_invisible-links.scss b/src/scopes/_invisible-links.scss
new file mode 100644
index 0000000..71dd9da
--- /dev/null
+++ b/src/scopes/_invisible-links.scss
@@ -0,0 +1,15 @@
+@use 'iro-sass/src/index' as iro;
+
+@include iro.props-namespace('invisible-links') {
+    @include iro.bem-scope(iro.props-namespace()) {
+        :link,
+        :visited {
+            color:           currentColor;
+            text-decoration: none;
+
+            &:hover {
+                text-decoration: underline;
+            }
+        }
+    }
+}
-- 
cgit v1.2.3-70-g09d2