WIP

- je este potreba zmenit farbu klasickemu, neshrinknutemu labelu - je potreba este dokoncit autocomplet - zamysliet sa nad dalsimi inputmi - spravit error message menej agresivny
ZdruzenieSTROM · Nov 24, 2024 · 1c06aee · 1c06aee
1 parent d08e2cb
commit 1c06aee
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 0 deletions.
diff --git a/src/components/FormItems/FormAutocomplete/FormAutocomplete.tsx b/src/components/FormItems/FormAutocomplete/FormAutocomplete.tsx
@@ -44,6 +44,7 @@ export const FormAutocomplete = <
               label={label}
               variant="outlined"
               fullWidth
+              // error={!!error}
               helperText={error?.message}
               focused={false}
             />

diff --git a/src/components/FormItems/FormInput/FormInput.tsx b/src/components/FormItems/FormInput/FormInput.tsx
@@ -29,6 +29,7 @@ export const FormInput = <
         type={type}
         variant="outlined"
         fullWidth
+        error={!!error}
         helperText={error?.message}
         focused={false}
         sx={formItemStyle}

diff --git a/src/theme.ts b/src/theme.ts
@@ -244,6 +244,59 @@ const _theme = createTheme({
         },
       },
     },
+    MuiInputBase: {
+      styleOverrides: {
+        root: {
+          '&.Mui-error': {
+            backgroundColor: 'black',
+            '& input': {color: 'white'},
+          },
+        },
+      },
+    },
+    MuiOutlinedInput: {
+      styleOverrides: {
+        root: {
+          '&.Mui-error .MuiOutlinedInput-notchedOutline': {
+            borderColor: 'black',
+          },
+        },
+      },
+    },
+    // MuiFormControl: {
+    //   styleOverrides: {
+    //     root: {
+    //       'MuiTextField-root .MuiInputLabel-root.MuiInputLabel-shrink': {
+    //         color: 'green',
+    //       },
+    //       backgroundColor: 'yellow',
+    //     },
+    //   },
+    // },
+    MuiTextField: {
+      styleOverrides: {
+        root: {
+          // Root styles for the TextField
+          '& .MuiInputLabel-root.MuiInputLabel-shrink': {
+            color: 'green', // Change label color to black
+            fontWeight: 700, // Set font weight to 700
+            padding: '2px 8px',
+            backgroundColor: 'white',
+            marginLeft: '-1px',
+          },
+        },
+      },
+    },
+    MuiInputLabel: {
+      styleOverrides: {
+        root: {
+          '&.MuiInputLabel-shrink .': {
+            color: 'green',
+          },
+          color: 'red',
+        },
+      },
+    },
     MuiIconButton: {
       styleOverrides: {
         root: {