Skip to content

Commit

Permalink
Update Button plain primary icon color (#9622)
Browse files Browse the repository at this point in the history
### WHY are these changes introduced?

Fixes Shopify/archive-polaris-backlog-2024#725

### WHAT is this pull request doing?

Updates the icon color of `primary` `plain` icon only buttons

### How to 🎩
- Review in Storybook
- Ensure no regressions to `primary` `plain` `destructive` icon only
button icon color
  • Loading branch information
aveline authored Jul 6, 2023
1 parent bee00d4 commit 541385f
Showing 1 changed file with 26 additions and 1 deletion.
27 changes: 26 additions & 1 deletion polaris-react/src/components/Button/Button.scss
Original file line number Diff line number Diff line change
Expand Up @@ -348,8 +348,8 @@
// stylelint-disable polaris/conventions/polaris/custom-property-allowed-list -- se23 temporary styles
--pc-button-text: var(--p-color-text-inverse-subdued);
background: var(--pc-button-color-active);
// stylelint-enable polaris/conventions/polaris/custom-property-allowed-list
box-shadow: var(--p-shadow-button-inset-experimental);
// stylelint-enable polaris/conventions/polaris/custom-property-allowed-list
// stylelint-enable-next-line length-zero-no-unit
&::before {
opacity: 1;
Expand Down Expand Up @@ -648,6 +648,31 @@

&.iconOnly {
margin: calc(-1 * var(--p-space-1));

// stylelint-disable selector-max-combinators, max-nesting-depth, selector-max-class -- se23 temporary styles
path {
fill: var(--p-color-icon-subdued);
}

&:active,
&:hover {
path {
fill: var(--p-color-icon);
}
}

&.destructive {
path {
fill: var(--p-color-text-critical);
}
}

&.disabled {
path {
fill: var(--p-color-icon-disabled);
}
}
// stylelint-enable selector-max-combinators, max-nesting-depth, selector-max-class
}
}
}
Expand Down

0 comments on commit 541385f

Please sign in to comment.