mirror of
https://github.com/sussy-code/smov.git
synced 2024-12-20 14:37:43 +01:00
Merge pull request #874 from boidushya/dev
fix(settings/appearance): Improved 'Active' pill
This commit is contained in:
commit
2b0f1206a6
6 changed files with 15 additions and 5 deletions
|
@ -104,7 +104,7 @@ function ThemePreview(props: {
|
|||
<span className="font-medium text-white">{props.name}</span>
|
||||
<span
|
||||
className={classNames(
|
||||
"inline-block px-3 text-sm transition-opacity duration-150 rounded-full bg-[#27182F] text-white",
|
||||
"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",
|
||||
)}
|
||||
>
|
||||
|
|
|
@ -97,6 +97,8 @@ export const defaultTheme = {
|
|||
background: tokens.shade.c300,
|
||||
backgroundHover: tokens.shade.c200,
|
||||
highlight: tokens.blue.c200,
|
||||
|
||||
activeBackground: tokens.shade.c300,
|
||||
},
|
||||
|
||||
// meta data for the theme itself
|
||||
|
|
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||
pill: {
|
||||
background: tokens.shade.c300,
|
||||
backgroundHover: tokens.shade.c200,
|
||||
highlight: tokens.blue.c200
|
||||
highlight: tokens.blue.c200,
|
||||
|
||||
activeBackground: tokens.shade.c300,
|
||||
},
|
||||
|
||||
global: {
|
||||
|
|
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||
pill: {
|
||||
background: tokens.shade.c300,
|
||||
backgroundHover: tokens.shade.c200,
|
||||
highlight: tokens.blue.c200
|
||||
highlight: tokens.blue.c200,
|
||||
|
||||
activeBackground: tokens.shade.c300,
|
||||
},
|
||||
|
||||
global: {
|
||||
|
|
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||
pill: {
|
||||
background: tokens.shade.c300,
|
||||
backgroundHover: tokens.shade.c200,
|
||||
highlight: tokens.blue.c200
|
||||
highlight: tokens.blue.c200,
|
||||
|
||||
activeBackground: tokens.shade.c300,
|
||||
},
|
||||
|
||||
global: {
|
||||
|
|
|
@ -63,7 +63,9 @@ export default createTheme({
|
|||
pill: {
|
||||
background: tokens.shade.c300,
|
||||
backgroundHover: tokens.shade.c200,
|
||||
highlight: tokens.blue.c200
|
||||
highlight: tokens.blue.c200,
|
||||
|
||||
activeBackground: tokens.shade.c300,
|
||||
},
|
||||
|
||||
global: {
|
||||
|
|
Loading…
Reference in a new issue