cosmik.network
A social knowledge tool for researchers built on ATProto
fix: semble header theme color
+4
-6
src/webapp/features/semble/containers/sembleContainer/SembleHeaderBackground.tsx
+4
-6
src/webapp/features/semble/containers/sembleContainer/SembleHeaderBackground.tsx
···
1
-
'use client';
2
-
3
-
import { useColorScheme } from '@mantine/hooks';
4
import BG from '@/assets/semble-header-bg.webp';
5
import DarkBG from '@/assets/semble-header-bg-dark.webp';
6
import { Box, Image } from '@mantine/core';
7
8
export default function SembleHeaderBackground() {
9
-
const colorScheme = useColorScheme();
10
-
11
return (
12
<Box style={{ position: 'relative', width: '100%' }}>
13
<Image
14
-
src={colorScheme === 'dark' ? DarkBG.src : BG.src}
15
alt="bg"
16
fit="cover"
17
w="100%"
18
h={80}
19
/>
20
21
{/* White gradient overlay */}
22
<Box
···
1
import BG from '@/assets/semble-header-bg.webp';
2
import DarkBG from '@/assets/semble-header-bg-dark.webp';
3
import { Box, Image } from '@mantine/core';
4
5
export default function SembleHeaderBackground() {
6
return (
7
<Box style={{ position: 'relative', width: '100%' }}>
8
<Image
9
+
src={DarkBG.src}
10
alt="bg"
11
fit="cover"
12
w="100%"
13
h={80}
14
+
lightHidden
15
/>
16
+
17
+
<Image src={BG.src} alt="bg" fit="cover" w="100%" h={80} darkHidden />
18
19
{/* White gradient overlay */}
20
<Box