"Fossies" - the Fresh Open Source Software Archive  

Source code changes of the file "src/lib/badge/_badge-theme.scss" between
material2-7.3.2.tar.gz and material2-7.3.3.tar.gz

About: material2 offers Material Design components for Angular.

_badge-theme.scss  (material2-7.3.2):_badge-theme.scss  (material2-7.3.3)
skipping to change at line 133 skipping to change at line 133
} }
.mat-badge-hidden { .mat-badge-hidden {
.mat-badge-content { .mat-badge-content {
display: none; display: none;
} }
} }
.mat-badge-disabled { .mat-badge-disabled {
.mat-badge-content { .mat-badge-content {
// The disabled color usually has some kind of opacity, but because the ba
dge is overlayed
// on top of something else, it won't look good if it's opaque. We convert
it into a solid
// color by taking the opacity from the rgba value and using the value to
determine the
// percentage of the background to put into foreground when mixing the col
ors together.
$app-background: mat-color($background, 'background'); $app-background: mat-color($background, 'background');
$badge-color: mat-color($foreground, disabled-button); $badge-color: mat-color($foreground, disabled-button);
$badge-opacity: opacity($badge-color);
background: mix($app-background, rgba($badge-color, 1), (1 - $badge-opacit // The disabled color usually has some kind of opacity, but because the ba
y) * 100%); dge is overlayed
// on top of something else, it won't look good if it's opaque. If it is a
color *type*,
// we convert it into a solid color by taking the opacity from the rgba va
lue and using
// the value to determine the percentage of the background to put into for
eground when
// mixing the colors together.
@if (type-of($badge-color) == color and type-of($app-background) == color)
{
$badge-opacity: opacity($badge-color);
background: mix($app-background, rgba($badge-color, 1), (1 - $badge-opac
ity) * 100%);
}
@else {
background: $badge-color;
}
color: mat-color($foreground, disabled-text); color: mat-color($foreground, disabled-text);
} }
} }
.mat-badge-content { .mat-badge-content {
position: absolute; position: absolute;
text-align: center; text-align: center;
display: inline-block; display: inline-block;
border-radius: 50%; border-radius: 50%;
transition: transform 200ms ease-in-out; transition: transform 200ms ease-in-out;
 End of changes. 2 change blocks. 
11 lines changed or deleted 20 lines changed or added

Home  |  About  |  Features  |  All  |  Newest  |  Dox  |  Diffs  |  RSS Feeds  |  Screenshots  |  Comments  |  Imprint  |  Privacy  |  HTTP(S)