Updated DatePickerPopover to be themed

Fixes: #195

• Updated:
- DatePickerPopover to be themed
This commit is contained in:
mgabdev 2020-06-07 15:55:08 -04:00
parent 985e1458d5
commit 4ea9ad5ea4
2 changed files with 24 additions and 1 deletions

@ -63,7 +63,7 @@ class DatePickerPopover extends PureComponent {
return (
<PopoverLayout width={331} isXS={isXS}>
<div className={[_s.default].join(' ')}>
<div className={[_s.default, _s.bgSubtle].join(' ')}>
<DatePicker
inline
target={this}

@ -1062,4 +1062,27 @@ body {
:global(.react-datepicker__quarter-text--in-selecting-range),
:global(.react-datepicker__quarter-text--in-range) {
background-color: var(--color_brand) !important;
}
:global(.react-datepicker__current-month),
:global(.react-datepicker-time__header),
:global(.react-datepicker-year-header),
:global(.react-datepicker__day-name),
:global(.react-datepicker__day),
:global(.react-datepicker__time-name),
:global(.react-datepicker__time-list-item) {
color: var(--text_color_primary) !important;
}
:global(.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover),
:global(.react-datepicker__day:hover),
:global(.react-datepicker__month-text:hover),
:global(.react-datepicker__quarter-text:hover) {
background-color: var(--solid_color_primary-opaque) !important;
}
:global(.react-datepicker),
:global(.react-datepicker__time-container),
:global(.react-datepicker__time) {
background-color: var(--solid_color_block) !important;
}