From 69f301a6e0ef01ef54c73b3026adf4e876b1612f Mon Sep 17 00:00:00 2001
From: barsnes <tobias.barsnes@digdir.no>
Date: Thu, 26 Sep 2024 08:29:49 +0200
Subject: [PATCH] feat: compose paragraph

---
 packages/css/baseline/typography.css | 12 ------------
 packages/css/button.css              |  6 +++++-
 2 files changed, 5 insertions(+), 13 deletions(-)

diff --git a/packages/css/baseline/typography.css b/packages/css/baseline/typography.css
index 695bf19355..8ea1ba46bf 100644
--- 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
index 6effbd8f56..da2c236a2e 100644
--- 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] {