4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix button primary border-color

Browse Source
This commit is contained in:
Max S 2024-07-18 19:37:16 +02:00
parent 9aa4dc8b27
commit ccad35be6c
1 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/front/Components/DesignSystem/Button/classes.module.scss
View File

@ -14,6 +14,7 @@
user-select: none; user-select: none;
cursor: pointer; cursor: pointer;
font-family: var(--font-text-family); font-family: var(--font-text-family);
border: 1px solid var(--button-contained-primary-default-border, rgba(0, 0, 0, 0));
svg { svg {
width: 18px; width: 18px;
@ -26,15 +27,15 @@
&[variant="primary"] { &[variant="primary"] {
color: var(--color-primary-500); color: var(--color-primary-500);
border: 1px solid var(--button-contained-primary-default-border, rgba(0, 0, 0, 0));
background: var(--button-contained-primary-default-background, #005bcb); background: var(--button-contained-primary-default-background, #005bcb);
border-color: var(--button-contained-primary-default-border);
svg { svg {
stroke: var(--button-contained-primary-default-contrast); stroke: var(--button-contained-primary-default-contrast);
} }
&:hover { &:hover {
border: 1px solid var(--button-contained-primary-hovered-border, rgba(0, 0, 0, 0)); border-color: var(--button-contained-primary-hovered-border);
background: var(--button-contained-primary-hovered-background, #0040a4); background: var(--button-contained-primary-hovered-background, #0040a4);
svg { svg {
@ -44,7 +45,7 @@
&:focus, &:focus,
&:active { &:active {
border: 1px solid var(--button-contained-primary-pressed-border, rgba(0, 0, 0, 0)); border-color: var(--button-contained-primary-pressed-border);
background: var(--button-contained-primary-pressed-background, #013391); background: var(--button-contained-primary-pressed-background, #013391);
svg { svg {
@ -53,12 +54,16 @@
} }
&[styleType="outlined"] { &[styleType="outlined"] {
border-color: var(--button-outlined-primary-default-border);
svg { svg {
stroke: var(--button-outlined-primary-default-contrast); stroke: var(--button-outlined-primary-default-contrast);
} }
&:hover { &:hover {
background-color: var(--color-primary-50); background-color: var(--color-primary-50);
border-color: var(--button-outlined-primary-hovered-border);
svg { svg {
stroke: var(--button-outlined-primary-hovered-contrast); stroke: var(--button-outlined-primary-hovered-contrast);
} }
@ -68,7 +73,7 @@
&:active { &:active {
background-color: var(--color-primary-100); background-color: var(--color-primary-100);
color: var(--color-primary-700); color: var(--color-primary-700);
border-color: var(--color-primary-700); border-color: var(--button-outlined-primary-pressed-border);
svg { svg {
stroke: var(--button-outlined-primary-pressed-contrast); stroke: var(--button-outlined-primary-pressed-contrast);
@ -83,6 +88,7 @@
&:hover { &:hover {
background-color: transparent; background-color: transparent;
border-color: var(--button-outlined-primary-hovered-border);
svg { svg {
stroke: var(--button-text-primary-hovered-contrast); stroke: var(--button-text-primary-hovered-contrast);