Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Button - add favorite variant #11809

Copy link
Copy link
@mcoker

Description

@mcoker
Issue body actions

Main core PR - patternfly/patternfly#7379
Animate between filled/unfilled icon PR - patternfly/patternfly#7492

TL;DR:

  • Adds .pf-m-favorite as the class that always needs to be on a favorite button
  • Adds .pf-m-favorited that toggles a .pf-m-favorite button between favorited/not-favorited
  • Inside of the button__icon container, adds 2 new elements that both need to be rendered at the same time. CSS hides/shows the correct icon.
    • button__icon-favorite - this will hold <OutlinedStarIcon>, for the non-favorited state
    • button__icon-favorited - this will hold <StarIcon>, for the favorited state

Toggling .pf-m-favorited sets the appropriate colors and swaps the visibility of the star and outlined star icons

@andrew-ronaldson @srambach are there any limitations to which kind of button this should apply to? Technically it could apply to any button, though there may be color contrast issues if the button doesn't have a transparent background - so all buttons except primary, warning, and danger. Or is this only intended to be used with plain buttons?

Metadata

Metadata

Projects

Status

Done
Show more project fields

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions

    Morty Proxy This is a proxified and sanitized view of the page, visit original site.