green favicon

This commit is contained in:
Briant Diehl
2024-08-30 16:54:23 -06:00
parent 4005eac69d
commit 2f659ccf97
7 changed files with 19 additions and 40 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.5 KiB

-29
View File
@@ -1,29 +0,0 @@
import Head from 'next/head';
import { useMemo } from 'react';
import { useFeatureFlags } from '~/providers/FeatureFlagsProvider';
export default function AppFavIcons() {
const featureFlags = useFeatureFlags();
const { isGreen } = featureFlags;
const iconProps = useMemo(() => {
if (isGreen) {
return {
href: '/favicon-green.png',
type: 'image/png',
size: '50x50',
};
}
return {
href: '/favicon-blue.ico',
type: 'image/x-icon',
size: 'any',
};
}, [isGreen]);
return (
<Head>
<link rel="icon" {...iconProps} />
</Head>
);
}
-2
View File
@@ -98,7 +98,6 @@ import { UserBuzz } from '../User/UserBuzz';
import dynamic from 'next/dynamic';
import clsx from 'clsx';
import { useBuyBuzz } from '~/components/Buzz/buzz.utils';
import AppFavIcons from '~/components/AppLayout/AppFavIcons';
const FeatureIntroductionModal = dynamic(() =>
import('~/components/FeatureIntroduction/FeatureIntroduction').then(
@@ -812,7 +811,6 @@ export function AppHeader({
['border-red-800 border-b-[3px]']: features.isRed,
})}
>
<AppFavIcons />
<Box className={cx(classes.mobileSearchWrapper, { [classes.dNone]: !showSearch })}>
{renderSearchComponent({ onSearchDone, isMobile: true, ref: searchRef })}
</Box>
+10 -6
View File
@@ -2,16 +2,20 @@ import { useMantineTheme } from '@mantine/core';
import React from 'react';
import { ContainerProvider } from '~/components/ContainerProvider/ContainerProvider';
import { GenerationSidebar } from '~/components/ImageGeneration/GenerationSidebar';
import { MetaPWA } from '~/components/Meta/MetaPWA';
export function BaseLayout({ children }: { children: React.ReactNode }) {
const theme = useMantineTheme();
return (
<div className={`flex size-full ${theme.colorScheme}`}>
<GenerationSidebar />
<ContainerProvider id="main" containerName="main" className="flex-1">
{children}
</ContainerProvider>
</div>
<>
<MetaPWA />
<div className={`flex size-full ${theme.colorScheme}`}>
<GenerationSidebar />
<ContainerProvider id="main" containerName="main" className="flex-1">
{children}
</ContainerProvider>
</div>
</>
);
}
+9 -2
View File
@@ -1,6 +1,12 @@
import Head from 'next/head';
import { useFeatureFlags } from '~/providers/FeatureFlagsProvider';
export function MetaPWA() {
const featureFlags = useFeatureFlags();
const { isGreen } = featureFlags;
return (
<>
<Head>
<meta name="viewport" content="maximum-scale=1, initial-scale=1, width=device-width" />
<link rel="manifest" href="/site.webmanifest" />
<meta name="apple-mobile-web-app-capable" content="yes" />
@@ -306,6 +312,7 @@ export function MetaPWA() {
href="/images/splash/apple-splash-dark-1136-640.jpg"
media="(prefers-color-scheme: dark) and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"
/>
</>
<link rel="icon" href={`/favicon-${isGreen ? 'green' : 'blue'}.ico`} type="image/x-icon" />
</Head>
);
}
-1
View File
@@ -124,7 +124,6 @@ function MyApp(props: CustomAppProps) {
<>
<Head>
<title>Civitai | Share your models</title>
<MetaPWA />
</Head>
<ThemeProvider colorScheme={colorScheme}>
{/* <ErrorBoundary> */}