Re-add heading highlight

2 files changed, 20 insertions, 0 deletions

diff --git a/src/objects/_heading.scss b/src/objects/_heading.scss
index b6ae3a4..7cfd9af 100644
--- a/src/objects/_heading.scss
+++ b/src/objects/_heading.scss
@@ -25,6 +25,16 @@
             margin-top: fn.global-dim(--heading --margin-top-sibling);
         }
 
+        @include iro.bem-elem('highlight') {
+            background-image: linear-gradient(
+                to top,
+                transparent .15em,
+                fn.color(--bg) .15em,
+                fn.color(--bg) .6em,
+                transparent .6em
+            );
+        }
+
         @include iro.bem-modifier('xxl') {
             @include mx.heading-strong(fn.global-dim(--heading --lg));
         }
diff --git a/src/scopes/_headings.scss b/src/scopes/_headings.scss
index 5b05b45..2f97ec5 100644
--- a/src/scopes/_headings.scss
+++ b/src/scopes/_headings.scss
@@ -34,6 +34,16 @@
             @include mx.heading-faint(fn.global-dim(--heading --sm));
         }
 
+        @include iro.bem-elem('highlight') {
+            background-image: linear-gradient(
+                to top,
+                transparent .15em,
+                fn.color(--bg) .15em,
+                fn.color(--bg) .6em,
+                transparent .6em
+            );
+        }
+
         @include iro.bem-modifier('display') {
             h1,
             h2,