mirror of
https://github.com/hamster1963/nezha-dash.git
synced 2025-04-24 21:10:45 +08:00
Merge pull request #58 from FarEastTZ/main
feat: add force use svg flag
This commit is contained in:
commit
e14963cfda
@ -6,3 +6,4 @@ NEXT_PUBLIC_ShowFlag=true
|
|||||||
NEXT_PUBLIC_DisableCartoon=false
|
NEXT_PUBLIC_DisableCartoon=false
|
||||||
NEXT_PUBLIC_ShowTag=true
|
NEXT_PUBLIC_ShowTag=true
|
||||||
NEXT_PUBLIC_ShowNetTransfer=false
|
NEXT_PUBLIC_ShowNetTransfer=false
|
||||||
|
NEXT_PUBLIC_ForceUseSvgFlag=false
|
@ -22,6 +22,7 @@
|
|||||||
| NEXT_PUBLIC_DisableCartoon | 是否禁用卡通人物 | **默认**:false |
|
| NEXT_PUBLIC_DisableCartoon | 是否禁用卡通人物 | **默认**:false |
|
||||||
| NEXT_PUBLIC_ShowTag | 是否显示标签 | **默认**:false |
|
| NEXT_PUBLIC_ShowTag | 是否显示标签 | **默认**:false |
|
||||||
| NEXT_PUBLIC_ShowNetTransfer | 是否显示流量信息 | **默认**:false |
|
| NEXT_PUBLIC_ShowNetTransfer | 是否显示流量信息 | **默认**:false |
|
||||||
|
| NEXT_PUBLIC_ForceUseSvgFlag | 是否强制使用SVG显示旗帜 | **默认**:false |
|
||||||
|
|
||||||
#### 多语言支持
|
#### 多语言支持
|
||||||
|
|
||||||
|
@ -1,10 +1,19 @@
|
|||||||
import getUnicodeFlagIcon from "country-flag-icons/unicode";
|
import getUnicodeFlagIcon from "country-flag-icons/unicode";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
|
import { env } from "next-runtime-env";
|
||||||
|
|
||||||
export default function ServerFlag({ country_code }: { country_code: string }) {
|
export default function ServerFlag({ country_code }: { country_code: string }) {
|
||||||
const [supportsEmojiFlags, setSupportsEmojiFlags] = useState(false);
|
const [supportsEmojiFlags, setSupportsEmojiFlags] = useState(false);
|
||||||
|
|
||||||
|
const useSvgFlag = env("NEXT_PUBLIC_ForceUseSvgFlag") === "true";
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
if (useSvgFlag) {
|
||||||
|
// 如果环境变量要求直接使用 SVG,则无需检查 Emoji 支持
|
||||||
|
setSupportsEmojiFlags(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const checkEmojiSupport = () => {
|
const checkEmojiSupport = () => {
|
||||||
const canvas = document.createElement("canvas");
|
const canvas = document.createElement("canvas");
|
||||||
const ctx = canvas.getContext("2d");
|
const ctx = canvas.getContext("2d");
|
||||||
@ -20,7 +29,7 @@ export default function ServerFlag({ country_code }: { country_code: string }) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
checkEmojiSupport();
|
checkEmojiSupport();
|
||||||
}, []);
|
}, [useSvgFlag]); // 将 `useSvgFlag` 作为依赖,当其变化时重新触发
|
||||||
|
|
||||||
if (!country_code) return null;
|
if (!country_code) return null;
|
||||||
|
|
||||||
@ -30,7 +39,7 @@ export default function ServerFlag({ country_code }: { country_code: string }) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<span className="text-[12px] text-muted-foreground">
|
<span className="text-[12px] text-muted-foreground">
|
||||||
{!supportsEmojiFlags ? (
|
{useSvgFlag || !supportsEmojiFlags ? (
|
||||||
<span className={`fi fi-${country_code}`}></span>
|
<span className={`fi fi-${country_code}`}></span>
|
||||||
) : (
|
) : (
|
||||||
getUnicodeFlagIcon(country_code)
|
getUnicodeFlagIcon(country_code)
|
||||||
|
@ -6,3 +6,4 @@ NEXT_PUBLIC_ShowFlag=true
|
|||||||
NEXT_PUBLIC_DisableCartoon=false
|
NEXT_PUBLIC_DisableCartoon=false
|
||||||
NEXT_PUBLIC_ShowTag=true
|
NEXT_PUBLIC_ShowTag=true
|
||||||
NEXT_PUBLIC_ShowNetTransfer=false
|
NEXT_PUBLIC_ShowNetTransfer=false
|
||||||
|
NEXT_PUBLIC_ForceUseSvgFlag=false
|
Loading…
Reference in New Issue
Block a user