Skip to content
This repository has been archived by the owner on Dec 5, 2023. It is now read-only.

Commit

Permalink
Merge pull request danskernesdigitalebibliotek#339 from reload/DDFLSB…
Browse files Browse the repository at this point in the history
…P-77-buttons-hover-state

Added hover state for buttons
  • Loading branch information
JacobArrow authored Nov 17, 2023
2 parents 652289d + 80f2526 commit 9aa8375
Showing 1 changed file with 13 additions and 1 deletion.
14 changes: 13 additions & 1 deletion src/stories/Library/Buttons/button/buttons.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ $c-btn-border-disabled: $c-global-tertiary-2;
border: 1px solid $c-btn-border-active;
cursor: pointer;
white-space: nowrap;
transition: background-color 0.4s ease-in-out, color 0.2s ease-in-out,
opacity 0.4s ease-in-out;

@extend %text-button-placeholder;

Expand All @@ -32,6 +34,7 @@ $c-btn-border-disabled: $c-global-tertiary-2;
border: 1px solid $c-btn-border-disabled;
color: $c-btn-border-disabled;
fill: $c-btn-border-disabled;
cursor: not-allowed;

.arrow__body {
stroke: $c-btn-border-disabled;
Expand Down Expand Up @@ -68,12 +71,21 @@ $c-btn-border-disabled: $c-global-tertiary-2;
padding: 0 24px;
}

.btn-filled {
.btn-filled:not([disabled]) {
background-color: $c-text-primary-black;
color: $c-text-primary-white;

&:hover {
opacity: 0.7;
}
}

.btn-outline {
background-color: transparent;
color: $c-text-primary-black;

&:not([disabled]):hover {
background-color: $c-text-primary-black;
color: $c-text-primary-white;
}
}

0 comments on commit 9aa8375

Please sign in to comment.