From d8ad914f61d6bbae09e5d99764f9e9fa22e9432a Mon Sep 17 00:00:00 2001 From: Joseph Ekloff Date: Fri, 15 May 2015 12:10:27 -0700 Subject: [PATCH 1/3] update(input): update styles for underline --- src/components/input/input-theme.scss | 4 ++-- src/components/input/input.scss | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/input/input-theme.scss b/src/components/input/input-theme.scss index bcada300e92..0391025a9ca 100644 --- a/src/components/input/input-theme.scss +++ b/src/components/input/input-theme.scss @@ -74,8 +74,8 @@ md-input-container.md-THEME_NAME-theme { [disabled] & { border-bottom-color: transparent; color: '{{foreground-3}}'; - background-image: linear-gradient(to right, '{{foreground-4}}' 0%, '{{foreground-4}}' 33%, transparent 0%); - background-image: -ms-linear-gradient(left, transparent 0%, '{{foreground-4}}' 100%); + background-image: linear-gradient(to right, '{{foreground-3}}' 0%, '{{foreground-3}}' 33%, transparent 0%); + background-image: -ms-linear-gradient(left, transparent 0%, '{{foreground-3}}' 100%); } } } diff --git a/src/components/input/input.scss b/src/components/input/input.scss index 6017a35993c..cba49805f55 100644 --- a/src/components/input/input.scss +++ b/src/components/input/input.scss @@ -200,7 +200,7 @@ md-input-container { background-position: 0 bottom; // This background-size is coordinated with a linear-gradient set in input-theme.scss // to create a dotted line under the input. - background-size: 3px 1px; + background-size: 4px 1px; background-repeat: repeat-x; } } From cbaa2955ccd4a63e2ddab7d874e6d383934c0b81 Mon Sep 17 00:00:00 2001 From: Joseph Ekloff Date: Fri, 15 May 2015 12:15:31 -0700 Subject: [PATCH 2/3] update(input): added trivial space --- src/components/input/input.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/input/input.scss b/src/components/input/input.scss index cba49805f55..d29822ccb2f 100644 --- a/src/components/input/input.scss +++ b/src/components/input/input.scss @@ -182,6 +182,7 @@ md-input-container { &.md-input-focused, &.md-input-has-value { + label:not(.md-no-float) { transform: translate3d(0,$input-label-float-offset,0) scale($input-label-float-scale); } From 4e5c084ab90f198c54220c4811e44ab3f3ccdf58 Mon Sep 17 00:00:00 2001 From: Joseph Ekloff Date: Fri, 15 May 2015 14:01:43 -0700 Subject: [PATCH 3/3] update(input): shift no-float placeholders up to line up with input values; shift disabled underline lower to line up with non-disabled border --- src/components/input/input.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/input/input.scss b/src/components/input/input.scss index d29822ccb2f..7c841a1ea4e 100644 --- a/src/components/input/input.scss +++ b/src/components/input/input.scss @@ -86,7 +86,7 @@ md-input-container { -webkit-font-smoothing: antialiased; padding-left: $input-container-padding; z-index: 1; - transform: translate3d(0, $input-label-default-offset + 6, 0) scale($input-label-default-scale); + transform: translate3d(0, $input-label-default-offset + 4, 0) scale($input-label-default-scale); transition: transform $swift-ease-out-timing-function 0.25s; @include rtl(transform-origin, left top, right top); @@ -182,7 +182,6 @@ md-input-container { &.md-input-focused, &.md-input-has-value { - label:not(.md-no-float) { transform: translate3d(0,$input-label-float-offset,0) scale($input-label-float-scale); } @@ -203,6 +202,7 @@ md-input-container { // to create a dotted line under the input. background-size: 4px 1px; background-repeat: repeat-x; + margin-bottom: -1px; // Shift downward so dotted line is positioned the same as other bottom borders } } }