Skip to content

Commit

Permalink
feat(themes): add theme property to components (#15056)
Browse files Browse the repository at this point in the history
  • Loading branch information
@didimmova
didimmova authored Nov 14, 2024
1 parent 0695993 commit ce5e8e7
Show file tree
Hide file tree
Showing 48 changed files with 59 additions and 10 deletions.
1 change: 1 addition & 0 deletions ...cts/igniteui-angular/src/lib/core/styles/components/action-strip/_action-strip-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@
icon-color: $icon-color,
delete-action: $delete-action,
actions-border-radius: $actions-border-radius,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/avatar/_avatar-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@
icon-color: $icon-color,
border-radius: $border-radius,
size: $size,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/badge/_badge-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@
border-radius: $border-radius,
background-color: $background-color,
shadow: $shadow,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/banner/_banner-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@
banner-border-color: $banner-border-color,
banner-illustration-color: $banner-illustration-color,
border-radius: $border-radius,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/bottom-nav/_bottom-nav-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,7 @@
label-disabled-color: $label-disabled-color,
border-color: $border-color,
shadow: $shadow,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
theme-variant: map.get($schema, '_meta', 'variant')
Expand Down
1 change: 1 addition & 0 deletions ...cts/igniteui-angular/src/lib/core/styles/components/button-group/_button-group-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -208,6 +208,7 @@
shadow: $shadow,
idle-shadow-color: $idle-shadow-color,
selected-shadow-color: $selected-shadow-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/button/_button-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -244,6 +244,7 @@
disabled-icon-color: $disabled-icon-color,
disabled-border-color: $disabled-border-color,
size: $size,
theme: map.get($schema, '_meta', 'theme'),
))
));
}
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/calendar/_calendar-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -693,6 +693,7 @@
actions-divider-color: $actions-divider-color,
size: $size,
inner-size: $inner-size,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/card/_card-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,7 @@
actions-text-color: $actions-text-color,
resting-shadow: $resting-shadow,
hover-shadow: $hover-shadow,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
11 changes: 6 additions & 5 deletions projects/igniteui-angular/src/lib/core/styles/components/carousel/_carousel-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -123,6 +123,7 @@
indicator-active-dot-color: $indicator-active-dot-color,
indicator-active-border-color: $indicator-active-border-color,
indicator-active-hover-dot-color: $indicator-active-hover-dot-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down Expand Up @@ -561,17 +562,17 @@
transform: rotate(90deg);
}
}

%igx-carousel-arrow--prev {
inset-block-start: 0;
margin-block-start: rem(16px);
}

%igx-carousel-arrow--next {
inset-block-end: 0;
margin-block-end: rem(16px);
}

%igx-carousel-indicators {
inset-inline-end: 0;
inset-inline-start: unset;
Expand Down Expand Up @@ -601,12 +602,12 @@
margin-inline-end: rem(16px);
padding: rem(6px);
}

%igx-carousel-label-indicator {
padding: rem(4px) rem(6px);
margin-inline-end: rem(16px);
}

%igx-carousel-indicators--top {
margin-inline-start: rem(16px);
}
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/checkbox/_checkbox-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,7 @@
focus-outline-color: $focus-outline-color,
error-color: $error-color,
error-color-hover: $error-color-hover,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
theme-variant: map.get($schema, '_meta', 'variant')
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/chip/_chip-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -242,6 +242,7 @@
remove-icon-color-focus: $remove-icon-color-focus,
focus-selected-outline-color: $focus-selected-outline-color,
focus-outline-color: $focus-outline-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
theme-variant: map.get($schema, '_meta', 'variant')
Expand Down
1 change: 1 addition & 0 deletions ...igniteui-angular/src/lib/core/styles/components/column-actions/_column-actions-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@
elevations: $elevations,
title-color: $title-color,
background-color: $background-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/combo/_combo-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@
clear-button-background-focus: $clear-button-background-focus,
clear-button-foreground: $clear-button-foreground,
clear-button-foreground-focus: $clear-button-foreground-focus,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/dialog/_dialog-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,7 @@
message-color: $message-color,
shadow: $shadow,
border-color: $border-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/divider/_divider-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@
name: $name,
color: $color,
inset: $inset,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/drop-down/_drop-down-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -191,6 +191,7 @@
border-color: $border-color,
border-width: $border-width,
size: $size,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions ...niteui-angular/src/lib/core/styles/components/expansion-panel/_expansion-panel-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@
disabled-text-color: $disabled-text-color,
disabled-description-color: $disabled-description-color,
expanded-margin: $expanded-margin,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions ...cts/igniteui-angular/src/lib/core/styles/components/grid-summary/_grid-summary-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@
pinned-border-style: $pinned-border-style,
pinned-border-color: $pinned-border-color,
label-hover-color: $label-hover-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions ...cts/igniteui-angular/src/lib/core/styles/components/grid-toolbar/_grid-toolbar-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,7 @@
item-hover-text-color: $item-hover-text-color,
item-focus-background: $item-focus-background,
item-focus-text-color: $item-focus-text-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
7 changes: 4 additions & 3 deletions projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -575,6 +575,7 @@
cell-selected-within-background: $cell-selected-within-background,
cell-selected-within-text-color: $cell-selected-within-text-color,

theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
theme-variant: map.get($schema, '_meta', 'variant')
Expand Down Expand Up @@ -1073,15 +1074,15 @@
%cbx-composite-wrapper {
padding: 0;
}

%cbx-label-pos--after {
margin-inline-start: rem(12px);
}

%cbx-label-pos--before {
margin-inline-end: rem(12px);
}

%cbx-label-pos--before,
%cbx-label-pos--after {
&:empty {
Expand Down
1 change: 1 addition & 0 deletions ...ects/igniteui-angular/src/lib/core/styles/components/grid/_pivot-data-selector-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@

@return extend($theme, (
name: $name,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/highlight/highlight-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@
resting-color: $resting-color,
active-background: $active-background,
active-color: $active-color,
theme: map.get($schema, '_meta', 'theme'),
));
}

Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/icon-button/_icon-button-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,7 @@
disabled-foreground: $disabled-foreground,
disabled-border-color: $disabled-border-color,
size: $size,
theme: map.get($schema, '_meta', 'theme'),
))
));
}
Expand Down
3 changes: 2 additions & 1 deletion projects/igniteui-angular/src/lib/core/styles/components/icon/_icon-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,8 @@
name: $name,
color: $color,
size: $size,
disabled-color: $disabled-color
disabled-color: $disabled-color,
theme: map.get($schema, '_meta', 'theme'),
));
}

Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/label/_label-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@
name: $name,
selector: $selector,
color: $color,
theme: map.get($schema, '_meta', 'theme'),
variant: map.get($schema, '_meta', 'theme'),
));
}
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/list/_list-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -229,6 +229,7 @@
item-thumbnail-color-active: $item-thumbnail-color-active,
border-color: $border-color,
border-width: $border-width,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/navbar/_navbar-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@
idle-icon-color: $idle-icon-color,
hover-icon-color: $hover-icon-color,
shadow: $shadow,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/navdrawer/_navdrawer-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,7 @@
item-disabled-text-color:$item-disabled-text-color,
item-disabled-icon-color: $item-disabled-icon-color,
shadow: $shadow,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/overlay/_overlay-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@
name: $name,
selector: $selector,
background-color: $background-color,
theme: map.get($schema, '_meta', 'theme'),
));
}

Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/paginator/_paginator-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@
text-color: $text-color,
background-color: $background-color,
border-color: $border-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
2 changes: 2 additions & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/progress/_progress-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@
stripes-color: $stripes-color,
text-color: $text-color,
track-border-radius: $track-border-radius,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down Expand Up @@ -449,6 +450,7 @@
progress-circle-color-end: $progress-circle-color-end,
text-color: $text-color,
diameter: $diameter,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions ...s/igniteui-angular/src/lib/core/styles/components/query-builder/_query-builder-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,7 @@
background-and--focus: $background-and--focus,
background-or: $background-or,
background-or--focus: $background-or--focus,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/radio/_radio-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@
error-color: $error-color,
error-color-hover: $error-color-hover,
focus-outline-color-error: $focus-outline-color-error,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme'),
theme-variant: map.get($schema, '_meta', 'variant')
Expand Down
3 changes: 2 additions & 1 deletion projects/igniteui-angular/src/lib/core/styles/components/ripple/_ripple-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,8 @@
@return extend($theme, (
name: $name,
selector: $selector,
color: $color
color: $color,
theme: map.get($schema, '_meta', 'theme'),
));
}

Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/scrollbar/scrollbar-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@
sb-corner-bg: $sb-corner-bg,
sb-corner-border-color: $sb-corner-border-color,
sb-corner-border-size: $sb-corner-border-size,
theme: map.get($schema, '_meta', 'theme'),
));
}

Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/select/_select-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@
toggle-button-foreground-disabled: $toggle-button-foreground-disabled,
toggle-button-foreground-filled: $toggle-button-foreground-filled,
toggle-button-background-focus--border: $toggle-button-background-focus--border,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/slider/_slider-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,7 @@
disabled-fill-track-color: $disabled-fill-track-color,
tick-label-color: $tick-label-color,
tick-color: $tick-color,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/snackbar/_snackbar-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@
text-color: $text-color,
button-color: $button-color,
shadow: $shadow,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/splitter/_splitter-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,7 @@
border-radius: $border-radius,
focus-color: $focus-color,
size: $size,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
1 change: 1 addition & 0 deletions projects/igniteui-angular/src/lib/core/styles/components/stepper/_stepper-theme.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -318,6 +318,7 @@
// Border-radius
border-radius-indicator: $border-radius-indicator,
border-radius-step-header: $border-radius-step-header,
theme: map.get($schema, '_meta', 'theme'),
_meta: map.merge(if($meta, $meta, ()), (
variant: map.get($schema, '_meta', 'theme')
)),
Expand Down
Loading

0 comments on commit ce5e8e7

Please sign in to comment.