From b3f4a232b679df9aabcf6e26351b139879ea85f7 Mon Sep 17 00:00:00 2001 From: ghiscoding Date: Sat, 9 Nov 2024 14:46:37 -0500 Subject: [PATCH] fix: Material Theme primary color should be reassigned & forwarded --- .../src/styles/_variables-theme-material.scss | 21 ++++++++++--------- 1 file changed, 11 insertions(+), 10 deletions(-) diff --git a/packages/common/src/styles/_variables-theme-material.scss b/packages/common/src/styles/_variables-theme-material.scss index e78f03ac6..0be6b4b7a 100644 --- a/packages/common/src/styles/_variables-theme-material.scss +++ b/packages/common/src/styles/_variables-theme-material.scss @@ -7,17 +7,18 @@ @use 'sass:color'; $slick-highlight-color: #48c774; -$slick-primary-color: #009530; -$slick-filled-filter-border: 1px solid #{$slick-primary-color} !default; +$primary-color: #009530; +$slick-filled-filter-border: 1px solid #{$primary-color} !default; $slick-editor-input-group-clear-btn-icon-color: inherit !default; @forward './variables' with ( + $slick-primary-color: $primary-color !default, $slick-highlight-color: #48c774 !default, $slick-font-family: #{"Roboto", "Helvetica Neue", "Sans-Serif"} !default, $slick-font-size-base-value: 14 !default, $slick-icon-color: inherit !default, $slick-icon-font-size: 18px !default, - $slick-input-focus-border-color: color.adjust($slick-primary-color, $lightness: 12%) !default, + $slick-input-focus-border-color: color.adjust($primary-color, $lightness: 12%) !default, $slick-group-totals-formatter-color: #666666 !default, $slick-cell-border-top: none !default, $slick-cell-font-weight: 400 !default, @@ -46,8 +47,8 @@ $slick-editor-input-group-clear-btn-icon-color: inherit !default; $slick-container-border-bottom: 1px solid #ccc !default, $slick-container-border-left: 1px solid #ccc !default, $slick-container-border-right: 1px solid #ccc !default, - $slick-icon-sort-color: $slick-primary-color !default, - $slick-checkbox-icon-color: $slick-primary-color !default, + $slick-icon-sort-color: $primary-color !default, + $slick-checkbox-icon-color: $primary-color !default, $slick-checkbox-icon-container-bg-color: transparent !default, $slick-checkbox-icon-checked-svg-path: "M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" !default, $slick-checkbox-icon-unchecked-svg-path: "M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z" !default, @@ -63,7 +64,7 @@ $slick-editor-input-group-clear-btn-icon-color: inherit !default; $slick-menu-icon-line-height: 18px !default, $slick-menu-icon-min-width: 18px !default, $slick-menu-title-font-size: 17px !default, - $slick-icon-group-color: $slick-primary-color !default, + $slick-icon-group-color: $primary-color !default, $slick-draggable-group-drop-border-top: 0px !default, $slick-draggable-group-drop-border-left: 0px !default, $slick-draggable-group-drop-border-right: 0px !default, @@ -79,9 +80,9 @@ $slick-editor-input-group-clear-btn-icon-color: inherit !default; $slick-header-button-margin: -4px 0 100px 0 !default, $slick-header-menu-button-icon-color: inherit !default, $slick-header-menu-display: inline-block !default, - $slick-form-control-focus-box-shadow: 0 0 0 2.5px rgba($slick-primary-color, 0.25) !default, - $slick-compound-filter-operator-select-border: 1px solid #{color.adjust($slick-primary-color, $lightness: 10%)} !default, - $slick-compound-filter-text-color: color.adjust($slick-primary-color, $lightness: -20%) !default, + $slick-form-control-focus-box-shadow: 0 0 0 2.5px rgba($primary-color, 0.25) !default, + $slick-compound-filter-operator-select-border: 1px solid #{color.adjust($primary-color, $lightness: 10%)} !default, + $slick-compound-filter-text-color: color.adjust($primary-color, $lightness: -20%) !default, $slick-preheader-border-right: 1px solid #e2e2e2 !default, $slick-row-move-plugin-cursor: grab !default, $slick-row-move-plugin-icon-color: inherit !default, @@ -89,7 +90,7 @@ $slick-editor-input-group-clear-btn-icon-color: inherit !default; $slick-editor-input-group-clear-btn-icon-padding: 1px 6px !default, $slick-row-mouse-hover-color: #ebfaef !default, $slick-row-selected-color: #d4f6d7 !default, - $slick-pagination-icon-color: $slick-primary-color !default, + $slick-pagination-icon-color: $primary-color !default, $slick-pagination-button-border-radius: 2px !default, $slick-pagination-page-input-border-radius: 3px !default, );