n8design/htwoo

Disabled flyout buttons

Closed this issue · 2 comments

gabbsmo commented

Is your feature request related to a problem? Please describe.
htwoo-core supports has styling for the disabled state for most buttons, but not flyout items.

Describe the solution you'd like
Grayed out colors and default cursor

Describe alternatives you've considered
None

Additional context
To implement this first, we need to get rid of the cursor set on flyout menus. The buttons already have a cursor. Not sure when this is needed. With this set, disabled flyout items will have its cursor: default overriden with pointer.

.hoo-buttonflyout {
    cursor: unset;
}

How I do it currently in my project specific style. Can probably be more elegant when editing the htwoo-core source.

.hoo-buttonaction:disabled {
    color: var(--neutralTertiary);
}

.hoo-buttonflyout .hoo-buttonaction[disabled]:hover {
    background-color: inherit;
}
gabbsmo commented

@StfBauer I updated to 2.5.1. From the commits it looks like .hoo-buttonflyout should have cursor: unset;, but I don't see this in htwoo.min.css. Is there an example in Pattern Lab that I can double check?