Skip to content

Commit

Permalink
fix(action): Update transparent action styles (#8194)
Browse files Browse the repository at this point in the history
**Related Issue:** #3834 

## Summary
cc @asangma @SkyeSeitz @ashetland
  • Loading branch information
macandcheese authored and benelan committed Nov 24, 2023
1 parent b456fc9 commit 6aadef8
Showing 1 changed file with 8 additions and 14 deletions.
22 changes: 8 additions & 14 deletions packages/calcite-components/src/components/action/action.scss
Original file line number Diff line number Diff line change
Expand Up @@ -160,32 +160,26 @@
}

:host([appearance="transparent"]) .button {
@apply bg-transparent
transition-shadow
duration-150
ease-in-out;
@apply bg-transparent;
}

:host([appearance="transparent"][active]) .button,
:host([appearance="transparent"]) .button:hover,
:host([appearance="transparent"]) .button:focus {
@apply bg-transparent;
box-shadow: 0 0 0 2px theme("borderColor.color.1") inset;
background-color: var(--calcite-button-transparent-hover);
}

:host([active][appearance="transparent"]) .button,
:host([active][appearance="transparent"]) .button:hover,
:host([active][appearance="transparent"]) .button:focus {
@apply text-color-1 fill-color-1 bg-foreground-3;
:host([appearance="transparent"]) .button:active {
background-color: var(--calcite-button-transparent-press);
}

:host([appearance="transparent"][loading]) .button,
:host([appearance="transparent"][disabled]) .button {
@apply bg-transparent;
}

:host([loading]) .button,
:host([loading]) .button:hover,
:host([loading]) .button:focus {
:host([loading][appearance="solid"]) .button,
:host([loading][appearance="solid"]) .button:hover,
:host([loading][appearance="solid"]) .button:focus {
@apply bg-foreground-1;
.text-container {
@apply opacity-disabled;
Expand Down

0 comments on commit 6aadef8

Please sign in to comment.