mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Fix icon clipping on calling header buttons

Browse source
This commit is contained in:
Evan Hahn 2021-08-24 15:16:26 -05:00 committed by GitHub
parent 48cc2b5f11
commit 547ccd167c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
stylesheets/_mixins.scss
View file

@ -155,11 +155,14 @@
// Icons
@mixin color-svg($svg, $color, $stretch: true) {
@mixin color-svg($svg, $color, $stretch: true, $mask-origin: null) {
-webkit-mask: url($svg) no-repeat center;
@if $stretch {
-webkit-mask-size: 100%;
}
@if $mask-origin {
-webkit-mask-origin: $mask-origin;
}
background-color: $color;
}

39
stylesheets/_modules.scss
View file

@ -5301,13 +5301,15 @@ button.module-image__border-overlay:focus {
}
.module-calling-button {
$size: 22px;
@mixin icon($path) {
@include color-svg($path, $color-white, $mask-origin: padding-box);
height: 24px;
width: 24px;
}
&__participants {
@include color-svg('../images/icons/v2/group-solid-24.svg', $color-white);
@include icon('../images/icons/v2/group-solid-24.svg');
display: inline-block;
height: $size;
width: $size;
&--container {
@include button-reset;
@ -5332,42 +5334,23 @@ button.module-image__border-overlay:focus {
}
&__settings {
@include color-svg(
'../images/icons/v2/settings-solid-16.svg',
$color-white
);
height: $size;
width: $size;
@include icon('../images/icons/v2/settings-solid-16.svg');
}
&__grid-view {
@include color-svg(
'../images/icons/v2/grid-view-solid-24.svg',
$color-white
);
height: $size;
width: $size;
@include icon('../images/icons/v2/grid-view-solid-24.svg');
}
&__speaker-view {
@include color-svg(
'../images/icons/v2/speaker-view-solid-24.svg',
$color-white
);
height: $size;
width: $size;
@include icon('../images/icons/v2/speaker-view-solid-24.svg');
}
&__pip {
@include color-svg('../images/icons/v2/pip-minimize-24.svg', $color-white);
height: $size;
width: $size;
@include icon('../images/icons/v2/pip-minimize-24.svg');
}
&__cancel {
@include color-svg('../images/icons/v2/x-24.svg', $color-white);
height: $size;
width: $size;
@include icon('../images/icons/v2/x-24.svg');
}
}