diff --git a/app/webpacker/css/admin/v2/main.scss b/app/webpacker/css/admin/v2/main.scss index 5059c55c00..020e01de48 100644 --- a/app/webpacker/css/admin/v2/main.scss +++ b/app/webpacker/css/admin/v2/main.scss @@ -3,4 +3,5 @@ body.admin.admin-v2 { @import "navigation.scss"; + @import "plugins/select2.scss"; } diff --git a/app/webpacker/css/admin/v2/plugins/select2.scss b/app/webpacker/css/admin/v2/plugins/select2.scss new file mode 100644 index 0000000000..c30f0d8ec3 --- /dev/null +++ b/app/webpacker/css/admin/v2/plugins/select2.scss @@ -0,0 +1,65 @@ +/* Override select2 styles app/webpacker/css/admin/plugins/select2.scss */ + +.select2-container { + .select2-choice { + background-color: transparent; + border: 1px solid $v2-light-grey !important; + .select2-arrow { + color: $v2-medium-grey; + } + } + + &.select2-container-active, + &:hover { + .select2-choice { + background-color: transparent !important; + border-color: $v2-medium-grey !important; + } + } + + &.select2-dropdown-open.select2-container-active { + &:not(.select2-drop-above) { + .select2-choice { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + } + &.select2-drop-above .select.select2-choice { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + } +} + +.select2-container-multi { + &.select2-container-active, + &.select2-dropdown-open { + .select2-choices { + border-color: $v2-medium-grey !important; + } + } +} + +.select2-drop { + border-color: $v2-medium-grey; +} + +.select2-search { + color: $v2-medium-grey; +} + +.select2-results { + margin-right: 0; + li { + .select2-result-label { + color: $v2-medium-grey; + } + &.select2-highlighted { + background-color: $v2-blue; + } + &.select2-no-results, + &.select2-searching { + color: $v2-medium-grey; + } + } +}