mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-17 18:54:11 +08:00
feat(checkbox): add shadow part for label (#28604)
Issue number: Part of #28300 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Developers are unable to adjust margin, width, etc. of the checkbox label ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Checkbox label has a shadow part. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> As part of this work, I investigated moving `pointer-events: none` up the DOM tree so developers wouldn't be able to override it with the shadow part. In my testing, I was unable to see any difference in behavior with vs without `pointer-events: none`. Therefore, I removed it entirely.
This commit is contained in:
@ -90,13 +90,6 @@
|
||||
}
|
||||
|
||||
.label-text-wrapper {
|
||||
/**
|
||||
* This ensures that double tapping this text
|
||||
* clicks the <label> and focuses the checkbox
|
||||
* when a screen reader is enabled.
|
||||
*/
|
||||
pointer-events: none;
|
||||
|
||||
text-overflow: ellipsis;
|
||||
|
||||
white-space: nowrap;
|
||||
@ -173,7 +166,6 @@ input {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
|
||||
// Justify Content
|
||||
// ---------------------------------------------
|
||||
|
||||
@ -200,7 +192,6 @@ input {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
// Label Placement - Start
|
||||
// ----------------------------------------------------------------
|
||||
|
||||
@ -221,7 +212,6 @@ input {
|
||||
@include margin(null, $form-control-label-margin, null, 0);
|
||||
}
|
||||
|
||||
|
||||
// Label Placement - End
|
||||
// ----------------------------------------------------------------
|
||||
|
||||
@ -242,7 +232,6 @@ input {
|
||||
@include margin(null, 0, null, $form-control-label-margin);
|
||||
}
|
||||
|
||||
|
||||
// Label Placement - Fixed
|
||||
// ----------------------------------------------------------------
|
||||
|
||||
@ -317,7 +306,6 @@ input {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
||||
// Disabled Checkbox
|
||||
// ---------------------------------------------
|
||||
|
||||
|
Reference in New Issue
Block a user