add character limit tokens for gcds-heading

cds-snc · Oct 19, 2023 · 38cdc28 · 38cdc28
1 parent c39cd48
commit 38cdc28
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 11 deletions.
diff --git a/packages/web/package-lock.json b/packages/web/package-lock.json
diff --git a/packages/web/package.json b/packages/web/package.json
@@ -43,7 +43,7 @@
     "@babel/core": "^7.20.12",
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-typescript": "^7.21.0",
-    "@cdssnc/gcds-tokens": "^1.7.0",
+    "@cdssnc/gcds-tokens": "^1.9.0",
     "@fortawesome/fontawesome-free": "^6.3.0",
     "@stencil/angular-output-target": "^0.8.1",
     "@stencil/postcss": "^2.1.0",

diff --git a/packages/web/src/components/gcds-heading/gcds-heading.css b/packages/web/src/components/gcds-heading/gcds-heading.css
@@ -228,27 +228,27 @@ variants;
 
     /* Character limit */
     h1.limit {
-      max-width: 31ch;
+      max-width: var(--gcds-heading-character-limit-h1);
     }
 
     h2.limit {
-      max-width: 35ch;
+      max-width: var(--gcds-heading-character-limit-h2);
     }
 
     h3.limit {
-      max-width: 40ch;
+      max-width: var(--gcds-heading-character-limit-h3);
     }
 
     h4.limit {
-      max-width: 45ch;
+      max-width: var(--gcds-heading-character-limit-h4);
     }
 
     h5.limit {
-      max-width: 50ch;
+      max-width: var(--gcds-heading-character-limit-h5);
     }
 
     h6.limit {
-      max-width: 57ch;
+      max-width: var(--gcds-heading-character-limit-h6);
     }
   }
 }