From 0ff64991da630267bab540f5529cff9180f8d64c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lo=C3=AFc=20F=C3=BCrhoff?=
 <12294151+imagoiq@users.noreply.github.com>
Date: Wed, 29 Nov 2023 18:03:07 +0100
Subject: [PATCH] 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)
---
 .changeset/cuddly-otters-compete.md            | 5 +++++
 packages/styles/src/components/datepicker.scss | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/cuddly-otters-compete.md

diff --git a/.changeset/cuddly-otters-compete.md b/.changeset/cuddly-otters-compete.md
new file mode 100644
index 0000000000..303121c9e7
--- /dev/null
+++ 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
index 7626bc6c2f..2273a05624 100644
--- 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;