full width buttons

Sage-Bionetworks · Dec 12, 2024 · cce388e · cce388e
1 parent 475b742
commit cce388e
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/packages/synapse-react-client/src/components/FullWidthAlert/FullWidthAlert.tsx b/packages/synapse-react-client/src/components/FullWidthAlert/FullWidthAlert.tsx
@@ -156,11 +156,16 @@ function FullWidthAlert(props: FullWidthAlertProps) {
             alignItems="center"
             display="flex"
             flexShrink={0}
-            sx={{
+            sx={theme => ({
               gap: { xs: '8px', sm: 'initial' },
               flexWrap: { xs: 'wrap', sm: 'nowrap' },
               width: { xs: '100%', sm: 'initial' },
-            }}
+              [theme.breakpoints.down('sm')]: {
+                '& > *': {
+                  flexGrow: 1,
+                },
+              },
+            })}
           >
             {tertiaryButtonConfig && (
               <ButtonFromConfig config={tertiaryButtonConfig} variant="text" />