fix(ui): more responsive layout work

invokeai/frontend/web/src/features/gallery/components/ImageGalleryPanel.tsx

@@ -189,7 +189,12 @@ export default function ImageGalleryPanel() {
 
   const imageGalleryContent = () => {
     return (
-      <Flex w="100vw" h="100vh" paddingRight={{ base: 8, xl: 0 }}>
+      <Flex
+        w="100vw"
+        h={{ base: 300, xl: '100vh' }}
+        paddingRight={{ base: 8, xl: 0 }}
+        paddingBottom={{ base: 4, xl: 0 }}
+      >
         <ImageGalleryContent />
       </Flex>
     );

invokeai/frontend/web/src/features/system/components/InvokeAILogoComponent.tsx

@@ -18,7 +18,7 @@ const InvokeAILogoComponent = () => {
         minW="32px"
         minH="32px"
       />
-      <Flex gap={3} display={{ base: 'none', md: 'inherit' }}>
+      <Flex gap={3} display={{ base: 'inherit', sm: 'none', md: 'inherit' }}>
         <Text fontSize="xl">
           invoke <strong>ai</strong>
         </Text>

invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx

@@ -1,6 +1,5 @@
 import {
   ChakraProps,
-  Flex,
   Icon,
   Tab,
   TabList,