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: Rework the layout of the parameters scrollbar

Browse Source
This commit is contained in:
blessedcoolant 2023-05-13 08:18:16 +12:00
parent 3b0da6e7af
commit 6f1fc397f7
5 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
invokeai/frontend/web/src/features/ui/components/ParametersPinnedWrapper.tsx
View File

@ -43,13 +43,18 @@ const ParametersPinnedWrapper = (props: ParametersPinnedWrapperProps) => {
h: 'full', h: 'full',
w: 'full', w: 'full',
position: 'absolute', position: 'absolute',
paddingRight: 4,
}} }}
> >
{props.children} {props.children}
</Flex> </Flex>
</OverlayScrollable> </OverlayScrollable>
<PinParametersPanelButton <PinParametersPanelButton
sx={{ position: 'absolute', top: 0, insetInlineEnd: 0 }} sx={{
position: 'absolute',
top: 0,
insetInlineEnd: 4,
}}
/> />
</Box> </Box>
); );

6
invokeai/frontend/web/src/features/ui/components/common/OverlayScrollable.tsx
View File

@ -8,9 +8,9 @@ const OverlayScrollable = (props: PropsWithChildren) => {
style={{ height: '100%', width: '100%' }} style={{ height: '100%', width: '100%' }}
options={{ options={{
scrollbars: { scrollbars: {
visibility: 'auto', visibility: 'visible',
autoHide: 'move', autoHide: 'never',
autoHideDelay: 1300, autoHideDelay: 500,
theme: 'os-theme-dark', theme: 'os-theme-dark',
}, },
overflow: { x: 'hidden' }, overflow: { x: 'hidden' },

2
invokeai/frontend/web/src/features/ui/components/tabs/ImageToImage/ImageToImageTab.tsx
View File

@ -23,7 +23,7 @@ const ImageToImageTab = () => {
}, []); }, []);
return ( return (
<Flex sx={{ gap: 4, w: 'full', h: 'full' }}> <Flex sx={{ gap: 2, w: 'full', h: 'full' }}>
<ParametersPinnedWrapper> <ParametersPinnedWrapper>
<ImageToImageTabParameters /> <ImageToImageTabParameters />
</ParametersPinnedWrapper> </ParametersPinnedWrapper>

2
invokeai/frontend/web/src/features/ui/components/tabs/TextToImage/TextToImageTab.tsx
View File

@ -6,7 +6,7 @@ import ParametersPinnedWrapper from '../../ParametersPinnedWrapper';
const TextToImageTab = () => { const TextToImageTab = () => {
return ( return (
<Flex sx={{ gap: 4, w: 'full', h: 'full' }}> <Flex sx={{ gap: 2, w: 'full', h: 'full' }}>
<ParametersPinnedWrapper> <ParametersPinnedWrapper>
<TextToImageTabParameters /> <TextToImageTabParameters />
</ParametersPinnedWrapper> </ParametersPinnedWrapper>

2
invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasTab.tsx
View File

@ -20,7 +20,7 @@ const UnifiedCanvasTab = () => {
const { shouldUseCanvasBetaLayout } = useAppSelector(selector); const { shouldUseCanvasBetaLayout } = useAppSelector(selector);
return ( return (
<Flex sx={{ gap: 4, w: 'full', h: 'full' }}> <Flex sx={{ gap: 2, w: 'full', h: 'full' }}>
<ParametersPinnedWrapper> <ParametersPinnedWrapper>
<UnifiedCanvasParameters /> <UnifiedCanvasParameters />
</ParametersPinnedWrapper> </ParametersPinnedWrapper>