Merge pull request #1106 from nhsuk/fix/select

Fix appearance of select element for more consistency between browsers
nhsuk · Jan 28, 2025 · 6d9edc3 · 6d9edc3
2 parents fd017ff + 87dea89
commit 6d9edc3
Show file tree

Hide file tree

Showing 14 changed files with 3 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,7 @@
 
 :wrench: **Fixes**
 
+- Fix appearance of the select element for more consistency between browsers and OS ([Issue 527](https://github.com/nhsuk/nhsuk-service-manual-community-backlog/issues/527))
 - Fix appearance of disabled warning buttons ([Issue 1034]([https://github.com/nhsuk/nhsuk-service-manual-community-backlog/issues/1034]))
 - Fix reverse button text colour ([PR 1080]([https://github.com/nhsuk/nhsuk-frontend/pull/1080]))
 - Fix details component requiring html param in uppercase ([PR 1090](https://github.com/nhsuk/nhsuk-frontend/pull/1090), [Issue 1089](https://github.com/nhsuk/nhsuk-frontend/issues/1089))

diff --git a/packages/components/select/_select.scss b/packages/components/select/_select.scss
@@ -14,8 +14,10 @@
 .nhsuk-select {
   @include nhsuk-font(19);
 
+  background-color: $color_nhsuk-white;
   border: $nhsuk-border-width-form-element solid $nhsuk-form-border-color;
   box-sizing: border-box;
+  color: $color-nhsuk-black;
   height: 2.5rem; /* [1] */
   min-width: 20ex + 3ex; /* [2] */
   max-width: 100%;

diff --git a/...s/backstop/bitmaps_reference/nhsuk-frontend_Select_0_document_0_iPhone_5_SE.png b/...s/backstop/bitmaps_reference/nhsuk-frontend_Select_0_document_0_iPhone_5_SE.png
diff --git a/tests/backstop/bitmaps_reference/nhsuk-frontend_Select_0_document_1_iPhone_6-8.png b/tests/backstop/bitmaps_reference/nhsuk-frontend_Select_0_document_1_iPhone_6-8.png
diff --git a/tests/backstop/bitmaps_reference/nhsuk-frontend_Select_0_document_2_iPad.png b/tests/backstop/bitmaps_reference/nhsuk-frontend_Select_0_document_2_iPad.png
diff --git a/...kstop/bitmaps_reference/nhsuk-frontend_Select_0_document_3_Surface_iPad_Pro.png b/...kstop/bitmaps_reference/nhsuk-frontend_Select_0_document_3_Surface_iPad_Pro.png
diff --git a/..._Select_with_hint_text_and_error_message_-_focused_0_document_0_iPhone_5_SE.png b/..._Select_with_hint_text_and_error_message_-_focused_0_document_0_iPhone_5_SE.png
diff --git a/...d_Select_with_hint_text_and_error_message_-_focused_0_document_1_iPhone_6-8.png b/...d_Select_with_hint_text_and_error_message_-_focused_0_document_1_iPhone_6-8.png
diff --git a/...rontend_Select_with_hint_text_and_error_message_-_focused_0_document_2_iPad.png b/...rontend_Select_with_hint_text_and_error_message_-_focused_0_document_2_iPad.png
diff --git a/...ct_with_hint_text_and_error_message_-_focused_0_document_3_Surface_iPad_Pro.png b/...ct_with_hint_text_and_error_message_-_focused_0_document_3_Surface_iPad_Pro.png
diff --git a/...k-frontend_Select_with_hint_text_and_error_message_0_document_0_iPhone_5_SE.png b/...k-frontend_Select_with_hint_text_and_error_message_0_document_0_iPhone_5_SE.png
diff --git a/...uk-frontend_Select_with_hint_text_and_error_message_0_document_1_iPhone_6-8.png b/...uk-frontend_Select_with_hint_text_and_error_message_0_document_1_iPhone_6-8.png
diff --git a/...ce/nhsuk-frontend_Select_with_hint_text_and_error_message_0_document_2_iPad.png b/...ce/nhsuk-frontend_Select_with_hint_text_and_error_message_0_document_2_iPad.png
diff --git a/...ntend_Select_with_hint_text_and_error_message_0_document_3_Surface_iPad_Pro.png b/...ntend_Select_with_hint_text_and_error_message_0_document_3_Surface_iPad_Pro.png