From 6879136dd0b0bbcfeff7dc3ad8aae1c1ce940557 Mon Sep 17 00:00:00 2001
From: Andreas Pfohl <a.pfohl@openproject.com>
Date: Wed, 22 Nov 2023 10:23:46 +0100
Subject: [PATCH] Changed width to max-width for text field style

---
 .changeset/textfield-max-width.md           |  5 +++++
 app/components/primer/alpha/text_field.pcss | 12 ++++++------
 2 files changed, 11 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/textfield-max-width.md

diff --git a/.changeset/textfield-max-width.md b/.changeset/textfield-max-width.md
new file mode 100644
index 0000000000..ba65602fb0
--- /dev/null
+++ b/.changeset/textfield-max-width.md
@@ -0,0 +1,5 @@
+---
+'@openproject/primer-view-components': patch
+---
+
+TextField style now uses max-width
diff --git a/app/components/primer/alpha/text_field.pcss b/app/components/primer/alpha/text_field.pcss
index 7e33892327..afc3f33af1 100644
--- a/app/components/primer/alpha/text_field.pcss
+++ b/app/components/primer/alpha/text_field.pcss
@@ -228,27 +228,27 @@
 /* widths */
 @define-mixin FormControl-input-width {
   &.FormControl-input-width--auto {
-    width: auto;
+    max-width: auto;
   }
 
   &.FormControl-input-width--small {
-    width: min(256px, 100vw - 2rem);
+    max-width: min(256px, 100vw - 2rem);
   }
 
   &.FormControl-input-width--medium {
-    width: min(320px, 100vw - 2rem);
+    max-width: min(320px, 100vw - 2rem);
   }
 
   &.FormControl-input-width--large {
-    width: min(480px, 100vw - 2rem);
+    max-width: min(480px, 100vw - 2rem);
   }
 
   &.FormControl-input-width--xlarge {
-    width: min(640px, 100vw - 2rem);
+    max-width: min(640px, 100vw - 2rem);
   }
 
   &.FormControl-input-width--xxlarge {
-    width: min(960px, 100vw - 2rem);
+    max-width: min(960px, 100vw - 2rem);
   }
 }