feat: add underline styles for h3

kiva · Sep 16, 2024 · 31d82fb · 31d82fb
1 parent 8f7c0ed
commit 31d82fb
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/@kiva/kv-components/vue/KvThemeProvider.vue b/@kiva/kv-components/vue/KvThemeProvider.vue
@@ -84,8 +84,10 @@ export default {
 .tw-text-jumbo u,
 .tw-text-h1 u,
 .tw-text-h2 u,
+.tw-text-h3 u,
 h1 u,
-h2 u {
+h2 u,
+h3 u {
   text-decoration: none;
   box-decoration-break: clone;
   background-image: var(--heading-underline-primary);
@@ -106,7 +108,11 @@ h2 u {
   background-size: 100% 0.375rem;
   padding-bottom: 0.125rem;
 }
-
+.tw-text-h3 u,
+h3 u {
+  background-size: 100% 0.375rem;
+  padding-bottom: 0.2rem;
+}
 @screen lg {
 	.tw-text-jumbo u {
 		background-size: 100% 1rem;

diff --git a/@kiva/kv-components/vue/stories/KvThemeProvider.stories.js b/@kiva/kv-components/vue/stories/KvThemeProvider.stories.js
@@ -50,6 +50,7 @@ const demoTemplate = `
 			<h1 class="tw-text-jumbo tw-mb-2">Jumbo: The quick <u>brown fox</u> jumped <u>over the lazy dog</u></h1>
 			<h1 class="tw-mb-2">H1: The quick <u>brown fox</u> jumped <u>over the lazy dog</u></h1>
 			<h2 class="tw-mb-2">H2: The quick <u>brown fox</u> jumped <u>over the lazy dog</u></h2>
+			<h3 class="tw-mb-2">H3: The quick <u>brown fox</u> jumped <u>over the lazy dog</u></h3>
 			<p>Body text: Voluptate culpa qui excepteur irure ad. Culpa commodo aliquip irure sunt do. Irure incididunt consequat reprehenderit ipsum mollit esse. Ex veniam nulla consequat deserunt fugiat est do in do sint sint ex.</p>
 		</section>
 		<kv-grid as="section" class="tw-grid-cols-2 tw-p-4 tw-gap-2" style="background-color: gray;">