refactor: refactoring after review

openedx · Dec 30, 2022 · 6ec66a5 · 6ec66a5
1 parent 0016478
commit 6ec66a5
Show file tree

Hide file tree

Showing 7 changed files with 11 additions and 6 deletions.
diff --git a/scss/core/css/variables.css b/scss/core/css/variables.css
@@ -1,7 +1,7 @@
 :root {
   --pgn-theme-interval: 8%;
   --pgn-other-tooltip-opacity: 1;
-  --pgn-other-modal-disabled-opacity: .3;
+  --pgn-other-search-field-disabled-opacity: .3;
   --pgn-other-modal-opacity: .5;
   --pgn-other-link-emphasized-hover-darken-percentage: 15%;
   --pgn-other-form-feedback-tooltip-opacity: .9;
@@ -484,6 +484,7 @@
   --pgn-color-btn-border-tertiary: #00000000;
   --pgn-color-btn-bg-inverse-tertiary: #00000000;
   --pgn-color-btn-bg-tertiary: #00000000;
+  --pgn-transition-carousel-base: transform var(--pgn-transition-carousel-duration) ease-in-out;
   --pgn-elevation-scrollable-body-box-shadow: #0000008C;
   --pgn-elevation-input-btn-focus-box-shadow: 0 0 0 var(--pgn-size-input-btn-focus-width) var(--pgn-color-input-btn-focus);
   --pgn-elevation-form-control-file-base: var(--pgn-elevation-form-input-base);

diff --git a/src/Carousel/_variables.scss b/src/Carousel/_variables.scss
@@ -19,4 +19,4 @@ $carousel-control-prev-icon-bg: var(--pgn-content-carousel-control-bg-prev-icon)
 $carousel-control-next-icon-bg: var(--pgn-content-carousel-control-bg-next-icon) !default;
 
 // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
-$carousel-transition: transform var(--pgn-transition-carousel-duration) ease-in-out !default;
+$carousel-transition: var(--pgn-transition-carousel-base) !default;
diff --git a/src/SearchField/_variables.scss b/src/SearchField/_variables.scss
@@ -2,7 +2,7 @@ $search-border-radius: var(--pgn-size-search-field-border-radius) !default;
 $search-border-color: var(--pgn-color-search-field-border-base) !default;
 $search-border-color-interaction: var(--pgn-color-search-field-border-interaction) !default;
 $search-border-width: var(--pgn-size-search-field-border-width-base) !default;
-$search-disabled-opacity: var(--pgn-other-modal-disabled-opacity) !default;
+$search-disabled-opacity: var(--pgn-other-search-field-disabled-opacity) !default;
 $search-button-margin: var(--pgn-spacing-search-field-margin-button) !default;
 $input-height-search: var(--pgn-size-search-field-search-input-height) !default;
 $search-border-focus-color: var(--pgn-color-search-field-border-focus) !default;

diff --git a/tokens/src/components/Carousel.json b/tokens/src/components/Carousel.json
@@ -39,6 +39,10 @@
   },
   "transition": {
     "carousel": {
+      "base": {
+        "value": "transform {transition.carousel.duration.value} ease-in-out",
+        "source": "$carousel-transition-duration"
+      },
       "duration": { "value": ".6s", "source": "$carousel-transition-duration" },
       "indicator": { "value": "opacity .6s ease", "source": "$carousel-indicator-transition" },
       "control": { "value": "opacity .15s ease", "source": "$carousel-control-transition" }

diff --git a/tokens/src/components/SearchField.json b/tokens/src/components/SearchField.json
@@ -35,7 +35,7 @@
     }
   },
   "other": {
-    "modal": {
+    "search-field": {
       "disabled-opacity": { "value": ".3", "source": "$search-disabled-opacity" }
     }
   }

diff --git a/tokens/variables-maps/css-to-scss.json b/tokens/variables-maps/css-to-scss.json
diff --git a/tokens/variables-maps/scss-to-css.json b/tokens/variables-maps/scss-to-css.json