fix(styles): Datepicker year select overflow (#2319)

### UI #### Before ![image](https://github.com/swisspost/design-system/assets/12294151/79d1112a-6158-454f-b8fb-8afbc7140542) #### After ![image](https://github.com/swisspost/design-system/assets/12294151/d6a6f0c4-fede-4b01-9d74-fb79e266da93)
swisspost · Nov 29, 2023 · 0ff6499 · 0ff6499
1 parent e3c9029
commit 0ff6499
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/.changeset/cuddly-otters-compete.md b/.changeset/cuddly-otters-compete.md
@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-styles': patch
+---
+
+Fixed overflow on datepicker select variant.
diff --git a/packages/styles/src/components/datepicker.scss b/packages/styles/src/components/datepicker.scss
@@ -7,6 +7,8 @@
 @use './../variables/commons';
 @use './../mixins/icons' as icons-mx;
 
+@use './../themes/bootstrap/core' as b;
+
 ngb-datepicker {
   // Conversion for compatibility
   --bs-light: var(--post-light);
@@ -24,7 +26,7 @@ ngb-datepicker-navigation-select.ngb-dp-navigation-select {
   flex: 0 1 auto;
 
   select {
-    padding-right: 1rem;
+    padding-right: b.$form-select-padding-x * 2;
     border: 0;
     background-position: right;