Revert "fix: Rework the layout of the parameters scrollbar"

This reverts commit 6f1fc397f7.
This commit is contained in:
psychedelicious 2023-05-13 23:59:30 +10:00
parent 5a7b687c84
commit d3a7fea939
5 changed files with 7 additions and 12 deletions

View File

@ -43,18 +43,13 @@ 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={{ sx={{ position: 'absolute', top: 0, insetInlineEnd: 0 }}
position: 'absolute',
top: 0,
insetInlineEnd: 4,
}}
/> />
</Box> </Box>
); );

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: 'visible', visibility: 'auto',
autoHide: 'never', autoHide: 'move',
autoHideDelay: 500, autoHideDelay: 1300,
theme: 'os-theme-dark', theme: 'os-theme-dark',
}, },
overflow: { x: 'hidden' }, overflow: { x: 'hidden' },

View File

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

View File

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

View File

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