mirror of
https://github.com/movie-web/movie-web.git
synced 2024-12-25 18:41:49 +01:00
fix(settings/appearance): Removed inset-shadow & created new theme variable
This commit is contained in:
parent
aba12370f3
commit
d4ba87f95e
@ -104,7 +104,7 @@ function ThemePreview(props: {
|
|||||||
<span className="font-medium text-white">{props.name}</span>
|
<span className="font-medium text-white">{props.name}</span>
|
||||||
<span
|
<span
|
||||||
className={classNames(
|
className={classNames(
|
||||||
"inline-block px-3 py-1 leading-tight text-sm transition-opacity duration-150 rounded-full bg-pill-background text-white/85 shadow-[rgba(255,255,255,0.15)_0_1px_0_inset,rgba(46,54,80,0.075)_0_1px_1px]",
|
"inline-block px-3 py-1 leading-tight text-sm transition-opacity duration-150 rounded-full bg-pill-activeBackground text-white/85",
|
||||||
props.active ? "opacity-100" : "opacity-0 pointer-events-none",
|
props.active ? "opacity-100" : "opacity-0 pointer-events-none",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
@ -97,6 +97,8 @@ export const defaultTheme = {
|
|||||||
background: tokens.shade.c300,
|
background: tokens.shade.c300,
|
||||||
backgroundHover: tokens.shade.c200,
|
backgroundHover: tokens.shade.c200,
|
||||||
highlight: tokens.blue.c200,
|
highlight: tokens.blue.c200,
|
||||||
|
|
||||||
|
activeBackground: tokens.shade.c300,
|
||||||
},
|
},
|
||||||
|
|
||||||
// meta data for the theme itself
|
// meta data for the theme itself
|
||||||
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||||||
pill: {
|
pill: {
|
||||||
background: tokens.shade.c300,
|
background: tokens.shade.c300,
|
||||||
backgroundHover: tokens.shade.c200,
|
backgroundHover: tokens.shade.c200,
|
||||||
highlight: tokens.blue.c200
|
highlight: tokens.blue.c200,
|
||||||
|
|
||||||
|
activeBackground: tokens.shade.c300,
|
||||||
},
|
},
|
||||||
|
|
||||||
global: {
|
global: {
|
||||||
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||||||
pill: {
|
pill: {
|
||||||
background: tokens.shade.c300,
|
background: tokens.shade.c300,
|
||||||
backgroundHover: tokens.shade.c200,
|
backgroundHover: tokens.shade.c200,
|
||||||
highlight: tokens.blue.c200
|
highlight: tokens.blue.c200,
|
||||||
|
|
||||||
|
activeBackground: tokens.shade.c300,
|
||||||
},
|
},
|
||||||
|
|
||||||
global: {
|
global: {
|
||||||
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||||||
pill: {
|
pill: {
|
||||||
background: tokens.shade.c300,
|
background: tokens.shade.c300,
|
||||||
backgroundHover: tokens.shade.c200,
|
backgroundHover: tokens.shade.c200,
|
||||||
highlight: tokens.blue.c200
|
highlight: tokens.blue.c200,
|
||||||
|
|
||||||
|
activeBackground: tokens.shade.c300,
|
||||||
},
|
},
|
||||||
|
|
||||||
global: {
|
global: {
|
||||||
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||||||
pill: {
|
pill: {
|
||||||
background: tokens.shade.c300,
|
background: tokens.shade.c300,
|
||||||
backgroundHover: tokens.shade.c200,
|
backgroundHover: tokens.shade.c200,
|
||||||
highlight: tokens.blue.c200
|
highlight: tokens.blue.c200,
|
||||||
|
|
||||||
|
activeBackground: tokens.shade.c300,
|
||||||
},
|
},
|
||||||
|
|
||||||
global: {
|
global: {
|
||||||
|
Loading…
Reference in New Issue
Block a user