perf: adapting style tightBorder

This commit is contained in:
pacmandoh 2023-12-27 23:10:32 +08:00 committed by Hk-Gosuto
parent 5576481bb4
commit 4ea2b66e1a
2 changed files with 12 additions and 15 deletions

View File

@ -9,7 +9,7 @@ import styles from "./home.module.scss";
import BotIcon from "../icons/bot.svg";
import LoadingIcon from "../icons/three-dots.svg";
import { getCSSVar, useMobileScreen } from "../utils";
import { useMobileScreen } from "../utils";
import dynamic from "next/dynamic";
import { ModelProvider, Path, SlotID } from "../constant";
@ -127,22 +127,19 @@ function Screen() {
'meta[name="theme-color"][media*="light"]',
);
if (isHome) {
if (config.theme === "auto") {
const themeColor = getCSSVar("--theme-color");
metaDescriptionDark?.setAttribute("content", themeColor);
metaDescriptionLight?.setAttribute("content", themeColor);
if (shouldTightBorder || isMobileScreen) {
if (isHome) {
metaDescriptionDark?.setAttribute("content", "#1b262a");
metaDescriptionLight?.setAttribute("content", "#e7f8ff");
} else {
const themeColor = getCSSVar("--theme-color");
metaDescriptionDark?.setAttribute("content", themeColor);
metaDescriptionLight?.setAttribute("content", themeColor);
metaDescriptionDark?.setAttribute("content", "#1e1e1e");
metaDescriptionLight?.setAttribute("content", "white");
}
} else {
const themeColor = getCSSVar("--white");
metaDescriptionDark?.setAttribute("content", themeColor);
metaDescriptionLight?.setAttribute("content", themeColor);
metaDescriptionDark?.setAttribute("content", "#151515");
metaDescriptionLight?.setAttribute("content", "#fafafa");
}
}, [config.theme, isHome]);
}, [config.theme, isHome, shouldTightBorder, isMobileScreen]);
return (
<div

View File

@ -12,7 +12,7 @@
--second: rgb(231, 248, 255);
--hover-color: #f3f3f3;
--bar-color: rgba(0, 0, 0, 0.1);
--theme-color: #e7f8ff;
// --theme-color: #e7f8ff;
/* shadow */
--shadow: 50px 50px 100px 10px rgb(0, 0, 0, 0.1);
@ -34,7 +34,7 @@
--hover-color: #323232;
--bar-color: rgba(255, 255, 255, 0.1);
--border-in-light: 1px solid rgba(255, 255, 255, 0.192);
--theme-color: #1b262a;
// --theme-color: #1b262a;
div:not(.no-dark) > svg {
filter: invert(0.5);