[DE mobile] Add icons into Settings
This commit is contained in:
JuliaSvinareva
parent
fab3f9f1b4
commit
8e6f9b56a3
|
|
@ -25,5 +25,46 @@
|
|||
height: 24px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M11.8,3l0.4,2c0.1,0.7,0.6,1.1,1.3,1.1c0.3,0,0.5-0.1,0.7-0.2l1.9-1.2l1.1,1.1l-1.1,1.8C15.8,8,15.8,8.5,16,8.9c0.2,0.4,0.5,0.7,1,0.8l2.1,0.5v1.6L17,12.2c-0.5,0.1-0.8,0.4-1,0.8c-0.2,0.4-0.1,0.9,0.1,1.2l1.2,1.9l-1.1,1.1l-1.8-1.1c-0.2-0.2-0.5-0.2-0.8-0.2c-0.6,0-1.2,0.5-1.3,1.1l-0.5,2.1h-1.6l-0.4-2C9.7,16.4,9.2,16,8.5,16c-0.3,0-0.5,0.1-0.7,0.2l-1.9,1.2l-1.1-1.1l1.1-1.8c0.3-0.4,0.3-0.9,0.1-1.3c-0.2-0.4-0.5-0.7-1-0.8l-2.1-0.5v-1.6l2-0.4c0.5-0.1,0.8-0.4,1-0.8C6.1,8.7,6,8.2,5.8,7.9l-1-2l1.1-1.1l1.8,1.1C8,6.1,8.2,6.2,8.5,6.2c0.6,0,1.2-0.5,1.3-1.1L10.3,3H11.8 M11,15.5c2.5,0,4.5-2,4.5-4.5s-2-4.5-4.5-4.5s-4.5,2-4.5,4.5S8.5,15.5,11,15.5 M12.1,2H9.9C9.6,2,9.4,2.2,9.3,2.5L8.8,4.9c0,0.2-0.2,0.3-0.3,0.3s-0.1,0-0.2-0.1L6.2,3.8C6.1,3.7,6,3.7,5.8,3.7c-0.1,0-0.3,0-0.4,0.1L3.8,5.4c-0.1,0.2-0.2,0.5,0,0.8l1.3,2.1c0.1,0.2,0.1,0.4-0.2,0.5L2.5,9.3C2.2,9.4,2,9.6,2,9.9v2.2c0,0.3,0.2,0.5,0.5,0.6l2.4,0.5c0.3,0.1,0.4,0.3,0.2,0.5l-1.3,2.1c-0.2,0.2-0.1,0.6,0.1,0.8l1.6,1.6c0.1,0.1,0.3,0.2,0.4,0.2s0.2,0,0.3-0.1L8.3,17c0.1-0.1,0.1-0.1,0.2-0.1s0.3,0.1,0.3,0.3l0.5,2.3C9.4,19.8,9.6,20,9.9,20h2.2c0.3,0,0.5-0.2,0.6-0.5l0.5-2.4c0-0.2,0.1-0.3,0.3-0.3c0.1,0,0.1,0,0.2,0.1l2.1,1.3c0.1,0.1,0.2,0.1,0.3,0.1c0.2,0,0.3-0.1,0.4-0.2l1.6-1.6c0.2-0.2,0.2-0.5,0.1-0.8l-1.3-2.1c-0.2-0.2-0.1-0.5,0.2-0.5l2.4-0.5c0.3-0.1,0.5-0.3,0.5-0.6V9.8c0-0.3-0.2-0.5-0.5-0.6l-2.4-0.5c-0.3-0.1-0.4-0.3-0.2-0.5l1.3-2.1c0.2-0.2,0.1-0.6-0.1-0.8l-1.6-1.6c-0.1-0.1-0.3-0.2-0.4-0.2c-0.1,0-0.2,0-0.3,0.1l-2.1,1.3C13.6,5,13.6,5,13.5,5c-0.1,0-0.3-0.1-0.3-0.3l-0.5-2.2C12.6,2.2,12.4,2,12.1,2L12.1,2z M11,14.5c-1.9,0-3.5-1.6-3.5-3.5S9.1,7.5,11,7.5s3.5,1.6,3.5,3.5S12.9,14.5,11,14.5L11,14.5z"/></g></svg>');
|
||||
}
|
||||
//Settings
|
||||
&.icon-search {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M15.8,15c1.4-1.6,2.2-3.7,2.2-5.9c0-5-4-9-9-9C4,0,0,4,0,9c0,5,4,9,9,9c2.3,0,4.4-0.9,5.9-2.2l5.8,5.8l0.2-0.6l0.7-0.2L15.8,15z M9,17c-4.4,0-8-3.6-8-8c0-4.4,3.6-8,8-8c4.4,0,8,3.6,8,8C17,13.5,13.5,17,9,17z"/></g></svg>');
|
||||
}
|
||||
&.icon-doc-setup {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-4 6 22 22" fill="@{themeColor}"><g><path id="XMLID_2_" d="M15,27H-1V15h6V8l0,0h10V27z M16,7H4.2L-2,13.6V28h18V7z M4,8.8V14h-4.9L4,8.8z"/></g></svg>');
|
||||
}
|
||||
&.icon-app-settings {
|
||||
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="M7 14H16C18.2091 14 20 15.7909 20 18C20 20.2091 18.2091 22 16 22H7C4.79086 22 3 20.2091 3 18C3 15.7909 4.79086 14 7 14ZM16 13C18.7614 13 21 15.2386 21 18C21 20.7614 18.7614 23 16 23H7C4.23858 23 2 20.7614 2 18C2 15.2386 4.23858 13 7 13H16Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 20C14.8954 20 14 19.1046 14 18C14 16.8954 14.8954 16 16 16C17.1046 16 18 16.8954 18 18C18 19.1046 17.1046 20 16 20ZM16 21C14.3431 21 13 19.6569 13 18C13 16.3431 14.3431 15 16 15C17.6569 15 19 16.3431 19 18C19 19.6569 17.6569 21 16 21Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 3H7C4.79086 3 3 4.79086 3 7C3 9.20914 4.79086 11 7 11H16C18.2091 11 20 9.20914 20 7C20 4.79086 18.2091 3 16 3ZM7 2C4.23858 2 2 4.23858 2 7C2 9.76142 4.23858 12 7 12H16C18.7614 12 21 9.76142 21 7C21 4.23858 18.7614 2 16 2H7Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7 9C8.10457 9 9 8.10457 9 7C9 5.89543 8.10457 5 7 5C5.89543 5 5 5.89543 5 7C5 8.10457 5.89543 9 7 9ZM7 10C8.65685 10 10 8.65685 10 7C10 5.34315 8.65685 4 7 4C5.34315 4 4 5.34315 4 7C4 8.65685 5.34315 10 7 10Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-download {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" y="0px" x="0px" fill="@{themeColor}"><path d="M12 0H11L11 14L7.39999 10.3L6.69999 11.1L11.5 16L16.3 11.1L15.6 10.3L12 14L12 0Z"/><path d="M14 5V6H19V20H4V6H9V5H3V21H20V5H14Z"/></svg>');
|
||||
}
|
||||
&.icon-print {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-0 0 22 22" y="0px" x="0px" fill="@{themeColor}"><g><path fill-rule="evenodd" clip-rule="evenodd" d="M5 1H17V6H21V17H17V21H5V17H1V6H5V1ZM6 6H16V2H6V6ZM5 16V13H2V16H5ZM2 12H20V7H2V12ZM20 13H17V16H20V13ZM16 13H6V20H16V13ZM14 16H8V15H14V16ZM14 18H8V17H14V18Z"/></g></svg>');
|
||||
}
|
||||
&.icon-info {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M10,17h2V8h-2V17z M11,1C5.5,1,1,5.5,1,11s4.5,10,10,10s10-4.5,10-10S16.5,1,11,1z M11,20c-5,0-9-4-9-9s4-9,9-9s9,4,9,9S16,20,11,20z M10,7h2V5h-2V7z"/></g></svg>');
|
||||
}
|
||||
&.icon-help {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M11.6,1.3c-3.3,0-6,2.8-6,6.2c0.3,0,0.7,0,0.9,0c0-2.9,2.3-5.2,5.1-5.2s5.1,2.3,5.1,5.2c0,1.7-1.9,3.2-3,4.3C12.9,12.6,11,14.2,11,16c0,1.2,0,2.2,0,2.7c0.3,0,0.6,0,0.9,0c0-0.6,0-1.6,0-2.5c0-1.4,1.1-2.4,2.2-3.5c1.7-1.5,3.5-3.1,3.5-5.2C17.6,4.1,14.9,1.3,11.6,1.3z M11.5,20.2c-0.3,0-0.5,0.2-0.5,0.5v0.8c0,0.3,0.2,0.5,0.5,0.5s0.5-0.2,0.5-0.5v-0.8C11.9,20.4,11.7,20.2,11.5,20.2z"/></g></svg>');
|
||||
}
|
||||
&.icon-about {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-1 7 22 22" fill="@{themeColor}"><g><path d="M21,18.5c0-0.3-0.1-0.6-0.7-0.9l-2.6-1.2l2.6-1.2c0.6-0.3,0.7-0.6,0.7-0.9c0-0.3-0.1-0.6-0.7-0.9l-8.9-4.1c-0.7-0.4-1.9-0.4-2.8,0l-8.9,4.1C-0.9,13.8-1,14.1-1,14.3s0.1,0.6,0.7,0.9l2.6,1.2l-2.6,1.2C-0.9,18-1,18.4-1,18.5c0,0.2,0.1,0.6,0.7,0.9l2.5,1.2l-2.5,1.2C-0.9,22.1-1,22.5-1,22.7c0,0.3,0.1,0.6,0.7,0.9l8.9,4.1c0.5,0.2,0.8,0.3,1.4,0.3s1-0.1,1.4-0.3l8.9-4.1c0.6-0.4,0.7-0.6,0.7-0.9c0-0.3-0.1-0.6-0.7-0.9l-2.5-1.2l2.5-1.2C20.9,19.2,21,18.8,21,18.5z M-0.2,14.3L-0.2,14.3c0,0,0.1-0.1,0.3-0.2L9,10c0.6-0.3,1.5-0.3,2,0l8.9,4.1c0.2,0.1,0.3,0.2,0.3,0.2l0,0c0,0-0.1,0.1-0.3,0.2L11,18.6c-0.6,0.3-1.5,0.3-2,0l-8.9-4.1C-0.1,14.4-0.2,14.3-0.2,14.3z M20.2,22.7L20.2,22.7c0,0-0.1,0.1-0.3,0.2L11,27.1c-0.6,0.3-1.5,0.3-2,0l-8.9-4.1c-0.2-0.1-0.3-0.2-0.3-0.2l0,0c0,0,0.1-0.1,0.3-0.2l3-1.5l5.5,2.6c0.7,0.4,1.9,0.4,2.8,0l5.5-2.6l3,1.5C20.1,22.7,20.2,22.7,20.2,22.7z M19.9,18.7L11,22.8c-0.6,0.3-1.5,0.3-2,0l-8.9-4.1c-0.2-0.1-0.3-0.2-0.3-0.2l0,0c0,0,0.1-0.1,0.3-0.2l3-1.5l5.5,2.6c0.7,0.4,1.9,0.4,2.8,0l5.5-2.6l3,1.5c0.2,0.1,0.3,0.2,0.3,0.2l0,0C20.2,18.5,20.1,18.6,19.9,18.7z"/></g></svg>');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -28,4 +28,47 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
i.icon {
|
||||
//Settings
|
||||
&.icon-search {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M19.5,16.8L16,13.3c0.7-1.1,1.1-2.4,1.1-3.8C17,5.4,13.6,2,9.5,2S2,5.4,2,9.5S5.4,17,9.5,17c1.4,0,2.7-0.4,3.8-1.1l3.5,3.5c0.7,0.7,1.9,0.7,2.6,0C20.2,18.7,20.2,17.6,19.5,16.8z M9.5,15.3c-3.2,0-5.8-2.6-5.8-5.8s2.6-5.8,5.8-5.8s5.8,2.6,5.8,5.8S12.7,15.3,9.5,15.3z"/></g></svg>');
|
||||
}
|
||||
&.icon-doc-setup {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-4 6 22 22" fill="@{themeColor}"><g><path id="XMLID_2_" d="M15,27H-1V15h6V8l0,0h10V27z M16,7H4.2L-2,13.6V28h18V7z M4,8.8V14h-4.9L4,8.8z"/></g></svg>');
|
||||
}
|
||||
&.icon-app-settings {
|
||||
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="M7 14H16C18.2091 14 20 15.7909 20 18C20 20.2091 18.2091 22 16 22H7C4.79086 22 3 20.2091 3 18C3 15.7909 4.79086 14 7 14ZM16 13C18.7614 13 21 15.2386 21 18C21 20.7614 18.7614 23 16 23H7C4.23858 23 2 20.7614 2 18C2 15.2386 4.23858 13 7 13H16Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 20C14.8954 20 14 19.1046 14 18C14 16.8954 14.8954 16 16 16C17.1046 16 18 16.8954 18 18C18 19.1046 17.1046 20 16 20ZM16 21C14.3431 21 13 19.6569 13 18C13 16.3431 14.3431 15 16 15C17.6569 15 19 16.3431 19 18C19 19.6569 17.6569 21 16 21Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 3H7C4.79086 3 3 4.79086 3 7C3 9.20914 4.79086 11 7 11H16C18.2091 11 20 9.20914 20 7C20 4.79086 18.2091 3 16 3ZM7 2C4.23858 2 2 4.23858 2 7C2 9.76142 4.23858 12 7 12H16C18.7614 12 21 9.76142 21 7C21 4.23858 18.7614 2 16 2H7Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7 9C8.10457 9 9 8.10457 9 7C9 5.89543 8.10457 5 7 5C5.89543 5 5 5.89543 5 7C5 8.10457 5.89543 9 7 9ZM7 10C8.65685 10 10 8.65685 10 7C10 5.34315 8.65685 4 7 4C5.34315 4 4 5.34315 4 7C4 8.65685 5.34315 10 7 10Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-download {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-0 0 22 22" y="0px" x="0px" fill="@{themeColor}"><g><path d="M12 0H11L11 14L7.39999 10.3L6.69999 11.1L11.5 16L16.3 11.1L15.6 10.3L12 14L12 0Z"/><path d="M14 5V6H19V20H4V6H9V5H3V21H20V5H14Z"/></g></svg>');
|
||||
}
|
||||
&.icon-print {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-0 0 22 22" y="0px" x="0px" fill="@{themeColor}"><g><path fill-rule="evenodd" clip-rule="evenodd" d="M5 1H17V6H21V17H17V21H5V17H1V6H5V1ZM6 6H16V2H6V6ZM5 16V13H2V16H5ZM2 12H20V7H2V12ZM20 13H17V16H20V13ZM16 13H6V20H16V13ZM14 16H8V15H14V16ZM14 18H8V17H14V18Z"/></g></svg>');
|
||||
}
|
||||
&.icon-info {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M10,17h2V8h-2V17z M11,1C5.5,1,1,5.5,1,11s4.5,10,10,10s10-4.5,10-10S16.5,1,11,1z M11,20c-5,0-9-4-9-9s4-9,9-9s9,4,9,9S16,20,11,20z M10,7h2V5h-2V7z"/></g></svg>');
|
||||
}
|
||||
&.icon-help {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M11.6,1.3c-3.3,0-6,2.8-6,6.2c0.3,0,0.7,0,0.9,0c0-2.9,2.3-5.2,5.1-5.2s5.1,2.3,5.1,5.2c0,1.7-1.9,3.2-3,4.3C12.9,12.6,11,14.2,11,16c0,1.2,0,2.2,0,2.7c0.3,0,0.6,0,0.9,0c0-0.6,0-1.6,0-2.5c0-1.4,1.1-2.4,2.2-3.5c1.7-1.5,3.5-3.1,3.5-5.2C17.6,4.1,14.9,1.3,11.6,1.3z M11.5,20.2c-0.3,0-0.5,0.2-0.5,0.5v0.8c0,0.3,0.2,0.5,0.5,0.5s0.5-0.2,0.5-0.5v-0.8C11.9,20.4,11.7,20.2,11.5,20.2z"/></g></svg>');
|
||||
}
|
||||
&.icon-about {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-1 7 22 22" fill="@{themeColor}"><g><path d="M21,18.5c0-0.3-0.1-0.6-0.7-0.9l-2.6-1.2l2.6-1.2c0.6-0.3,0.7-0.6,0.7-0.9c0-0.3-0.1-0.6-0.7-0.9l-8.9-4.1c-0.7-0.4-1.9-0.4-2.8,0l-8.9,4.1C-0.9,13.8-1,14.1-1,14.3s0.1,0.6,0.7,0.9l2.6,1.2l-2.6,1.2C-0.9,18-1,18.4-1,18.5c0,0.2,0.1,0.6,0.7,0.9l2.5,1.2l-2.5,1.2C-0.9,22.1-1,22.5-1,22.7c0,0.3,0.1,0.6,0.7,0.9l8.9,4.1c0.5,0.2,0.8,0.3,1.4,0.3s1-0.1,1.4-0.3l8.9-4.1c0.6-0.4,0.7-0.6,0.7-0.9c0-0.3-0.1-0.6-0.7-0.9l-2.5-1.2l2.5-1.2C20.9,19.2,21,18.8,21,18.5z M-0.2,14.3L-0.2,14.3c0,0,0.1-0.1,0.3-0.2L9,10c0.6-0.3,1.5-0.3,2,0l8.9,4.1c0.2,0.1,0.3,0.2,0.3,0.2l0,0c0,0-0.1,0.1-0.3,0.2L11,18.6c-0.6,0.3-1.5,0.3-2,0l-8.9-4.1C-0.1,14.4-0.2,14.3-0.2,14.3z M20.2,22.7L20.2,22.7c0,0-0.1,0.1-0.3,0.2L11,27.1c-0.6,0.3-1.5,0.3-2,0l-8.9-4.1c-0.2-0.1-0.3-0.2-0.3-0.2l0,0c0,0,0.1-0.1,0.3-0.2l3-1.5l5.5,2.6c0.7,0.4,1.9,0.4,2.8,0l5.5-2.6l3,1.5C20.1,22.7,20.2,22.7,20.2,22.7z M19.9,18.7L11,22.8c-0.6,0.3-1.5,0.3-2,0l-8.9-4.1c-0.2-0.1-0.3-0.2-0.3-0.2l0,0c0,0,0.1-0.1,0.3-0.2l3-1.5l5.5,2.6c0.7,0.4,1.9,0.4,2.8,0l5.5-2.6l3,1.5c0.2,0.1,0.3,0.2,0.3,0.2l0,0C20.2,18.5,20.1,18.6,19.9,18.7z"/></g></svg>');
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue