Button - new type 'danger'

[hohnzy]

Is your feature request related to a problem or use case? Please describe. We'd like to have a 'danger' type button. We want to use it before deleting crucial customers data for example from S3 buckets etc.

Describe the solution you'd like Probably red backgrounded button (ruby-60/ruby-80 on hover?).

Describe alternatives you've considered We can use css restyling, something like this works just fine

ids-button.danger-button::part(button) {
  background-color: var(--ids-color-palette-ruby-60);
  border-color: var(--ids-color-palette-ruby-60);

  &:hover {
    background-color: var(--ids-color-palette-ruby-80);
  }

  &:focus {
    box-shadow: 0 0 0 2px var(--ids-color-palette-white), 0 0 0 3px var(--ids-color-palette-ruby-60), 0 0 4px 3px var(--ids-color-palette-ruby-60);
  }
}

Additional context Data Fabric application

[tmcconechy]

Main Color: DA1217 Disabled Color: ? Hover Color: ?

https://main-enterprise.demo.design.infor.com/components/colors/example-index.html

[tmcconechy]

Design: https://www.figma.com/file/VcRDGPFqlp3MJ46mEWkGPf/Buttons?node-id=701%3A1222&t=2eRdbDDXoBLYCBwt-1

(goes along with some other changes)

[hohnzy]

Looks good :) Do we want to have the blue focus?

[tmcconechy]

@hohnzy you mean the focus state might be red instead of blue?

[hohnzy]

That's just my opinion, but the red/blue contrast is a bit weird to my eyes.

[tmcconechy]

yeah i agree - just making sure we are thinking the same thing. I'll talk to design.

[tmcconechy]

Almost a duplicate of #1046