Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): settings modal switch widths

Browse Source
This commit is contained in:
psychedelicious 2024-01-20 20:05:43 +11:00
parent be72765d02
commit b00ace852d
1 changed files with 130 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsModal.tsx
View File

@ -2,6 +2,7 @@ import {
Button,
Flex,
FormControl,
FormControlGroup,
FormLabel,
Modal,
ModalBody,
@ -210,12 +211,13 @@ const SettingsModal = ({ children, config }: SettingsModalProps) => {
isCentered
>
<ModalOverlay />
<ModalContent maxH="80vh" h="50vh">
<ModalContent maxH="80vh" h="68rem">
<ModalHeader bg="none">{t('common.settingsLabel')}</ModalHeader>
<ModalCloseButton />
<ModalBody display="flex" flexDir="column" gap={4}>
<ScrollableContent>
<Flex flexDir="column" gap={4}>
<FormControlGroup formLabelProps={{ flexGrow: 1 }}>
<StickyScrollable title={t('settings.general')}>
<FormControl>
<FormLabel>{t('settings.confirmOnDelete')}</FormLabel>
@ -247,7 +249,9 @@ const SettingsModal = ({ children, config }: SettingsModalProps) => {
<StickyScrollable title={t('settings.ui')}>
<FormControl>
<FormLabel>{t('settings.showProgressInViewer')}</FormLabel>
<FormLabel>
{t('settings.showProgressInViewer')}
</FormLabel>
<Switch
isChecked={shouldShowProgressInViewer}
onChange={handleChangeShouldShowProgressInViewer}
@ -289,7 +293,9 @@ const SettingsModal = ({ children, config }: SettingsModalProps) => {
{shouldShowDeveloperSettings && (
<StickyScrollable title={t('settings.developer')}>
<FormControl>
<FormLabel>{t('settings.shouldLogToConsole')}</FormLabel>
<FormLabel>
{t('settings.shouldLogToConsole')}
</FormLabel>
<Switch
isChecked={shouldLogToConsole}
onChange={handleLogToConsoleChanged}
@ -352,6 +358,7 @@ const SettingsModal = ({ children, config }: SettingsModalProps) => {
</>
)}
</StickyScrollable>
</FormControlGroup>
</Flex>
</ScrollableContent>
</ModalBody>