Remove overflow prop and apply border radius with css instead

pinterest · Dec 10, 2024 · a49013d · a49013d
1 parent 8283d30
commit a49013d
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 8 deletions.
diff --git a/packages/gestalt-datepicker/src/DateRange.css b/packages/gestalt-datepicker/src/DateRange.css
@@ -14,6 +14,11 @@ html[dir="rtl"] .borderRight {
   position: relative;
 }
 
+.dateFieldSection:first-child {
+  border-top-left-radius: var(--rounding-400);
+  border-top-right-radius: var(--rounding-400);
+}
+
 .dateFieldSectionActive {
   background-color: var(--color-gray-roboflow-100);
 }

diff --git a/packages/gestalt-datepicker/src/DateRange.tsx b/packages/gestalt-datepicker/src/DateRange.tsx
@@ -238,14 +238,7 @@ function DateRange({
   });
 
   return (
-    <Box
-      borderStyle="shadow"
-      color="default"
-      display="inlineBlock"
-      minHeight={425}
-      overflow="hidden"
-      rounding={4}
-    >
+    <Box borderStyle="shadow" color="default" display="inlineBlock" minHeight={425} rounding={4}>
       <Flex>
         {radioGroup &&
         // @ts-expect-error - TS2339