feat: compose paragraph

digdir · Sep 26, 2024 · 69f301a · 69f301a
1 parent aa53b02
commit 69f301a
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 13 deletions.
diff --git a/packages/css/baseline/typography.css b/packages/css/baseline/typography.css
@@ -144,7 +144,6 @@
   line-height: var(--ds-paragraph-xs-line-height);
   font-size: var(--ds-paragraph-xs-font-size);
   letter-spacing: var(--ds-paragraph-xs-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -155,7 +154,6 @@
   line-height: var(--ds-paragraph-sm-line-height);
   font-size: var(--ds-paragraph-sm-font-size);
   letter-spacing: var(--ds-paragraph-sm-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -166,7 +164,6 @@
   line-height: var(--ds-paragraph-md-line-height);
   font-size: var(--ds-paragraph-md-font-size);
   letter-spacing: var(--ds-paragraph-md-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -177,7 +174,6 @@
   line-height: var(--ds-paragraph-lg-line-height);
   font-size: var(--ds-paragraph-lg-font-size);
   letter-spacing: var(--ds-paragraph-lg-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -188,7 +184,6 @@
   line-height: var(--ds-paragraph-long-xs-line-height);
   font-size: var(--ds-paragraph-long-xs-font-size);
   letter-spacing: var(--ds-paragraph-long-xs-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -199,7 +194,6 @@
   line-height: var(--ds-paragraph-long-sm-line-height);
   font-size: var(--ds-paragraph-long-sm-font-size);
   letter-spacing: var(--ds-paragraph-long-sm-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -210,7 +204,6 @@
   line-height: var(--ds-paragraph-long-md-line-height);
   font-size: var(--ds-paragraph-long-md-font-size);
   letter-spacing: var(--ds-paragraph-long-md-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -221,7 +214,6 @@
   line-height: var(--ds-paragraph-long-lg-line-height);
   font-size: var(--ds-paragraph-long-lg-font-size);
   letter-spacing: var(--ds-paragraph-long-lg-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -232,7 +224,6 @@
   line-height: var(--ds-paragraph-short-xs-line-height);
   font-size: var(--ds-paragraph-short-xs-font-size);
   letter-spacing: var(--ds-paragraph-short-xs-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -243,7 +234,6 @@
   line-height: var(--ds-paragraph-short-sm-line-height);
   font-size: var(--ds-paragraph-short-sm-font-size);
   letter-spacing: var(--ds-paragraph-short-sm-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -254,7 +244,6 @@
   line-height: var(--ds-paragraph-short-md-line-height);
   font-size: var(--ds-paragraph-short-md-font-size);
   letter-spacing: var(--ds-paragraph-short-md-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 
@@ -265,7 +254,6 @@
   line-height: var(--ds-paragraph-short-lg-line-height);
   font-size: var(--ds-paragraph-short-lg-font-size);
   letter-spacing: var(--ds-paragraph-short-lg-letter-spacing);
-  color: var(--ds-color-neutral-text-default);
   margin: 0;
 }
 

diff --git a/packages/css/button.css b/packages/css/button.css
@@ -10,7 +10,7 @@
   --dsc-button-size: var(--ds-sizing-12);
 
   @composes ds-focus from './utilities.css';
-  @composes ds-paragraph-short from './baseline/typography.css';
+  @composes ds-body-text--short-md from './baseline/typography.css';
 
   align-items: center;
   background: var(--dsc-button-background);
@@ -42,12 +42,16 @@
     --dsc-button-padding-block: var(--ds-spacing-2);
     --dsc-button-padding-inline: var(--ds-spacing-3);
     --dsc-button-size: var(--ds-sizing-10);
+
+    @composes ds-body-text--short-sm from './baseline/typography.css';
   }
 
   &[data-size='lg'] {
     --dsc-button-padding-block: var(--ds-spacing-3);
     --dsc-button-padding-inline: var(--ds-spacing-5);
     --dsc-button-size: var(--ds-sizing-14);
+
+    @composes ds-body-text--short-lg from './baseline/typography.css';
   }
 
   &[data-icon] {