diff --git a/less/input.less b/less/input.less index 58f3c1a..91bf11f 100644 --- a/less/input.less +++ b/less/input.less @@ -35,6 +35,10 @@ /* Action */ --input-action-icon-color: @global-secondary-background; --input-action-icon-color-disabled: @global-muted-color; + --input-action-icon-display: inline; + --input-action-icon-background-color: transparent; + --input-action-icon-background-color-disabled: transparent; + --input-action-icon-background-padding: 0px; } /** Input Wrapper */ @@ -151,10 +155,21 @@ cursor: pointer; user-select: none; + & > icon { + padding: var(--input-action-icon-background-padding); + border-radius: 50%; + display: var(--input-action-icon-display); + background-color: var(--input-action-icon-background-color); + } + &.disabled { color: var(--input-action-icon-color-disabled); cursor: default; pointer-events: none; + + & > icon { + background-color: var(--input-action-icon-background-color-disabled); + } } } @@ -317,6 +332,19 @@ &.normal-font-size { --input-font-size: 16px; } + + &.background { + --input-action-icon-color: @global-inverse-color; + --input-action-icon-color-disabled: @global-meta-color; + --input-action-icon-display: block; + --input-action-icon-background-color: @global-secondary-background; + --input-action-icon-background-color-disabled: @global-muted-color; + --input-action-icon-background-padding: 5px; + + &.small, &.small-vertical { + --input-action-icon-background-padding: 3px; + } + } } .uk-dropdown.options { diff --git a/less/search.less b/less/search.less index ff701ba..9cf4c12 100644 --- a/less/search.less +++ b/less/search.less @@ -146,7 +146,7 @@ --search-input-icon-color: @global-inverse-color; --search-input-icon-color-collapsed: @global-inverse-color; --search-input-icon-color-disabled: @global-meta-color; - --search-input-icon-display: inline-block; + --search-input-icon-display: block; --search-input-icon-background-color: @global-secondary-background; --search-input-icon-background-color-disabled: @global-muted-color; --search-input-icon-background-padding: 7px;