[stylesheets mobile] refactoring for icons

This commit is contained in:
Maxim Kadushkin 2021-02-09 23:59:49 +03:00
parent 9444e39ff0
commit 1c3e77c22b
6 changed files with 31 additions and 11 deletions

View file

@ -5,6 +5,11 @@
-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,@{url}");
}
.encoded-svg-uncolored-mask(@svg) {
@url: `encodeURIComponent(@{svg})`;
-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,@{url}");
}
.encoded-svg-background(@svg) {
@url: `encodeURIComponent(@{svg})`;
background-image: url("data:image/svg+xml;charset=utf-8,@{url}");

View file

@ -1,5 +1,3 @@
@import "./ios/_contextmenu";
@import "icons-ios";
.device-ios {
@blockTitleColor: #6d6d72;

View file

@ -1,9 +0,0 @@
.device-ios {
i.icon {
&.icon-paste {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" fill="white"/><path d="M5 0H14V5H5V0Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" fill="white"/></svg>');
}
}
}

View file

@ -0,0 +1,10 @@
@import "./ios/icons";
@import "./material/icons";
i.icon {
&.icon-paste {
width: 24px;
height: 24px;
.encoded-svg-uncolored-mask('<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" /><path d="M5 0H14V5H5V0Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" /></svg>');
}
}

View file

@ -0,0 +1,8 @@
.device-ios {
i.icon {
&.icon_mask {
background-color: white;
}
}
}

View file

@ -0,0 +1,8 @@
.device-android {
i.icon {
&.icon_mask {
background-color: black;
}
}
}