ui-components icon indicating copy to clipboard operation
ui-components copied to clipboard
verified publisher icon GovAlta

Icon button variants

Open ArakTaiRoth opened this issue 2 years ago • 1 comments

Link to Figma design

Acceptance criteria

  • [ ] Remove (undocument) variant "nocolor" - indicate it is deprecated (don't actually remove from code, just documentation)
  • [ ] Icon button icon should not show focus (yellow) colour on active - the icon border should still be yellow on focus
  • [ ] Border radius on icon button and focus ring should be --goa-borderRadius-m

"light" variant

the following need to be added

default

  • [ ] icon - greyscale/white

hover

  • [ ] icon - greyscale/white
  • [ ] background - greyscale/Grey 700

focus

  • [ ] icon - greyscale/white
  • [ ] background - greyscale/Grey 700
  • [ ] "standard" yellow focus ring

disabled

  • [ ] icon - greyscale/Grey 500

"dark" variant

the following need to be updated

default

  • [ ] icon - greyscale/black

hover

  • [ ] icon - greyscale/black
  • [ ] background - greyscale/Grey 100

focus

  • [ ] icon - greyscale/black
  • [ ] background - greyscale/Grey 100
  • [ ] "standard" yellow focus ring

disabled

  • [ ] icon - greyscale/Grey 500

"destructive" variant

the following need to be updated

default

  • [ ] icon - interactive/Error-hover

hover

  • [ ] icon - status/emergency-dark
  • [ ] background - status/emergency-light

focus

  • [ ] icon - status/emergency-dark
  • [ ] background - status/emergency-light
  • [ ] "standard" yellow focus ring

disabled

  • [ ] icon - interactive/Error - 50% opacity

Icon Example

Image

ArakTaiRoth avatar Jun 12 '23 21:06 ArakTaiRoth

I added the "bug" label here as the icon itself changing to the yellow focus colour should not happen. The correct states and colours are part of the above story.

Current: image

Expected: image

twjeffery avatar Jan 18 '24 16:01 twjeffery

:tada: This issue has been resolved in version 1.17.0-alpha.51 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

tzuge avatar May 21 '24 16:05 tzuge

:tada: This issue has been resolved in version 4.17.0-alpha.25 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

tzuge avatar May 21 '24 16:05 tzuge

:tada: This issue has been resolved in version 1.21.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

tzuge avatar Jun 11 '24 21:06 tzuge

:tada: This issue has been resolved in version 4.21.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

tzuge avatar Jun 11 '24 21:06 tzuge

:tada: This issue has been resolved in version 3.0.0-alpha.4 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

tzuge avatar Jun 27 '24 16:06 tzuge

:tada: This issue has been resolved in version 3.0.3 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

tzuge avatar Jun 27 '24 17:06 tzuge