diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md index c957ed4ccf5b..635bdfaf31aa 100644 --- a/packages/components/docs/sass.md +++ b/packages/components/docs/sass.md @@ -13874,7 +13874,12 @@ Modal styles } .#{$prefix}--text-input, - .#{$prefix}--select-input { + .#{$prefix}--text-area, + .#{$prefix}--search-input, + .#{$prefix}--select-input, + .#{$prefix}--dropdown, + .#{$prefix}--dropdown-list, + .#{$prefix}--number input[type='number'] { background-color: $field-02; } } @@ -16250,6 +16255,14 @@ Select styles // Select text renders a little high on Firefox @-moz-document url-prefix() { padding-top: rem(4px); + + // Removes dotted inner focus + &:-moz-focusring, + &::-moz-focus-inner { + color: transparent; + text-shadow: 0 0 0 #000; + background-image: none; + } } &:focus { diff --git a/packages/components/src/components/modal/_modal.scss b/packages/components/src/components/modal/_modal.scss index f76f572439a7..ad0b51386987 100644 --- a/packages/components/src/components/modal/_modal.scss +++ b/packages/components/src/components/modal/_modal.scss @@ -55,7 +55,12 @@ } .#{$prefix}--text-input, - .#{$prefix}--select-input { + .#{$prefix}--text-area, + .#{$prefix}--search-input, + .#{$prefix}--select-input, + .#{$prefix}--dropdown, + .#{$prefix}--dropdown-list, + .#{$prefix}--number input[type='number'] { background-color: $field-02; } } diff --git a/packages/components/src/components/select/_select.scss b/packages/components/src/components/select/_select.scss index 4de48a389c30..307db64ca9d7 100644 --- a/packages/components/src/components/select/_select.scss +++ b/packages/components/src/components/select/_select.scss @@ -68,6 +68,14 @@ // Select text renders a little high on Firefox @-moz-document url-prefix() { padding-top: rem(4px); + + // Removes dotted inner focus + &:-moz-focusring, + &::-moz-focus-inner { + color: transparent; + text-shadow: 0 0 0 #000; + background-image: none; + } } &:focus {