Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-10 07:25:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

🚸 Improve mobile reponsiveness

Browse Source
This commit is contained in:
Manuel
2023-07-29 21:33:44 +02:00
parent b4192137de
commit 3d2e909237
2 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/layout/Logo.tsx
View File

@@ -1,4 +1,5 @@
import { Group, Image, Text } from '@mantine/core'; import { Group, Image, Text } from '@mantine/core';
import { useScreenLargerThan } from '~/hooks/useScreenLargerThan';
import { useConfigContext } from '../../config/provider'; import { useConfigContext } from '../../config/provider';
import { usePrimaryGradient } from './useGradient'; import { usePrimaryGradient } from './useGradient';
@@ -11,6 +12,7 @@ interface LogoProps {
export function Logo({ size = 'md', withoutText = false }: LogoProps) { export function Logo({ size = 'md', withoutText = false }: LogoProps) {
const { config } = useConfigContext(); const { config } = useConfigContext();
const primaryGradient = usePrimaryGradient(); const primaryGradient = usePrimaryGradient();
const largerThanMd = useScreenLargerThan('md');
return ( return (
<Group spacing={size === 'md' ? 'xs' : 4} noWrap> <Group spacing={size === 'md' ? 'xs' : 4} noWrap>
@@ -20,7 +22,7 @@ export function Logo({ size = 'md', withoutText = false }: LogoProps) {
alt="Homarr Logo" alt="Homarr Logo"
className="dashboard-header-logo-image" className="dashboard-header-logo-image"
/> />
{withoutText ? null : ( {withoutText || !largerThanMd ? null : (
<Text <Text
size={size === 'md' ? 22 : 10} size={size === 'md' ? 22 : 10}
weight="bold" weight="bold"

4
src/components/layout/admin/main-admin.layout.tsx
View File

@@ -57,7 +57,7 @@ export const MainLayout = ({ children }: MainLayoutProps) => {
}, },
}} }}
navbar={ navbar={
<Navbar width={{ base: 300 }}> <Navbar width={{ base: 220 }}>
<Navbar.Section pt="xs" grow> <Navbar.Section pt="xs" grow>
<NavLink <NavLink
icon={ icon={
@@ -131,7 +131,7 @@ export const MainLayout = ({ children }: MainLayoutProps) => {
<Box bg="red" h={30} p={3} px={6}> <Box bg="red" h={30} p={3} px={6}>
<Flex h="100%" align="center" columnGap={7}> <Flex h="100%" align="center" columnGap={7}>
<IconAlertTriangle color="white" size="1rem" /> <IconAlertTriangle color="white" size="1rem" />
<Text color="white"> <Text color="white" lineClamp={1}>
This is an experimental feature of Homarr. Please report any issues to the official This is an experimental feature of Homarr. Please report any issues to the official
Homarr team. Homarr team.
</Text> </Text>