diff --git a/packages/common/src/styles/_variables-theme-salesforce.scss b/packages/common/src/styles/_variables-theme-salesforce.scss index 68744ffa0..72d090613 100644 --- a/packages/common/src/styles/_variables-theme-salesforce.scss +++ b/packages/common/src/styles/_variables-theme-salesforce.scss @@ -94,6 +94,10 @@ $icon-group-font-weight: normal !default; $icon-group-height: auto !default; $icon-group-vertical-align: bottom !default; $icon-group-width: 15px !default; +$filled-filter-color: $primary-color-dark !default; +$filled-filter-border: 1px solid #{$primary-color} !default; +$filled-filter-box-shadow: inset 0 0 0 1px #{lighten($primary-color, 30%)} !default; +$filled-filter-font-weight: bold !default; $draggable-group-drop-border-top: 0px !default; $draggable-group-drop-width: 100% !default; $draggable-group-drop-radius: 0px !default; diff --git a/packages/common/src/styles/slick-filters.scss b/packages/common/src/styles/slick-filters.scss new file mode 100644 index 000000000..9ecdb9b51 --- /dev/null +++ b/packages/common/src/styles/slick-filters.scss @@ -0,0 +1,30 @@ +$filled-filter-color: $form-control-focus-border-color !default; +$filled-filter-border: $form-control-border !default; +$filled-filter-box-shadow: $form-control-focus-border-color !default; +$filled-filter-font-weight: 400 !default; + +.slick-headerrow { + input.search-filter.filled, + .search-filter.filled input, + .search-filter.filled input.flatpickr-input, + .search-filter.filled .input-group-addon.slider-value, + .search-filter.filled .input-group-addon select { + color: var(--filled-filter-color, $filled-filter-color); + font-weight: var(--filled-filter-font-weight, $filled-filter-font-weight); + border: var(--filled-filter-border, $filled-filter-border); + box-shadow: var(--filled-filter-box-shadow, $filled-filter-box-shadow); + } + .search-filter.filled .input-group-addon select { + border-right: 0px; + } + .search-filter.filled { + .ms-choice { + box-shadow: var(--filled-filter-box-shadow, $filled-filter-box-shadow); + border: var(--filled-filter-border, $filled-filter-border); + span { + font-weight: var(--filled-filter-font-weight, $filled-filter-font-weight); + color: var(--filled-filter-color, $filled-filter-color); + } + } + } +} \ No newline at end of file diff --git a/packages/common/src/styles/slick-without-bootstrap-min-styling.scss b/packages/common/src/styles/slick-without-bootstrap-min-styling.scss index 5983fd7dc..9107852e8 100644 --- a/packages/common/src/styles/slick-without-bootstrap-min-styling.scss +++ b/packages/common/src/styles/slick-without-bootstrap-min-styling.scss @@ -1,5 +1,6 @@ @import './variables'; +$form-control-border: 1px solid #ccc !default; $form-control-focus-border-color: lighten($primary-color, 10%) !default; $form-control-focus-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px rgba(lighten($primary-color, 3%), .3) !default; diff --git a/packages/common/src/styles/slickgrid-theme-salesforce.scss b/packages/common/src/styles/slickgrid-theme-salesforce.scss index 26a0b57fb..e481772f4 100644 --- a/packages/common/src/styles/slickgrid-theme-salesforce.scss +++ b/packages/common/src/styles/slickgrid-theme-salesforce.scss @@ -24,6 +24,7 @@ @import './slick-component'; @import './slickgrid-examples'; @import './slick-bootstrap'; +@import './slick-filters'; @import './ui-autocomplete'; @import './material-svg-icons'; @import './material-svg-utilities'; diff --git a/packages/vanilla-bundle/dist-grid-bundle-zip/slickgrid-vanilla-bundle.zip b/packages/vanilla-bundle/dist-grid-bundle-zip/slickgrid-vanilla-bundle.zip index 56bb2207b..c72d75616 100644 Binary files a/packages/vanilla-bundle/dist-grid-bundle-zip/slickgrid-vanilla-bundle.zip and b/packages/vanilla-bundle/dist-grid-bundle-zip/slickgrid-vanilla-bundle.zip differ