Skip to content

Commit

Permalink
fix(input): thicken underline in error state, add underline animation (
Browse files Browse the repository at this point in the history
  • Loading branch information
mmalerba authored and jelbourn committed May 15, 2017
1 parent 8159fcc commit 0666207
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 10 deletions.
4 changes: 0 additions & 4 deletions src/lib/input/_input-theme.scss
Original file line number Diff line number Diff line change
Expand Up @@ -74,10 +74,6 @@
color: $input-underline-color-warn;
}

.mat-input-underline {
border-color: $input-underline-color-warn;
}

.mat-input-ripple {
background-color: $input-underline-color-warn;
}
Expand Down
17 changes: 11 additions & 6 deletions src/lib/input/input-container.scss
Original file line number Diff line number Diff line change
Expand Up @@ -217,12 +217,17 @@ $mat-input-underline-disabled-background-image:
z-index: 1;
top: -1px;
width: 100%;
transform-origin: top;
opacity: 0;
transition: opacity $swift-ease-out-duration $swift-ease-out-timing-function;

.mat-focused & {
opacity: 1;
transform-origin: 50%;
transform: scaleX(0.5);
visibility: hidden;
transition: background-color $swift-ease-in-duration $swift-ease-in-timing-function;

.mat-focused &,
.mat-input-invalid & {
visibility: visible;
transform: scaleX(1);
transition: transform 150ms linear,
background-color $swift-ease-in-duration $swift-ease-in-timing-function;
}
}
}
Expand Down

0 comments on commit 0666207

Please sign in to comment.