Skip to content

Commit

Permalink
style(calendar): fix indigo colors
Browse files Browse the repository at this point in the history
  • Loading branch information
@desig9stein @simeonoff
desig9stein authored and simeonoff committed Apr 3, 2024
1 parent 0d3b929 commit 6c33a8c
Show file tree
Hide file tree
Showing 2 changed files with 45 additions and 8 deletions.
46 changes: 38 additions & 8 deletions sass/themes/schemas/components/dark/_calendar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -537,11 +537,11 @@ $dark-bootstrap-calendar: extend(
/// @prop {Map} date-special-foreground [color: ('primary', 50)] - The foreground color of a special date.
/// @prop {Map} date-special-background [color: ('primary', 600, .4)] - The background color of a special date.
/// @prop {Map} date-special-hover-foreground [contrast-color: ('primary', 600)] - The foreground color of a special date.
/// @prop {Map} date-special-hover-background [color: ('primary', 600, .7)] - The background color of a special date.
/// @prop {Map} date-special-hover-background [color: ('primary', 600, .4)] - The background color of a special date.
/// @prop {Map} date-special-focus-foreground [contrast-color: ('primary', 600)] - The foreground color of a special date.
/// @prop {Map} date-special-focus-background [color: ('primary', 600, .7)] - The background color of a special date.
/// @prop {Map} date-special-range-hover-background [color: ('primary', 600, .7)] - The :hover background color of a special date in range selection.
/// @prop {Map} date-special-range-focus-background [color: ('primary', 600, .7)] - The :focus background color of a special date in range selection.
/// @prop {Map} date-special-focus-background [color: ('primary', 600, .4)] - The background color of a special date.
/// @prop {Map} date-special-range-hover-background [color: ('primary', 600, .4)] - The :hover background color of a special date in range selection.
/// @prop {Map} date-special-range-focus-background [color: ('primary', 600, .4)] - The :focus background color of a special date in range selection.
/// @prop {Map} navigation-hover-color [color: ('primary', 300)] - The :hover color of the icon button responsible for month navigation.
/// @prop {Map} navigation-focus-color [color: ('primary', 300)] - The :focus color of the icon button responsible for month navigation.
/// @prop {Мап} actions-divider-color [color: ('gray', 100)] - The border color used for the date-picker actions divider.
Expand All @@ -556,6 +556,10 @@ $dark-bootstrap-calendar: extend(
/// @prop {Map} selected-current-hover-outline-color [contrast-color: ('gray', 50, .6)] - The :hover outline color of the selected current year/month in year/month views.
/// @prop {Map} selected-current-focus-outline-color [contrast-color: ('gray', 50, .6)] - The :focus outline color of the selected current year/month in year/month views.
/// @prop {Map} date-current-hover-background [contrast-color: ('gray', 50, .1)] - The :hover background color of the current date.
/// @prop {Map} date-selected-range-hover-background [contrast-color: ('gray', 50, .1)] - The :hover background color of the selected range.
/// @prop {Map} date-selected-range-focus-background [contrast-color: ('gray', 50, .1)] - The :focus background color of the selected range.
/// @prop {Map} date-selected-range-hover-foreground [contrast-color: ('gray', 50)] - The :hover foreground color of the selected range.
/// @prop {Map} date-selected-range-focus-foreground [contrast-color: ('gray', 50)] - The :focus foreground color of the selected range.
/// @requires $indigo-calendar
$dark-indigo-calendar: extend(
$indigo-calendar,
Expand Down Expand Up @@ -697,7 +701,7 @@ $dark-indigo-calendar: extend(
color: (
'primary',
600,
0.7,
0.4,
),
),
date-special-focus-foreground: (
Expand All @@ -710,7 +714,7 @@ $dark-indigo-calendar: extend(
color: (
'primary',
600,
0.7,
0.4,
),
),
date-special-range-foreground: (
Expand All @@ -730,14 +734,14 @@ $dark-indigo-calendar: extend(
color: (
'primary',
600,
0.7,
0.4,
),
),
date-special-range-focus-background: (
color: (
'primary',
600,
0.7,
0.4,
),
),
navigation-hover-color: (
Expand Down Expand Up @@ -837,5 +841,31 @@ $dark-indigo-calendar: extend(
0.38,
),
),
date-selected-range-hover-foreground: (
contrast-color: (
'secondary',
900,
),
),
date-selected-range-focus-foreground: (
contrast-color: (
'secondary',
900,
),
),
date-selected-range-hover-background: (
contrast-color: (
'gray',
50,
0.1,
),
),
date-selected-range-focus-background: (
contrast-color: (
'gray',
50,
0.1,
),
),
)
);
7 changes: 7 additions & 0 deletions sass/themes/schemas/components/light/_calendar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2325,6 +2325,7 @@ $bootstrap-calendar: extend(
/// @prop {Map} date-selected-current-hover-border-color [contrast-color: ('primary', 900, .6)] - The :hover border color of the selected current date.
/// @prop {Map} date-selected-current-focus-border-color [contrast-color: ('primary', 900,. 6)] - The :focus border color of the selected current date.
/// @prop {Map} date-selected-range-foreground [color: ('gray', 800)] - The foreground color of the selected range.
/// @prop {Map} date-selected-current-range-foreground [color: ('gray', 800)] - The foreground color of the current date in the selected range.
/// @prop {Map} date-selected-range-background [color: ('primary', 300, .2)] - The background color of the selected range.
/// @prop {Map} date-selected-range-hover-background [color: ('secondary', 100)] - The :hover background color of the selected range.
/// @prop {Map} date-selected-range-focus-background [color: ('secondary', 100)] - The :focus background color of the selected range.
Expand Down Expand Up @@ -2702,6 +2703,12 @@ $indigo-calendar: extend(
0.6,
),
),
date-selected-current-range-foreground: (
color: (
'gray',
800,
),
),
date-selected-range-foreground: (
color: (
'gray',
Expand Down

0 comments on commit 6c33a8c

Please sign in to comment.