mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 11:41:20 +08:00
fix(select): modern component takes up full line (#26670)
This commit is contained in:
@ -4,6 +4,7 @@
|
||||
// iOS Select
|
||||
// --------------------------------------------------
|
||||
|
||||
// TODO FW-3194 - Remove this
|
||||
:host(.legacy-select) {
|
||||
--padding-top: #{$select-ios-padding-top};
|
||||
--padding-end: #{$select-ios-padding-end};
|
||||
@ -11,6 +12,7 @@
|
||||
--padding-start: #{$select-ios-padding-start};
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Move this to host
|
||||
:host(:not(.legacy-select)) {
|
||||
min-height: 44px;
|
||||
}
|
||||
|
@ -11,6 +11,7 @@
|
||||
--border-color: #{$item-md-border-color};
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Remove this
|
||||
:host(.legacy-select) {
|
||||
--padding-top: #{$select-md-padding-top};
|
||||
--padding-end: #{$select-md-padding-end};
|
||||
@ -18,6 +19,7 @@
|
||||
--padding-start: #{$select-md-padding-start};
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Move this to host
|
||||
:host(:not(.legacy-select)) {
|
||||
min-height: 56px;
|
||||
}
|
||||
|
@ -55,10 +55,16 @@
|
||||
z-index: $z-index-item-input;
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Move this to host
|
||||
:host(:not(.legacy-select)) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:host(.ion-color) {
|
||||
--highlight-color-focused: #{current-color(base)};
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Remove this
|
||||
:host(.legacy-select) {
|
||||
@include padding(var(--padding-top), var(--padding-end), var(--padding-bottom), var(--padding-start));
|
||||
|
||||
@ -71,17 +77,13 @@
|
||||
|
||||
// Select Used in ion-item
|
||||
// --------------------------------------------------
|
||||
// TODO FW-3194 - Remove this
|
||||
:host(.in-item.legacy-select) {
|
||||
position: static;
|
||||
|
||||
max-width: 45%;
|
||||
}
|
||||
|
||||
:host(.in-item:not(.legacy-select)) {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:host(.select-disabled) {
|
||||
opacity: .4;
|
||||
pointer-events: none;
|
||||
@ -97,6 +99,7 @@
|
||||
opacity: var(--placeholder-opacity);
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Remove this
|
||||
:host(.legacy-select) label {
|
||||
@include input-cover();
|
||||
|
||||
|
@ -751,6 +751,7 @@ export class Select implements ComponentInterface {
|
||||
);
|
||||
}
|
||||
|
||||
// TODO FW-3194 - Remove this
|
||||
private renderLegacySelect() {
|
||||
if (!this.hasLoggedDeprecationWarning) {
|
||||
printIonWarning(
|
||||
|
Reference in New Issue
Block a user