mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
47 lines
1.0 KiB
SCSS
47 lines
1.0 KiB
SCSS
@import "./input";
|
|
@import "./input.ios.vars";
|
|
|
|
:host {
|
|
--border-width: #{$hairlines-width};
|
|
--border-color: #{$item-ios-border-color};
|
|
|
|
font-size: $input-ios-font-size;
|
|
}
|
|
|
|
// TODO FW-2764 Remove this
|
|
:host(.legacy-input) {
|
|
--padding-top: #{$input-ios-padding-top};
|
|
--padding-end: #{$input-ios-padding-end};
|
|
--padding-bottom: #{$input-ios-padding-bottom};
|
|
--padding-start: #{$input-ios-padding-start};
|
|
}
|
|
|
|
:host-context(.item-label-stacked),
|
|
:host-context(.item-label-floating) {
|
|
--padding-top: 8px;
|
|
--padding-bottom: 8px;
|
|
--padding-start: 0px;
|
|
}
|
|
|
|
.input-clear-icon ion-icon {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
|
|
// Input Wrapper
|
|
// ----------------------------------------------------------------
|
|
|
|
:host(:not(.legacy-input)) {
|
|
min-height: 44px;
|
|
}
|
|
|
|
/**
|
|
* Since the label sits on top of the element,
|
|
* the component needs to be taller otherwise the
|
|
* label will appear too close to the input text.
|
|
*/
|
|
:host(.input-label-placement-floating),
|
|
:host(.input-label-placement-stacked) {
|
|
min-height: 56px;
|
|
}
|