fix(alert): apply styling to disabled items #18545
Conversation
core/src/components/alert/alert.scss
Outdated
|
|
||
| [disabled] .alert-button-inner { | ||
| cursor: default; | ||
| opacity: .3; |
There was a problem hiding this comment.
Please use opacity: .5; as it is the style commonly used for other disabled buttons.
| @@ -133,6 +133,16 @@ | |||
| </ion-select> | |||
| </ion-item> | |||
|
|
|||
| <ion-item> | |||
There was a problem hiding this comment.
The Statuses alert select looks like it already has a disabled button in its test, so not sure if this test gives us any additional coverage.
|
Hey @liamdebeasi - good point. I think I added it to test both the attribute and the property. Shall I remove it? |
|
Yeah probably best to remove it. At this point, I think that would just be testing Stencil's functionality. |
|
Awesome - I shall do. Thanks! :) I'll ping you once I've done it. |
This reverts commit b7ac867
|
Hey @liamdebeasi - I've reverted the commit. Hopefully ready to merge now 🙂. |
|
Thanks! We actually use classes to indicate disabled states to make it easier for users to customize, so I've updated your PR with that. Other than that, I think we're good to go! |
|
Hey @liamdebeasi - I saw this was merged a few days ago, was it included in 4.7.0? No problem if not, I'm just checking :). If it wasn't, any idea which version it will appear in? |
|
@kelvindart-certua This has not been merged in yet. 4.7.0 had a fix for disabled items in |
|
No worries - just seen |
|
Merged. Thank you! |
* fix(datetime): ensure hasValue returns correct value * fix(alert): apply styling to disabled items * test(datetime): add tests for empty value datetime * fix(): update getter for stencil update * fix: change default opacity to disabled button opacity * test(select): add tests to ion-select-option disabled items * Revert "test(select): add tests to ion-select-option disabled items" This reverts commit b7ac867 * update disabled css to use classes
Pull request checklist
Please check if your PR fulfills the following requirements:
npm run build) was run locally and any changes were pushednpm run lint) has passed locally and any fixes were made for failuresPull request type
Please check the type of change your PR introduces:
What is the current behavior?
ion-select-option[disbled]have no reflective styling, so visibly do not look any different to non-disabled options.Issue Number: #18542
What is the new behavior?
[disabled] .alert-inner-buttonDoes this introduce a breaking change?
Other information
Without styling:
With styling:
