mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
fix(badge): invalid style declaration and too broad transition (#10433)
* Fixes the badge transition not working due to the `transition` declaration being invalid (no units on the duration). * Fixes the badge animating all properties rather than only the `transform`. * Avoids blurry text in IE.
This commit is contained in:
committed by
Andrew Seguin
parent
5e5aae3b2e
commit
c14cf7caae
@@ -131,7 +131,7 @@ $mat-badge-large-size: $mat-badge-default-size + 6;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
transition: all 0.2 ease-in-out;
|
||||
transition: transform 200ms ease-in-out;
|
||||
transform: scale(0.6);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
@@ -142,7 +142,8 @@ $mat-badge-large-size: $mat-badge-default-size + 6;
|
||||
// The active class is added after the element is added
|
||||
// so it can animate scale to default
|
||||
.mat-badge-content.mat-badge-active {
|
||||
transform: scale(1);
|
||||
// Scale to `none` instead of `1` to avoid blurry text in some browsers.
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.mat-badge-small {
|
||||
|
||||
Reference in New Issue
Block a user