mirror of
https://github.com/clash-verge-rev/clash-verge-rev.git
synced 2026-04-13 13:30:31 +08:00
45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
import { alpha, Box, styled } from '@mui/material'
|
|
|
|
export const TestBox = styled(Box)(({ theme, 'aria-selected': selected }) => {
|
|
const { mode, primary, text } = theme.palette
|
|
const key = `${mode}-${!!selected}`
|
|
|
|
const backgroundColor =
|
|
mode === 'light' ? alpha(primary.main, 0.05) : alpha(primary.main, 0.08)
|
|
|
|
const color = {
|
|
'light-true': text.secondary,
|
|
'light-false': text.secondary,
|
|
'dark-true': alpha(text.secondary, 0.65),
|
|
'dark-false': alpha(text.secondary, 0.65),
|
|
}[key]!
|
|
|
|
const h2color = {
|
|
'light-true': primary.main,
|
|
'light-false': text.primary,
|
|
'dark-true': primary.main,
|
|
'dark-false': text.primary,
|
|
}[key]!
|
|
|
|
return {
|
|
position: 'relative',
|
|
width: '100%',
|
|
display: 'block',
|
|
cursor: 'pointer',
|
|
textAlign: 'left',
|
|
borderRadius: 8,
|
|
boxShadow: theme.shadows[1],
|
|
padding: '8px 16px',
|
|
boxSizing: 'border-box',
|
|
backgroundColor,
|
|
color,
|
|
'& h2': { color: h2color },
|
|
transition: 'background-color 0.3s, box-shadow 0.3s',
|
|
'&:hover': {
|
|
backgroundColor:
|
|
mode === 'light' ? alpha(primary.main, 0.1) : alpha(primary.main, 0.15),
|
|
boxShadow: theme.shadows[2],
|
|
},
|
|
}
|
|
})
|