mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
fix color inheritance, core components should not contain colors
This commit is contained in:
@@ -5,12 +5,14 @@
|
||||
// iOS Text Input
|
||||
// --------------------------------------------------
|
||||
|
||||
$text-input-ios-background-color: $list-ios-background-color !default;
|
||||
$text-input-ios-label-color: #7f7f7f !default;
|
||||
|
||||
|
||||
[text-input] {
|
||||
margin: $item-ios-padding-top ($item-ios-padding-right / 2) $item-ios-padding-bottom 0;
|
||||
padding: 0;
|
||||
background-color: $text-input-ios-background-color;
|
||||
}
|
||||
|
||||
ion-input[inset] [text-input] {
|
||||
@@ -50,3 +52,10 @@ ion-label + [text-input] {
|
||||
[floating-label].has-value ion-label {
|
||||
transform: translate3d(0, 0, 0) scale(0.8);
|
||||
}
|
||||
|
||||
|
||||
@each $color-name, $color-value in $colors-ios {
|
||||
ion-label[#{$color-name}] {
|
||||
color: $color-value !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,15 +5,17 @@
|
||||
// Material Design Text Input
|
||||
// --------------------------------------------------
|
||||
|
||||
$text-input-md-background-color: $list-md-background-color !default;
|
||||
$text-input-md-label-color: #999 !default;
|
||||
$text-input-md-highlight-color: color(primary) !default;
|
||||
$text-input-md-hightlight-color-valid: color(secondary) !default;
|
||||
$text-input-md-hightlight-color-invalid: color(danger) !default;
|
||||
$text-input-md-highlight-color: map-get($colors-md, primary) !default;
|
||||
$text-input-md-hightlight-color-valid: map-get($colors-md, secondary) !default;
|
||||
$text-input-md-hightlight-color-invalid: map-get($colors-md, danger) !default;
|
||||
|
||||
|
||||
[text-input] {
|
||||
margin: $item-md-padding-top ($item-md-padding-right / 2) $item-md-padding-bottom ($item-md-padding-left / 2);
|
||||
padding: 0;
|
||||
background-color: $text-input-md-background-color;
|
||||
}
|
||||
|
||||
ion-input[inset] [text-input] {
|
||||
@@ -80,3 +82,9 @@ ion-input.ng-invalid.ng-touched:after {
|
||||
[floating-label].has-value ion-label {
|
||||
transform: translate3d(0, 0, 0) scale(0.8);
|
||||
}
|
||||
|
||||
@each $color-name, $color-value in $colors-md {
|
||||
ion-label[#{$color-name}] {
|
||||
color: $color-value !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,8 +3,6 @@
|
||||
// Text Input
|
||||
// --------------------------------------------------
|
||||
|
||||
$text-input-background-color: $list-background-color !default;
|
||||
|
||||
|
||||
ion-input {
|
||||
|
||||
@@ -33,7 +31,6 @@ ion-input {
|
||||
|
||||
ion-input [text-input] {
|
||||
flex: 1;
|
||||
background-color: $text-input-background-color;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@@ -71,11 +68,3 @@ input,
|
||||
textarea {
|
||||
@include placeholder();
|
||||
}
|
||||
|
||||
@each $color-name, $color-value in $colors {
|
||||
ion-label {
|
||||
&[#{$color-name}] {
|
||||
color: $color-value !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user