From c6b07ad1c26e08019db9293c7b4a8f1e8b21a74c Mon Sep 17 00:00:00 2001
From: David Ritter <141235163+davidritter-dotcom@users.noreply.github.com>
Date: Wed, 10 Jul 2024 09:26:12 +0200
Subject: [PATCH] fix(styles): fix datepicker year is getting cut (#3203)

I also fixed a small bug with the icon placement on the small datepicker
input.
---
 .changeset/tricky-hats-push.md                 | 5 +++++
 packages/styles/src/components/datepicker.scss | 3 ++-
 2 files changed, 7 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/tricky-hats-push.md

diff --git a/.changeset/tricky-hats-push.md b/.changeset/tricky-hats-push.md
new file mode 100644
index 0000000000..11940a71bb
--- /dev/null
+++ b/.changeset/tricky-hats-push.md
@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-styles': patch
+---
+
+Fixed a bug where the year in the datepicker got cut and fixed the icon placement in the small variant of the datepicker input.
diff --git a/packages/styles/src/components/datepicker.scss b/packages/styles/src/components/datepicker.scss
index 96a4095a58..c4db16d683 100644
--- a/packages/styles/src/components/datepicker.scss
+++ b/packages/styles/src/components/datepicker.scss
@@ -66,6 +66,7 @@ ngb-datepicker .ngb-dp-arrow {
   .form-select {
     background-color: transparent;
     font: inherit;
+    min-width: fit-content;
   }
 }
 
@@ -182,7 +183,7 @@ span.ngb-dp-navigation-chevron {
 }
 
 .form-control-sm ~ .ngb-dp-open {
-  height: calc(#{forms.$form-floating-label-height-sm} - #{forms.$input-border-width * 2});
+  height: forms.$input-height-sm;
 }
 
 input[ngbDatepicker] {