refactor: revision of Pagination-TransitionReplace design tokens (#3056)

openedx · May 21, 2024 · 7930c05 · 7930c05
1 parent 9441b8e
commit 7930c05
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 17 deletions.
diff --git a/src/Stepper/index.scss b/src/Stepper/index.scss
@@ -8,8 +8,9 @@
 
   .pgn__stepper-header-step-list {
     list-style: none;
-    // stylelint-disable-next-line max-line-length
-    padding: var(--pgn-spacing-stepper-header-step-list-padding-y) var(--pgn-spacing-stepper-header-step-list-padding-x);
+    padding:
+      var(--pgn-spacing-stepper-header-step-list-padding-y)
+      var(--pgn-spacing-stepper-header-step-list-padding-x);
     display: flex;
     align-items: center;
     margin: var(--pgn-spacing-stepper-header-step-list-margin);

diff --git a/src/Tabs/index.scss b/src/Tabs/index.scss
@@ -30,8 +30,9 @@
       margin: 0;
 
       .dropdown .dropdown-toggle {
-        // stylelint-disable-next-line max-line-length
-        padding: var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-x) var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-y);
+        padding:
+          var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-x)
+          var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-y);
 
         &:focus {
           background-color: var(--pgn-color-tab-more-link-dropdown-toggle-bg-focus);
@@ -62,8 +63,9 @@
   // Nav inverse pills
   &.nav-inverse-pills .pgn__tab_more.nav-link {
     .dropdown .dropdown-toggle {
-      // stylelint-disable-next-line max-line-length
-      padding: var(--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-x) var(--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-y);
+      padding:
+        var(--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-x)
+        var(--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-y);
       border: none;
 
       &:focus {
@@ -97,8 +99,9 @@
 
   // Nav inverse tabs
   &.nav-inverse-tabs .pgn__tab_more.nav-link .dropdown .dropdown-toggle {
-    // stylelint-disable-next-line max-line-length
-    padding: var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-x) var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-y);
+    padding:
+      var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-x)
+      var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-y);
 
     &:hover {
       background-color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-bg-hover);

diff --git a/styles/css/core/variables.css b/styles/css/core/variables.css
@@ -1,7 +1,7 @@
 /**
  * IMPORTANT: This file is the result of assembling design tokens
  * Do not edit directly
- * Generated on Wed, 15 May 2024 08:37:24 GMT
+ * Generated on Wed, 15 May 2024 12:30:36 GMT
  */
 
 :root {
@@ -117,7 +117,7 @@
   --pgn-typography-alert-font-size: .875rem;
   --pgn-spacing-grid-gutter-width: 24px;
   --pgn-spacing-table-cell-padding-sm: .3rem;
-  --pgn-spacing-table-cell-padding-base: 75rem;
+  --pgn-spacing-table-cell-padding-base: .75rem;
   --pgn-spacing-label-margin-bottom: .5rem;
   --pgn-spacing-spacer-base: 1rem;
   --pgn-spacing-spacer-0: 0;
@@ -503,7 +503,6 @@
   --pgn-size-spinner-base-height: var(--pgn-size-spinner-base-width);
   --pgn-size-product-tour-checkpoint-arrow-transparent: var(--pgn-size-product-tour-checkpoint-width-arrow);
   --pgn-size-product-tour-checkpoint-arrow-top: var(--pgn-size-product-tour-checkpoint-width-arrow);
-  --pgn-size-product-tour-checkpoint-arrow-bottom: var(--pgn-size-product-tour-checkpoint-width-arrow) var(--pgn-size-product-tour-checkpoint-width-border);
   --pgn-size-popover-border-radius: var(--pgn-size-border-radius-sm);
   --pgn-size-popover-border-width: var(--pgn-size-border-width);
   --pgn-size-pagination-border-radius-lg: var(--pgn-size-border-radius-lg);

diff --git a/tokens/src/core/components/ProductTour.json b/tokens/src/core/components/ProductTour.json
@@ -8,11 +8,6 @@
           "max": { "value": "480px", "type": "dimension", "source": "$checkpoint-max-width" }
         },
         "arrow": {
-          "bottom": {
-            "value": "{size.product-tour.checkpoint.width.arrow} {size.product-tour.checkpoint.width.border}",
-            "type": "dimension",
-            "source": "$checkpoint-arrow-border-bottom"
-          },
           "top": {
             "value": "{size.product-tour.checkpoint.width.arrow}",
             "type": "dimension",

diff --git a/tokens/src/core/global/spacing.json b/tokens/src/core/global/spacing.json
@@ -23,7 +23,7 @@
     "table": {
       "cell": {
         "padding": {
-          "base": { "value": "75rem", "type": "dimension", "source": "$table-cell-padding", "description": "Padding for tables." },
+          "base": { "value": ".75rem", "type": "dimension", "source": "$table-cell-padding", "description": "Padding for tables." },
           "sm": { "value": ".3rem", "type": "dimension", "source": "$table-cell-padding-sm", "description": "Padding sm for tables." }
         }
       }