Adjust header, input, and modal styles

This commit is contained in:
jeffvli 2023-06-09 14:46:41 -07:00 committed by Jeff
parent cbc08d6f03
commit 14aeee888f
4 changed files with 12 additions and 5 deletions

View file

@ -119,13 +119,12 @@ export const App = () => {
styles: {
body: { background: 'var(--modal-bg)', padding: '1rem !important' },
close: { marginRight: '0.5rem' },
content: { borderRadius: '10px' },
content: { borderRadius: '5px' },
header: {
background: 'var(--modal-bg)',
borderBottom: '1px solid var(--generic-border-color)',
background: 'var(--modal-header-bg)',
paddingBottom: '1rem',
},
title: { fontSize: 'medium', fontWeight: 'bold' },
title: { fontSize: 'medium', fontWeight: 500 },
},
},
},
@ -170,7 +169,7 @@ export const App = () => {
transitionProps: {
duration: 300,
exitDuration: 300,
transition: 'slide-down',
transition: 'fade',
},
}}
modals={{ addToPlaylist: AddToPlaylistContextModal, base: BaseContextModal }}

View file

@ -76,6 +76,7 @@ const StyledTextInput = styled(MantineTextInput)<TextInputProps>`
}
& .mantine-TextInput-label {
margin-bottom: 0.5rem;
font-family: var(--label-font-faimly);
}
@ -127,6 +128,7 @@ const StyledNumberInput = styled(MantineNumberInput)<NumberInputProps>`
}
& .mantine-NumberInput-label {
margin-bottom: 0.5rem;
font-family: var(--label-font-faimly);
}
@ -160,6 +162,7 @@ const StyledPasswordInput = styled(MantinePasswordInput)<PasswordInputProps>`
}
& .mantine-PasswordInput-label {
margin-bottom: 0.5rem;
font-family: var(--label-font-faimly);
}
@ -193,6 +196,7 @@ const StyledFileInput = styled(MantineFileInput)<FileInputProps>`
}
& .mantine-FileInput-label {
margin-bottom: 0.5rem;
font-family: var(--label-font-faimly);
}
@ -226,6 +230,7 @@ const StyledJsonInput = styled(MantineJsonInput)<JsonInputProps>`
}
& .mantine-JsonInput-label {
margin-bottom: 0.5rem;
font-family: var(--label-font-faimly);
}
@ -255,6 +260,7 @@ const StyledTextarea = styled(MantineTextarea)<TextareaProps>`
}
& .mantine-Textarea-label {
margin-bottom: 0.5rem;
font-family: var(--label-font-faimly);
}

View file

@ -103,6 +103,7 @@
--toast-bg: rgb(16, 16, 16);
--modal-bg: var(--main-bg);
--modal-header-bg: var(--paper-bg);
--badge-bg: rgb(80, 80, 80);
--badge-fg: rgb(255, 255, 255);

View file

@ -87,6 +87,7 @@ body[data-theme='defaultLight'] {
--toast-bg: rgb(16, 16, 16);
--modal-bg: rgb(255, 255, 255);
--modal-header-bg: var(--paper-bg);
--paper-bg: rgb(240, 240, 240);