fix: update required label font weight + add mobile breadcrumbs item …

…tokens (#304) * fix: required label font weight * refactor: add mobile tokens for breadcrumbs item
cds-snc · Aug 13, 2024 · 4359e16 · 4359e16
1 parent 256d57b
commit 4359e16
Show file tree

Hide file tree

Showing 10 changed files with 60 additions and 0 deletions.
diff --git a/build/figma/figma.tokens.json b/build/figma/figma.tokens.json
@@ -1268,6 +1268,24 @@
       "padding": {
         "value": "0 0 0 0.375rem",
         "type": "spacing"
+      },
+      "mobile": {
+        "item": {
+          "arrow": {
+            "top": {
+              "value": "0.1875rem",
+              "type": "spacing"
+            }
+          },
+          "margin": {
+            "value": "0.375rem 0",
+            "type": "spacing"
+          },
+          "padding": {
+            "value": "0",
+            "type": "spacing"
+          }
+        }
       }
     },
     "button": {

diff --git a/build/web/css/.css b/build/web/css/.css
@@ -250,6 +250,9 @@
   --gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
   --gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
   --gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+  --gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+  --gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+  --gcds-breadcrumbs-mobile-item-padding: 0;
   --gcds-button-border-radius: 0.375rem;
   --gcds-button-border-width: 0.125rem;
   --gcds-button-danger-default-background: #a62a1e;

diff --git a/build/web/css/components.css b/build/web/css/components.css
@@ -106,6 +106,9 @@
   --gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
   --gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
   --gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+  --gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+  --gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+  --gcds-breadcrumbs-mobile-item-padding: 0;
   --gcds-button-border-radius: 0.375rem;
   --gcds-button-border-width: 0.125rem;
   --gcds-button-danger-default-background: #a62a1e;

diff --git a/build/web/css/components/breadcrumbs.css b/build/web/css/components/breadcrumbs.css
@@ -11,4 +11,7 @@
   --gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
   --gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
   --gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+  --gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+  --gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+  --gcds-breadcrumbs-mobile-item-padding: 0;
 }
diff --git a/build/web/css/tokens.css b/build/web/css/tokens.css
@@ -250,6 +250,9 @@
   --gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
   --gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
   --gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+  --gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+  --gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+  --gcds-breadcrumbs-mobile-item-padding: 0;
   --gcds-button-border-radius: 0.375rem;
   --gcds-button-border-width: 0.125rem;
   --gcds-button-danger-default-background: #a62a1e;

diff --git a/build/web/scss/.scss b/build/web/scss/.scss
@@ -248,6 +248,9 @@ $gcds-breadcrumbs-item-margin: 0.75rem 0;
 $gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
 $gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
 $gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+$gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+$gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+$gcds-breadcrumbs-mobile-item-padding: 0;
 $gcds-button-border-radius: 0.375rem;
 $gcds-button-border-width: 0.125rem;
 $gcds-button-danger-default-background: #a62a1e;

diff --git a/build/web/scss/components.scss b/build/web/scss/components.scss
@@ -104,6 +104,9 @@ $gcds-breadcrumbs-item-margin: 0.75rem 0;
 $gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
 $gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
 $gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+$gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+$gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+$gcds-breadcrumbs-mobile-item-padding: 0;
 $gcds-button-border-radius: 0.375rem;
 $gcds-button-border-width: 0.125rem;
 $gcds-button-danger-default-background: #a62a1e;

diff --git a/build/web/scss/components/breadcrumbs.scss b/build/web/scss/components/breadcrumbs.scss
@@ -9,3 +9,6 @@ $gcds-breadcrumbs-item-margin: 0.75rem 0;
 $gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
 $gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
 $gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+$gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+$gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+$gcds-breadcrumbs-mobile-item-padding: 0;
diff --git a/build/web/scss/tokens.scss b/build/web/scss/tokens.scss
@@ -248,6 +248,9 @@ $gcds-breadcrumbs-item-margin: 0.75rem 0;
 $gcds-breadcrumbs-item-padding: 0 0 0 1.5rem;
 $gcds-breadcrumbs-margin: 0 0 0 -0.375rem;
 $gcds-breadcrumbs-padding: 0 0 0 0.375rem;
+$gcds-breadcrumbs-mobile-item-arrow-top: 0.1875rem;
+$gcds-breadcrumbs-mobile-item-margin: 0.375rem 0;
+$gcds-breadcrumbs-mobile-item-padding: 0;
 $gcds-button-border-radius: 0.375rem;
 $gcds-button-border-width: 0.125rem;
 $gcds-button-danger-default-background: #a62a1e;

diff --git a/tokens/components/breadcrumbs/tokens.json b/tokens/components/breadcrumbs/tokens.json
@@ -39,6 +39,24 @@
     "padding": {
       "value": "0 0 0 {spacing.100.value}",
       "type": "spacing"
+    },
+    "mobile": {
+      "item": {
+        "arrow": {
+          "top": {
+            "value": "{spacing.50.value}",
+            "type": "spacing"
+          }
+        },
+        "margin": {
+          "value": "{spacing.100.value} 0",
+          "type": "spacing"
+        },
+        "padding": {
+          "value": "0",
+          "type": "spacing"
+        }
+      }
     }
   }
 }