fix(ui): fix control layer list layout

This commit is contained in:
psychedelicious 2024-05-03 11:28:52 +10:00 committed by Kent Keirsey
parent c30df7ce79
commit 2baa33730a
2 changed files with 4 additions and 4 deletions

View File

@ -22,13 +22,13 @@ const selectLayerIdTypePairs = createMemoizedSelector(selectControlLayersSlice,
export const ControlLayersPanelContent = memo(() => { export const ControlLayersPanelContent = memo(() => {
const layerIdTypePairs = useAppSelector(selectLayerIdTypePairs); const layerIdTypePairs = useAppSelector(selectLayerIdTypePairs);
return ( return (
<Flex flexDir="column" gap={4} w="full" h="full"> <Flex flexDir="column" gap={2} w="full" h="full">
<Flex justifyContent="space-around"> <Flex justifyContent="space-around">
<AddLayerButton /> <AddLayerButton />
<DeleteAllLayersButton /> <DeleteAllLayersButton />
</Flex> </Flex>
<ScrollableContent> <ScrollableContent>
<Flex flexDir="column" gap={4}> <Flex flexDir="column" gap={2}>
{layerIdTypePairs.map(({ id, type }) => ( {layerIdTypePairs.map(({ id, type }) => (
<LayerWrapper key={id} id={id} type={type} /> <LayerWrapper key={id} id={id} type={type} />
))} ))}

View File

@ -71,7 +71,7 @@ const ParametersPanelTextToImage = () => {
</Tab> </Tab>
</TabList> </TabList>
<TabPanels w="full" h="full"> <TabPanels w="full" h="full">
<TabPanel p={0}> <TabPanel p={0} w="full" h="full">
<Flex gap={2} flexDirection="column" h="full" w="full"> <Flex gap={2} flexDirection="column" h="full" w="full">
<ImageSettingsAccordion /> <ImageSettingsAccordion />
<GenerationSettingsAccordion /> <GenerationSettingsAccordion />
@ -81,7 +81,7 @@ const ParametersPanelTextToImage = () => {
<AdvancedSettingsAccordion /> <AdvancedSettingsAccordion />
</Flex> </Flex>
</TabPanel> </TabPanel>
<TabPanel p={0}> <TabPanel p={0} w="full" h="full">
<ControlLayersPanelContent /> <ControlLayersPanelContent />
</TabPanel> </TabPanel>
</TabPanels> </TabPanels>