Austin/mihomo-party
1
0
Fork 0
mirror of https://github.com/pompurin404/mihomo-party.git synced 2024-11-16 03:32:17 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

fix chart color

Browse Source
This commit is contained in:
pompurin404 2024-09-21 15:40:25 +08:00
parent beb19f237d
commit e92b3d250a
No known key found for this signature in database
1 changed files with 15 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/renderer/src/components/sider/conn-card.tsx
View File

@ -2,7 +2,7 @@ import { Button, Card, CardBody, CardFooter } from '@nextui-org/react'
import { FaCircleArrowDown, FaCircleArrowUp } from 'react-icons/fa6' import { FaCircleArrowDown, FaCircleArrowUp } from 'react-icons/fa6'
import { useLocation } from 'react-router-dom' import { useLocation } from 'react-router-dom'
import { calcTraffic } from '@renderer/utils/calc' import { calcTraffic } from '@renderer/utils/calc'
import { useEffect, useMemo, useState } from 'react' import { useEffect, useState } from 'react'
import { useSortable } from '@dnd-kit/sortable' import { useSortable } from '@dnd-kit/sortable'
import { CSS } from '@dnd-kit/utilities' import { CSS } from '@dnd-kit/utilities'
import { IoLink } from 'react-icons/io5' import { IoLink } from 'react-icons/io5'
@ -36,13 +36,19 @@ const ConnCard: React.FC = () => {
id: 'connection' id: 'connection'
}) })
const [series, setSeries] = useState(Array(10).fill(0)) const [series, setSeries] = useState(Array(10).fill(0))
const chartColor = useMemo(() => { const [chartColor, setChartColor] = useState('rgba(255,255,255)')
const islight = theme === 'system' ? systemTheme === 'light' : theme.includes('light')
return match useEffect(() => {
? 'rgba(255,255,255)' setTimeout(() => {
: islight const islight = theme === 'system' ? systemTheme === 'light' : theme.includes('light')
? window.getComputedStyle(document.documentElement).color setChartColor(
: 'rgb(255,255,255)' match
? 'rgba(255,255,255)'
: islight
? window.getComputedStyle(document.documentElement).color
: 'rgb(255,255,255)'
)
}, 1000)
}, [theme, systemTheme, match, customTheme]) }, [theme, systemTheme, match, customTheme])
const transform = tf ? { x: tf.x, y: tf.y, scaleX: 1, scaleY: 1 } : null const transform = tf ? { x: tf.x, y: tf.y, scaleX: 1, scaleY: 1 } : null
@ -137,7 +143,7 @@ const ConnCard: React.FC = () => {
> >
<defs> <defs>
<linearGradient id="gradient" x1="0" y1="0" x2="0" y2="1"> <linearGradient id="gradient" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stopColor={chartColor} stopOpacity={0.6} /> <stop offset="0%" stopColor={chartColor} stopOpacity={0.8} />
<stop offset="100%" stopColor={chartColor} stopOpacity={0} /> <stop offset="100%" stopColor={chartColor} stopOpacity={0} />
</linearGradient> </linearGradient>
</defs> </defs>