2024-05-07 23:43:41 -05:00
|
|
|
@mixin button($color-bg, $color-text) {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: row;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
2024-05-08 22:49:33 -05:00
|
|
|
gap: 0.25rem;
|
2024-05-07 23:43:41 -05:00
|
|
|
color: $color-text;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
opacity: 0.8;
|
|
|
|
|
background-color: $color-bg;
|
|
|
|
|
padding: 0.5rem 1rem;
|
|
|
|
|
clip-path: var(--clip-path-button);
|
|
|
|
|
transition: all var(--animation-speed) var(--animation-type);
|
|
|
|
|
user-select: none;
|
|
|
|
|
|
2024-05-08 22:49:33 -05:00
|
|
|
&:hover,
|
|
|
|
|
&:focus-visible {
|
2024-05-07 23:43:41 -05:00
|
|
|
opacity: 1;
|
|
|
|
|
text-decoration-color: unset;
|
|
|
|
|
}
|
|
|
|
|
}
|
