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

🐛 Fix opacity in Header and AppShelf accordion

Browse Source
This commit is contained in:
ajnart
2022-09-03 00:40:44 +02:00
parent 1dc90e1e03
commit 247e950713
2 changed files with 43 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/layout/Header.tsx
View File

@@ -1,10 +1,11 @@
import { Box, createStyles, Group, Header as Head } from '@mantine/core';
import { Box, createStyles, Group, Header as Head, useMantineColorScheme } from '@mantine/core';
import { AddItemShelfButton } from '../AppShelf/AddAppShelfItem';
import DockerMenuButton from '../../modules/docker/DockerModule';
import SearchBar from '../../modules/search/SearchModule';
import { SettingsMenuButton } from '../Settings/SettingsMenu';
import { Logo } from './Logo';
import { useConfig } from '../../tools/state';
const HEADER_HEIGHT = 60;
@@ -23,9 +24,19 @@ const useStyles = createStyles((theme) => ({
export function Header(props: any) {
const { classes, cx } = useStyles();
const { config } = useConfig();
const { colorScheme } = useMantineColorScheme();
return (
<Head height="auto">
<Head
height="auto"
style={{
background: `rgba(${colorScheme === 'dark' ? '37, 38, 43,' : '255, 255, 255,'} \
${(config.settings.appOpacity || 100) / 100}`,
borderColor: `rgba(${colorScheme === 'dark' ? '37, 38, 43,' : '233, 236, 239,'} \
${(config.settings.appOpacity || 100) / 100}`,
}}
>
<Group p="xs" position="apart">
<Box className={classes.hide}>
<Logo style={{ fontSize: 22 }} />