From 401f9296f11952c501be67f2bf011f66e1db8754 Mon Sep 17 00:00:00 2001 From: matushl Date: Sun, 24 Nov 2024 03:14:05 +0100 Subject: [PATCH] WIP - je este potreba zmenit farbu klasickemu, neshrinknutemu labelu - je potreba este dokoncit autocomplet - zamysliet sa nad dalsimi inputmi - spravit error message menej agresivny --- .../FormAutocomplete/FormAutocomplete.tsx | 1 + .../FormItems/FormInput/FormInput.tsx | 1 + src/theme.ts | 60 +++++++++++++++++++ 3 files changed, 62 insertions(+) diff --git a/src/components/FormItems/FormAutocomplete/FormAutocomplete.tsx b/src/components/FormItems/FormAutocomplete/FormAutocomplete.tsx index dec5edd4..05554cab 100644 --- 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 index c0854ee9..48725892 100644 --- a/src/components/FormItems/FormInput/FormInput.tsx +++ b/src/components/FormItems/FormInput/FormInput.tsx @@ -28,6 +28,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 index 81575bff..ca71309e 100644 --- a/src/theme.ts +++ b/src/theme.ts @@ -245,6 +245,66 @@ 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: { + color: 'inherit', + }, + }, + }, }, })