javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-17 02:31:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(inputs): interactive css to rule all them

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-05-09 17:13:27 +02:00
committed by Manu MA
parent 2b624fcb34
commit 1bd546758e
10 changed files with 12 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
core/src/components/datetime/datetime.tsx
View File

@ -240,7 +240,7 @@ export class Datetime {
private emitStyle() { private emitStyle() {
this.ionStyle.emit({ this.ionStyle.emit({
'input': true, 'interactive': true,
'datetime': true, 'datetime': true,
'datetime-disabled': this.disabled, 'datetime-disabled': this.disabled,
'input-has-value': this.hasValue() 'input-has-value': this.hasValue()

1
core/src/components/input/input.tsx
View File

@ -237,6 +237,7 @@ export class Input implements InputComponent {
private emitStyle() { private emitStyle() {
this.ionStyle.emit({ this.ionStyle.emit({
'interactive': true,
'input': true, 'input': true,
'input-disabled': this.disabled, 'input-disabled': this.disabled,
'input-has-value': this.hasValue(), 'input-has-value': this.hasValue(),

2
core/src/components/item-divider/item-divider.md.scss
View File

@ -35,7 +35,7 @@
} }
.item-divider-md ion-icon[slot="start"] + .item-inner, .item-divider-md ion-icon[slot="start"] + .item-inner,
.item-divider-md ion-icon[slot="start"] + .item-input { .item-divider-md ion-icon[slot="start"] + .item-interactive {
@include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null); @include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null);
} }

4
core/src/components/item/item.md.scss
View File

@ -77,7 +77,7 @@
} }
// Default input items have a border // Default input items have a border
.item-md.item-input { .item-md.item-interactive {
border-bottom-width: $item-md-border-bottom-width; border-bottom-width: $item-md-border-bottom-width;
} }
@ -127,7 +127,7 @@
} }
.item-md > ion-icon[slot="start"] + .item-inner, .item-md > ion-icon[slot="start"] + .item-inner,
.item-md > ion-icon[slot="start"] + .item-input { .item-md > ion-icon[slot="start"] + .item-interactive {
@include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null); @include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null);
} }

8
core/src/components/label/label.ios.scss
View File

@ -19,9 +19,7 @@
// iOS Default Label Inside An Input/Select Item // iOS Default Label Inside An Input/Select Item
// -------------------------------------------------- // --------------------------------------------------
.item-input .label-ios, .item-interactive .label-ios {
.item-select .label-ios,
.item-datetime .label-ios {
color: $label-ios-text-color; color: $label-ios-text-color;
} }
@ -61,9 +59,7 @@
$color-base: ion-color($colors-ios, $color-name, base, ios); $color-base: ion-color($colors-ios, $color-name, base, ios);
.label-ios-#{$color-name}, .label-ios-#{$color-name},
.item-input .label-ios-#{$color-name}, .item-interactive .label-ios-#{$color-name} {
.item-select .label-ios-#{$color-name},
.item-datetime .label-ios-#{$color-name} {
color: $color-base; color: $color-base;
} }
} }

8
core/src/components/label/label.md.scss
View File

@ -19,9 +19,7 @@
// Material Design Default Label Inside An Input/Select Item // Material Design Default Label Inside An Input/Select Item
// -------------------------------------------------- // --------------------------------------------------
.item-input .label-md, .item-interactive .label-md {
.item-select .label-md,
.item-datetime .label-md {
color: $label-md-text-color; color: $label-md-text-color;
} }
@ -63,9 +61,7 @@
$color-base: ion-color($colors-md, $color-name, base, md); $color-base: ion-color($colors-md, $color-name, base, md);
.label-md-#{$color-name}, .label-md-#{$color-name},
.item-input .label-md-#{$color-name}, .item-interactive .label-md-#{$color-name} {
.item-select .label-md-#{$color-name},
.item-datetime .label-md-#{$color-name} {
color: $color-base; color: $color-base;
} }
} }

2
core/src/components/list/list.md.scss
View File

@ -36,7 +36,7 @@
border-bottom-width: 0; border-bottom-width: 0;
} }
.list-md[inset] .item-input { .list-md[inset] .item-interactive {
@include padding-horizontal(0); @include padding-horizontal(0);
} }

2
core/src/components/select/select.tsx
View File

@ -443,7 +443,7 @@ export class Select {
private emitStyle() { private emitStyle() {
this.ionStyle.emit({ this.ionStyle.emit({
'input': true, 'interactive': true,
'select': true, 'select': true,
'select-disabled': this.disabled, 'select-disabled': this.disabled,
'input-has-value': this.hasValue() 'input-has-value': this.hasValue()

1
core/src/components/select/test/single-value/index.html
View File

@ -193,7 +193,6 @@
year.appendChild(option); year.appendChild(option);
} }
debugger;
year.componentOnReady().then(() => { year.componentOnReady().then(() => {
year.value = 1994; year.value = 1994;
}); });

1
core/src/components/textarea/textarea.tsx
View File

@ -166,6 +166,7 @@ export class Textarea implements TextareaComponent {
private emitStyle() { private emitStyle() {
this.ionStyle.emit({ this.ionStyle.emit({
'interactive': true,
'textarea': true, 'textarea': true,
'input': true, 'input': true,
'input-disabled': this.disabled, 'input-disabled': this.disabled,