fix: wrap SegmentedControl in flex-grow: 0

dhis2 · Mar 12, 2024 · f16baa7 · f16baa7
1 parent ffd4632
commit f16baa7
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 14 deletions.
diff --git a/src/components/Dialogs/PeriodDimension/PeriodDimension.js b/src/components/Dialogs/PeriodDimension/PeriodDimension.js
@@ -176,20 +176,22 @@ export const PeriodDimension = ({ dimension, onClose }) => {
             onClose={onClose}
             title={dimension.name}
         >
-            <SegmentedControl
-                options={[
-                    {
-                        label: i18n.t('Choose from presets'),
-                        value: OPTION_PRESETS,
-                    },
-                    {
-                        label: i18n.t('Define start - end dates'),
-                        value: OPTION_START_END_DATES,
-                    },
-                ]}
-                selected={entryMethod}
-                onChange={onSegmentedControlChange}
-            ></SegmentedControl>
+            <div className={styles.navigation}>
+                <SegmentedControl
+                    options={[
+                        {
+                            label: i18n.t('Choose from presets'),
+                            value: OPTION_PRESETS,
+                        },
+                        {
+                            label: i18n.t('Define start - end dates'),
+                            value: OPTION_START_END_DATES,
+                        },
+                    ]}
+                    selected={entryMethod}
+                    onChange={onSegmentedControlChange}
+                ></SegmentedControl>
+            </div>
             <div className={styles.entry}>
                 {entryMethod === OPTION_PRESETS && (
                     <BasePeriodDimension

diff --git a/src/components/Dialogs/PeriodDimension/PeriodDimension.module.css b/src/components/Dialogs/PeriodDimension/PeriodDimension.module.css
@@ -3,3 +3,7 @@
     margin-top: var(--spacers-dp8);
     padding-top: var(--spacers-dp12);
 }
+
+.navigation {
+    flex-grow: 0;
+}