feat: improve design layout selector

src/components/layout/Layout.tsx

@@ -3,7 +3,7 @@ import { useConfigContext } from '../../config/provider';
 import { Background } from './Background';
 import { Footer } from './Footer';
 import { Header } from './Header/Header';
-import { Head } from './Head/Head';
+import { Head } from './Header/Meta/Head';
 
 const useStyles = createStyles(() => ({}));
 

src/components/layout/Logo.tsx

@@ -14,7 +14,7 @@ export function Logo({ size = 'md', withoutText = false }: LogoProps) {
   return (
     <Group spacing={size === 'md' ? 'xs' : 4} noWrap>
       <Image
-        width={size === 'md' ? 50 : 20}
+        width={size === 'md' ? 50 : 12}
         src={config?.settings.customization.logoImageUrl || '/imgs/logo/logo.png'}
         style={{
           position: 'relative',
@@ -22,7 +22,7 @@ export function Logo({ size = 'md', withoutText = false }: LogoProps) {
       />
       {withoutText ? null : (
         <Text
-          size={size === 'md' ? 22 : 'xs'}
+          size={size === 'md' ? 22 : 10}
           weight="bold"
           variant="gradient"
           gradient={primaryGradient}

src/components/layout/header/Actions/RunToolAction/ToolsMenu.tsx

@@ -1,7 +1,7 @@
 import { ActionIcon, Menu, Text } from '@mantine/core';
 import { IconAxe } from '@tabler/icons';
 import { useTranslation } from 'next-i18next';
-import DockerMenuButton from '../../../modules/docker/DockerModule';
+import DockerMenuButton from '../../../../../modules/docker/DockerModule';
 
 export const ToolsMenu = () => {
   const { t } = useTranslation('layout/tools');

src/components/layout/header/Header.tsx

@@ -1,14 +1,12 @@
-import { Box, createStyles, Group, Header as MantineHeader, useMantineTheme } from '@mantine/core';
-import { useViewportSize } from '@mantine/hooks';
+import { Box, createStyles, Group, Header as MantineHeader } from '@mantine/core';
 import { AddItemShelfButton } from '../../AppShelf/AddAppShelfItem';
 
-import DockerMenuButton from '../../../modules/docker/DockerModule';
-import { Search } from './Search';
 import { Logo } from '../Logo';
 import { useCardStyles } from '../useCardStyles';
-import { SettingsMenu } from './SettingsMenu';
-import { ToolsMenu } from './ToolsMenu';
 import { AddElementAction } from './Actions/AddElementAction/AddElementAction';
+import { ToolsMenu } from './Actions/RunToolAction/ToolsMenu';
+import { Search } from './Search';
+import { SettingsMenu } from './SettingsMenu';
 
 export const HeaderHeight = 64;
 

src/components/layout/header/Meta/Head.tsx

@@ -2,7 +2,7 @@
 import React from 'react';
 import NextHead from 'next/head';
 import { SafariStatusBarStyle } from './SafariStatusBarStyle';
-import { useConfigContext } from '../../../config/provider';
+import { useConfigContext } from '../../../../config/provider';
 
 export function Head() {
   const { config } = useConfigContext();

src/components/layout/header/Search.tsx

@@ -18,7 +18,7 @@ import { useTranslation } from 'next-i18next';
 import React, { forwardRef, useEffect, useRef, useState } from 'react';
 import SmallServiceItem from '../../AppShelf/SmallServiceItem';
 import Tip from '../Tip';
-import { searchUrls } from '../../Settings/Common/SearchEngineSelector';
+import { searchUrls } from '../../Settings/Common/SearchEngine/SearchEngineSelector';
 import { useConfigContext } from '../../../config/provider';
 import { OverseerrMediaDisplay } from '../../../modules/common';
 import { IModule } from '../../../modules/ModuleTypes';