mirror of
https://github.com/antebudimir/feishin.git
synced 2025-12-31 10:03:33 +00:00
[Feature] Support changing accent/primary color (#282)
* [Feature] Support changing accent/primary color - adds color picker to settings with five swatches (blue default, yellow green and red imported from sonixd, purple new) - changing color will change the appropriate css variable * Remove hover styles that use an alternate primary --------- Co-authored-by: Jeff <42182408+jeffvli@users.noreply.github.com> Co-authored-by: jeffvli <jeffvictorli@gmail.com>
This commit is contained in:
parent
8dcd49d574
commit
742b13d65e
5 changed files with 48 additions and 4 deletions
|
|
@ -39,8 +39,10 @@ const StyledButton = styled(MantineButton)<StyledButtonProps>`
|
|||
}
|
||||
|
||||
&:not([data-disabled])&:hover {
|
||||
color: ${(props) => `var(--btn-${props.variant}-fg-hover) !important`};
|
||||
background: ${(props) => `var(--btn-${props.variant}-bg-hover)`};
|
||||
color: ${(props) => `var(--btn-${props.variant}-fg) !important`};
|
||||
background: ${(props) => `var(--btn-${props.variant}-bg)`};
|
||||
background-image: ${(props) =>
|
||||
props.variant === 'filled' ? 'linear-gradient(rgb(0 0 0/40%) 0 0)' : undefined};
|
||||
border: ${(props) => `var(--btn-${props.variant}-border-hover)`};
|
||||
|
||||
svg {
|
||||
|
|
@ -50,7 +52,9 @@ const StyledButton = styled(MantineButton)<StyledButtonProps>`
|
|||
|
||||
&:not([data-disabled])&:focus-visible {
|
||||
color: ${(props) => `var(--btn-${props.variant}-fg-hover)`};
|
||||
background: ${(props) => `var(--btn-${props.variant}-bg-hover)`};
|
||||
background: ${(props) => `var(--btn-${props.variant}-bg)`};
|
||||
background-image: ${(props) =>
|
||||
props.variant === 'filled' ? 'linear-gradient(rgb(0 0 0/40%) 0 0)' : undefined};
|
||||
}
|
||||
|
||||
&:active {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue