fix: make sure text boxes have correct width

brave · Aug 4, 2023 · e8dfb4d · e8dfb4d
1 parent 1e68198
commit e8dfb4d
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/src/form/FormikHelpers.tsx b/src/form/FormikHelpers.tsx
@@ -48,7 +48,7 @@ export const FormikTextField: React.FC<FormikTextFieldProps> = (props) => {
 
   const extraOmit = props.useTopLabel ? ["label"] : [];
   return (
-    <Box>
+    <Box flexGrow={1}>
       {props.useTopLabel && (
         <FormLabel sx={{ color: "text.primary" }}> {props.label} </FormLabel>
       )}
@@ -67,6 +67,9 @@ export const FormikTextField: React.FC<FormikTextFieldProps> = (props) => {
         }
         sx={props.useTopLabel ? { marginBottom: 2 } : {}}
         disabled={props.disabled}
+        inputProps={{
+          maxLength: props.maxLengthInstantFeedback,
+        }}
         {..._.omit(props, [
           "small",
           "maxLengthInstantFeedback",

diff --git a/src/user/ads/NotificationAd.tsx b/src/user/ads/NotificationAd.tsx
@@ -47,17 +47,15 @@ export function NotificationAd({ onCreate }: Props) {
     <CardContainer header="New Ad">
       <FormikTextField name="newCreative.name" label="Ad Name" />
 
-      <Stack direction="row" alignItems="center">
+      <Stack direction="row" alignItems="center" spacing={1}>
         <FormikTextField
-          sx={{ mr: 0.5 }}
           name="newCreative.title"
           label="Ad Title"
           helperText="Max 30 Characters"
           maxLengthInstantFeedback={30}
         />
 
         <FormikTextField
-          sx={{ ml: 0.5 }}
           name="newCreative.body"
           label="Ad Body"
           helperText="Max 60 Characters"