Skip to content

Commit

Permalink
fix(input): Fix floating label width (#689)
Browse files Browse the repository at this point in the history
Fix floating label to resize the width to use all available space

Fixes #688.
  • Loading branch information
jean-merelis authored and hansl committed Jun 21, 2016
1 parent f21b2f4 commit cf2703c
Showing 1 changed file with 6 additions and 2 deletions.
8 changes: 6 additions & 2 deletions src/components/input/input.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
@import 'mixins';
@import 'variables';

$md-input-floating-placeholder-scale-factor: 0.75 !default;

// Placeholder colors. Required is used for the `*` star shown in the placeholder.
$md-input-placeholder-color: md-color($md-foreground, hint-text);
Expand Down Expand Up @@ -33,7 +34,8 @@ $md-input-underline-disabled-background-image: linear-gradient(to right,
@mixin md-input-placeholder-floating {
display: block;
padding-bottom: 5px;
transform: translateY(-100%) scale(0.75);
transform: translateY(-100%) scale($md-input-floating-placeholder-scale-factor);
width: 100% / $md-input-floating-placeholder-scale-factor;

.md-placeholder-required {
color: $md-input-required-placeholder-color;
Expand All @@ -44,6 +46,7 @@ $md-input-underline-disabled-background-image: linear-gradient(to right,
display: inline-block;
position: relative;
font-family: $md-font-family;
overflow: hidden;

// To avoid problems with text-align.
text-align: left;
Expand Down Expand Up @@ -119,7 +122,8 @@ $md-input-underline-disabled-background-image: linear-gradient(to right,
transform-origin: bottom left;
transition: transform $swift-ease-out-duration $swift-ease-out-timing-function,
scale $swift-ease-out-duration $swift-ease-out-timing-function,
color $swift-ease-out-duration $swift-ease-out-timing-function;
color $swift-ease-out-duration $swift-ease-out-timing-function,
width $swift-ease-out-duration $swift-ease-out-timing-function;

&.md-empty {
display: block;
Expand Down

0 comments on commit cf2703c

Please sign in to comment.