fix: Rework the layout of the parameters scrollbar

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

View File

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

View File

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

View File

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

View File

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

View File

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