github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-04-23 03:00:31 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): tweak splash screen layout

Browse Source
This commit is contained in:
psychedelicious
2025-06-17 11:32:29 +10:00
parent 1d2a85dd6e
commit 680c759af3
2 changed files with 16 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/InitialState.tsx
View File

@@ -13,17 +13,17 @@ export const InitialState = memo(() => {
}, [dispatch]);
return (
<Flex flexDir="column" h="full" w="full" gap={2}>
<Flex px={2} alignItems="center" minH="24px">
<Flex flexDir="column" h="full" w="full" alignItems="center" justifyContent="center" gap={2}>
<Flex px={2} w="full" alignItems="center" minH="24px" justifyContent="flex-start" flexShrink={0}>
<Heading size="sm">Get Started</Heading>
</Flex>
<Divider />
<Flex flexDir="column" h="full" justifyContent="center" mx={16}>
<Flex flexDir="column" w="full" h="full" justifyContent="center" gap={4} mx={16} maxW={768}>
<Heading mb={4}>Get started with Invoke.</Heading>
<Flex flexDir="column" gap={4}>
<Grid gridTemplateColumns="1fr 1fr" gap={4}>
<Flex flexDir="column" gap={8}>
<Grid gridTemplateColumns="1fr 1fr" gap={8}>
<InitialStateMainModelPicker />
<Flex flexDir="column" gap={2}>
<Flex flexDir="column" gap={2} justifyContent="center">
<Text>
Want to learn what prompts work best for each model?{' '}
<Button as="a" variant="link" href="#" size="sm">

20
invokeai/frontend/web/src/features/controlLayers/components/SimpleSession/InitialStateMainModelPicker.tsx
View File

@@ -30,16 +30,16 @@ export const InitialStateMainModelPicker = memo(() => {
return (
<FormControl orientation="vertical" alignItems="unset">
<InformationalPopover feature="paramModel">
<FormLabel>Select your Model</FormLabel>
</InformationalPopover>
{isFluxDevSelected && (
<InformationalPopover feature="fluxDevLicense" hideDisable={true}>
<Flex justifyContent="flex-start">
<Icon as={MdMoneyOff} />
</Flex>
</InformationalPopover>
)}
<FormLabel display="flex" fontSize="md" gap={2}>
Select your Model{' '}
{isFluxDevSelected && (
<InformationalPopover feature="fluxDevLicense" hideDisable={true}>
<Flex justifyContent="flex-start">
<Icon as={MdMoneyOff} />
</Flex>
</InformationalPopover>
)}
</FormLabel>
<ModelPicker modelConfigs={modelConfigs} selectedModelConfig={selectedModelConfig} onChange={onChange} grouped />
</FormControl>
);