Skip to content

Commit

Permalink
Fix CSS variable handling in lessToSass conversion (#3611)
Browse files Browse the repository at this point in the history
  • Loading branch information
@EreMaijala
EreMaijala committed Apr 23, 2024
1 parent 511f059 commit f78abfc
Show file tree
Hide file tree
Showing 6 changed files with 9 additions and 130 deletions.
7 changes: 6 additions & 1 deletion Gruntfile.js
View file
Expand Up @@ -169,10 +169,15 @@ module.exports = function(grunt) {
},
order: 4
},
{ // Wrap variables set to css variables with #{}
pattern: /(--[\w-:]+:\s*)((\$|darken\(|lighten\()[^;]+)/gi,
replacement: '$1#{$2}',
order: 5
},
{ // Remove !default from extends (icons.scss)
pattern: /@extend ([^;}]+) !default;/gi,
replacement: '@extend $1;',
order: 5
order: 6
}
]
}
Expand Down
52 changes: 0 additions & 52 deletions themes/bootstrap3/less/components/cookie-consent/abstracts/light-color-scheme.less
View file
@@ -1,6 +1,5 @@
/** Light color-scheme **/
:root{
/* #LESS> */
--cc-bg: @modal-content-bg;
--cc-primary-color: @text-color;
--cc-secondary-color: lighten(@text-color, 10%);
Expand Down Expand Up @@ -49,55 +48,4 @@
--cc-footer-bg: @panel-footer-bg;
--cc-footer-color: @text-color;
--cc-footer-border-color: @panel-default-border;
/* <#LESS */
/* #SCSS>
--cc-bg: #{$modal-content-bg};
--cc-primary-color: #{$text-color};
--cc-secondary-color: #{lighten($text-color, 10%)};
--cc-btn-primary-bg: #{$btn-primary-bg};
--cc-btn-primary-color: #{$btn-primary-color};
--cc-btn-primary-border-color: #{$btn-primary-bg};
--cc-btn-primary-hover-bg: #{$btn-primary-color};
--cc-btn-primary-hover-color: #{$btn-primary-bg};
--cc-btn-primary-hover-border-color: #{darken($btn-primary-border, 12%)};
--cc-btn-secondary-bg: #{$btn-default-bg};
--cc-btn-secondary-color: #{$btn-default-color};
--cc-btn-secondary-border-color: #{$btn-default-border};
--cc-btn-secondary-hover-bg: #{$btn-default-color};
--cc-btn-secondary-hover-color: #{$btn-default-bg};
--cc-btn-secondary-hover-border-color: #{darken($btn-default-border, 12%)};
--cc-separator-border-color: #{$well-border};
--cc-toggle-on-bg: #{$gray-light};
--cc-toggle-off-bg: #{lighten($gray-light, 10%)};
--cc-toggle-on-knob-bg: #{$body-bg};
--cc-toggle-off-knob-bg: #{$body-bg};
--cc-toggle-enabled-icon-color: #{$modal-content-bg}; // yes (v tick)
--cc-toggle-disabled-icon-color: #{$modal-content-bg}; // no (x tick)
--cc-toggle-readonly-bg: #{lighten($gray-light, 20%)};
--cc-toggle-readonly-knob-bg: #{$body-bg};
--cc-toggle-readonly-knob-icon-color: lighten($gray-light, 20%);
--cc-section-category-border: #{$gray-lighter};
--cc-cookie-category-block-bg: #{$gray-lighter};
--cc-cookie-category-block-border: #{$list-group-border};
--cc-cookie-category-block-hover-bg: #{darken($gray-lighter, 10%)};
--cc-cookie-category-block-hover-border: #{$list-group-border};
--cc-cookie-category-expanded-block-bg: #{$gray-lighter};
--cc-cookie-category-expanded-block-hover-bg: darken($gray-lighter, 10%);
--cc-overlay-bg: #{$modal-backdrop-bg};
--cc-webkit-scrollbar-bg: #{$gray-lighter};
--cc-webkit-scrollbar-hover-bg: #{$btn-primary-color};
--cc-footer-bg: #{$panel-footer-bg};
--cc-footer-color: #{$text-color};
--cc-footer-border-color: #{$panel-default-border};
<#SCSS */
}
11 changes: 0 additions & 11 deletions themes/bootstrap3/less/components/cookie-consent/core/base.less
View file
Expand Up @@ -5,24 +5,13 @@
*/

:root{
/* #LESS> */
--cc-font-family: @font-family-base;
--cc-modal-border-radius: @border-radius-base;
--cc-btn-border-radius: @btn-border-radius-base;
--cc-modal-transition-duration: .25s;
--cc-link-color: @link-color;
--cc-modal-margin: 1rem;
--cc-z-index: @zindex-cookie-consent;
/* <#LESS */
/* #SCSS>
--cc-font-family: #{$font-family-base};
--cc-modal-border-radius: #{$border-radius-base};
--cc-btn-border-radius: #{$btn-border-radius-base};
--cc-modal-transition-duration: .25s;
--cc-link-color: #{$link-color};
--cc-modal-margin: 1rem;
--cc-z-index: #{$zindex-cookie-consent};
<#SCSS */
}

#cc-main {
Expand Down
56 changes: 2 additions & 54 deletions themes/bootstrap3/scss/components/cookie-consent/abstracts/light-color-scheme.scss
View file
@@ -1,56 +1,5 @@
/** Light color-scheme **/
:root{
/* #LESS>
--cc-bg: $modal-content-bg;
--cc-primary-color: $text-color;
--cc-secondary-color: lighten($text-color, 10%);
--cc-btn-primary-bg: $btn-primary-bg;
--cc-btn-primary-color: $btn-primary-color;
--cc-btn-primary-border-color: $btn-primary-bg;
--cc-btn-primary-hover-bg: $btn-primary-color;
--cc-btn-primary-hover-color: $btn-primary-bg;
--cc-btn-primary-hover-border-color: darken($btn-primary-border, 12%);
--cc-btn-secondary-bg: $btn-default-bg;
--cc-btn-secondary-color: $btn-default-color;
--cc-btn-secondary-border-color: $btn-default-border;
--cc-btn-secondary-hover-bg: $btn-default-color;
--cc-btn-secondary-hover-color: $btn-default-bg;
--cc-btn-secondary-hover-border-color: darken($btn-default-border, 12%);
--cc-separator-border-color: $well-border;
--cc-toggle-on-bg: $gray-light;
--cc-toggle-off-bg: lighten($gray-light, 10%);
--cc-toggle-on-knob-bg: $body-bg;
--cc-toggle-off-knob-bg: $body-bg;
--cc-toggle-enabled-icon-color: $modal-content-bg; // yes (v tick)
--cc-toggle-disabled-icon-color: $modal-content-bg; // no (x tick)
--cc-toggle-readonly-bg: lighten($gray-light, 20%);
--cc-toggle-readonly-knob-bg: $body-bg;
--cc-toggle-readonly-knob-icon-color: lighten($gray-light, 20%);
--cc-section-category-border: $gray-lighter;
--cc-cookie-category-block-bg: $gray-lighter;
--cc-cookie-category-block-border: $list-group-border;
--cc-cookie-category-block-hover-bg: darken($gray-lighter, 10%);
--cc-cookie-category-block-hover-border: $list-group-border;
--cc-cookie-category-expanded-block-bg: $gray-lighter;
--cc-cookie-category-expanded-block-hover-bg: darken($gray-lighter, 10%);
--cc-overlay-bg: $modal-backdrop-bg;
--cc-webkit-scrollbar-bg: $gray-lighter;
--cc-webkit-scrollbar-hover-bg: $btn-primary-color;
--cc-footer-bg: $panel-footer-bg;
--cc-footer-color: $text-color;
--cc-footer-border-color: $panel-default-border;
<#LESS */
/* #SCSS> */
--cc-bg: #{$modal-content-bg};
--cc-primary-color: #{$text-color};
--cc-secondary-color: #{lighten($text-color, 10%)};
Expand Down Expand Up @@ -81,7 +30,7 @@

--cc-toggle-readonly-bg: #{lighten($gray-light, 20%)};
--cc-toggle-readonly-knob-bg: #{$body-bg};
--cc-toggle-readonly-knob-icon-color: lighten($gray-light, 20%);
--cc-toggle-readonly-knob-icon-color: #{lighten($gray-light, 20%)};

--cc-section-category-border: #{$gray-lighter};

Expand All @@ -90,7 +39,7 @@
--cc-cookie-category-block-hover-bg: #{darken($gray-lighter, 10%)};
--cc-cookie-category-block-hover-border: #{$list-group-border};
--cc-cookie-category-expanded-block-bg: #{$gray-lighter};
--cc-cookie-category-expanded-block-hover-bg: darken($gray-lighter, 10%);
--cc-cookie-category-expanded-block-hover-bg: #{darken($gray-lighter, 10%)};

--cc-overlay-bg: #{$modal-backdrop-bg};
--cc-webkit-scrollbar-bg: #{$gray-lighter};
Expand All @@ -99,5 +48,4 @@
--cc-footer-bg: #{$panel-footer-bg};
--cc-footer-color: #{$text-color};
--cc-footer-border-color: #{$panel-default-border};
/* <#SCSS */
}
11 changes: 0 additions & 11 deletions themes/bootstrap3/scss/components/cookie-consent/core/base.scss
View file
Expand Up @@ -5,24 +5,13 @@
*/

:root{
/* #LESS>
--cc-font-family: $font-family-base;
--cc-modal-border-radius: $border-radius-base;
--cc-btn-border-radius: $btn-border-radius-base;
--cc-modal-transition-duration: .25s;
--cc-link-color: $link-color;
--cc-modal-margin: 1rem;
--cc-z-index: $zindex-cookie-consent;
<#LESS */
/* #SCSS> */
--cc-font-family: #{$font-family-base};
--cc-modal-border-radius: #{$border-radius-base};
--cc-btn-border-radius: #{$btn-border-radius-base};
--cc-modal-transition-duration: .25s;
--cc-link-color: #{$link-color};
--cc-modal-margin: 1rem;
--cc-z-index: #{$zindex-cookie-consent};
/* <#SCSS */
}

#cc-main {
Expand Down
2 changes: 1 addition & 1 deletion themes/sandal/scss/common.scss
View file
Expand Up @@ -53,7 +53,7 @@ mark { background-color: $highlighter-color; }
outline: 4px solid var(--outline-color);
}
.form-control:focus {
--outline-color: $gold;
--outline-color: #{$gold};
}

.breadcrumb a { color: $dark-gray; }
Expand Down

0 comments on commit f78abfc

Please sign in to comment.