Fix filled button styles
This commit is contained in:
parent
219a9ed613
commit
ececc394e2
3 changed files with 13 additions and 13 deletions
|
@ -6,21 +6,21 @@ const MotionButton = styled(UnstyledButton)`
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
background-color: var(--btn-primary-bg);
|
background-color: var(--btn-filled-bg);
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: var(--btn-primary-fg);
|
fill: var(--btn-filled-fg);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: var(--btn-primary-bg-hover);
|
background-color: var(--btn-filled-bg-hover);
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: var(--btn-primary-fg-hover);
|
fill: var(--btn-filled-fg-hover);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -43,12 +43,12 @@
|
||||||
--scrollbar-thumb-bg: rgba(160, 160, 160, 0.3);
|
--scrollbar-thumb-bg: rgba(160, 160, 160, 0.3);
|
||||||
--scrollbar-thumb-bg-hover: rgba(160, 160, 160, 0.6);
|
--scrollbar-thumb-bg-hover: rgba(160, 160, 160, 0.6);
|
||||||
|
|
||||||
--btn-primary-bg: var(--primary-color);
|
--btn-filled-bg: var(--primary-color);
|
||||||
--btn-primary-bg-hover: rgb(34, 96, 255);
|
--btn-filled-bg-hover: rgb(34, 96, 255);
|
||||||
--btn-primary-fg: #ffffff;
|
--btn-filled-fg: #ffffff;
|
||||||
--btn-primary-fg-hover: #ffffff;
|
--btn-filled-fg-hover: #ffffff;
|
||||||
--btn-primary-border: none;
|
--btn-filled-border: none;
|
||||||
--btn-primary-radius: 4px;
|
--btn-filled-radius: 4px;
|
||||||
|
|
||||||
--btn-default-bg: rgb(31, 31, 32);
|
--btn-default-bg: rgb(31, 31, 32);
|
||||||
--btn-default-bg-hover: rgb(63, 63, 63);
|
--btn-default-bg-hover: rgb(63, 63, 63);
|
||||||
|
|
|
@ -38,9 +38,9 @@ body[data-theme='defaultLight'] {
|
||||||
--scrollbar-thumb-bg: rgba(140, 140, 140, 0.3);
|
--scrollbar-thumb-bg: rgba(140, 140, 140, 0.3);
|
||||||
--scrollbar-thumb-bg: rgba(140, 140, 140, 0.6);
|
--scrollbar-thumb-bg: rgba(140, 140, 140, 0.6);
|
||||||
|
|
||||||
--btn-primary-bg: var(--primary-color);
|
--btn-filled-bg: var(--primary-color);
|
||||||
--btn-primary-fg: #ffffff;
|
--btn-filled-fg: #ffffff;
|
||||||
--btn-primary-fg-hover: #ffffff;
|
--btn-filled-fg-hover: #ffffff;
|
||||||
|
|
||||||
--btn-default-bg: rgb(220, 220, 220);
|
--btn-default-bg: rgb(220, 220, 220);
|
||||||
--btn-default-bg-hover: rgb(210, 210, 210);
|
--btn-default-bg-hover: rgb(210, 210, 210);
|
||||||
|
|
Reference in a new issue