diff --git a/ionic/components/text-input/modes/material.scss b/ionic/components/text-input/modes/material.scss index abb930f4d5..a123520602 100644 --- a/ionic/components/text-input/modes/material.scss +++ b/ionic/components/text-input/modes/material.scss @@ -38,6 +38,19 @@ ion-card[mode=md] { border-top-color: $text-input-highlight-color !important; } + [stacked-label] ion-label { + font-size: 1.2rem; + margin-bottom: 0; + } + + [stacked-label].has-focus ion-label { + color: $text-input-highlight-color; + } + + [stacked-label] .text-input { + margin-bottom: 8px; + margin-top: 8px; + } } .list[mode=md][inset] ion-input.item { diff --git a/ionic/components/text-input/text-input.scss b/ionic/components/text-input/text-input.scss index 1a5ba8337f..32bfcc3c67 100644 --- a/ionic/components/text-input/text-input.scss +++ b/ionic/components/text-input/text-input.scss @@ -8,8 +8,8 @@ $input-focus-box-shadow: inset 0px 0px 8px 0px $input-focus-border-color $text-input-background-color: $list-background-color !default; -ion-input { - display: block; +ion-input.item { + align-items: flex-start; } .key-input ion-input { @@ -24,15 +24,8 @@ ion-input { } } -.item.input { - align-items: flex-start; -} - -.item.input .text-input { - flex: 1; -} - ion-input .text-input { + flex: 1; background-color: $text-input-background-color; pointer-events: none; } @@ -41,6 +34,6 @@ ion-input.has-focus .text-input { pointer-events: auto; } -.item.input textarea { +ion-input textarea { padding-top: 9px; }