diff --git a/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx b/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx
index 247a89757d..ab032fe3a2 100644
--- a/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx
@@ -81,7 +81,7 @@ function Downshift({
)
}
- const TickIcon = function () {
+ const tickIcon = function () {
return isCiam ? : 'check'
}
@@ -116,7 +116,7 @@ function Downshift({
active: selectedItem === item,
'dropdown-item-highlighted': highlightedIndex === index,
})}
- trailingIcon={selectedItem === item ? : undefined}
+ trailingIcon={selectedItem === item ? tickIcon() : undefined}
>
{highlightMatchedCharacters(item, inputValue)}
diff --git a/services/web/frontend/js/shared/components/select.tsx b/services/web/frontend/js/shared/components/select.tsx
index e501ae82fb..34774811fe 100644
--- a/services/web/frontend/js/shared/components/select.tsx
+++ b/services/web/frontend/js/shared/components/select.tsx
@@ -152,7 +152,7 @@ export const Select = ({
value = defaultText
}
- const TickIcon = function () {
+ const tickIcon = function () {
return isCiam ? : 'check'
}
@@ -183,9 +183,7 @@ export const Select = ({
})}
active={selectedItem === item}
trailingIcon={
- selectedIcon && selectedItem === item ? (
-
- ) : undefined
+ selectedIcon && selectedItem === item ? tickIcon() : undefined
}
description={itemToSubtitle ? itemToSubtitle(item) : undefined}
{...itemProps}
diff --git a/services/web/frontend/stylesheets/ciam/ciam-layout.scss b/services/web/frontend/stylesheets/ciam/ciam-layout.scss
index b0f88ba992..69109243eb 100644
--- a/services/web/frontend/stylesheets/ciam/ciam-layout.scss
+++ b/services/web/frontend/stylesheets/ciam/ciam-layout.scss
@@ -225,6 +225,10 @@
.dropdown-item {
border-radius: var(--ds-border-radius-200);
+
+ :has(.dropdown-item-trailing-icon) {
+ padding-right: calc(var(--ds-font-size-350) + var(--ds-spacing-200));
+ }
}
// Allow dropdowns to be wider than the form container where necessary