skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(badge): move styles into the theme mixin (#9999)

Browse Source 
The badge styles were defined _outside_ the mixin, meaning they were being included any time the file was imported.
This commit is contained in:
Jeremy Elbourn
2018-02-20 07:34:45 -08:00
committed by GitHub
parent 6276efc7e0
commit 00a6c902c1
1 changed files with 39 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/badge/_badge-theme.scss
+39 -39
View File
@@ -115,6 +115,45 @@ $mat-badge-large-size: $mat-badge-default-size + 6;
background: mat-color($warn);
}
}
.mat-badge {
position: relative;
}
.mat-badge-hidden {
.mat-badge-content {
display: none;
}
}
.mat-badge-content {
position: absolute;
text-align: center;
display: inline-block;
border-radius: 50%;
transition: all 0.2 ease-in-out;
transform: scale(0.6);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
pointer-events: none;
}
// 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);
}
.mat-badge-small {
@include _mat-badge-size($mat-badge-small-size);
}
.mat-badge-medium {
@include _mat-badge-size($mat-badge-default-size);
}
.mat-badge-large {
@include _mat-badge-size($mat-badge-large-size);
}
}
@mixin mat-badge-typography($config) {
@@ -132,42 +171,3 @@ $mat-badge-large-size: $mat-badge-default-size + 6;
font-size: $mat-badge-font-size * 2;
}
}
.mat-badge {
position: relative;
}
.mat-badge-hidden {
.mat-badge-content {
display: none;
}
}
.mat-badge-content {
position: absolute;
text-align: center;
display: inline-block;
border-radius: 50%;
transition: all 0.2 ease-in-out;
transform: scale(0.6);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
pointer-events: none;
}
// 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);
}
.mat-badge-small {
@include _mat-badge-size($mat-badge-small-size);
}
.mat-badge-medium {
@include _mat-badge-size($mat-badge-default-size);
}
.mat-badge-large {
@include _mat-badge-size($mat-badge-large-size);
}