update icons for mute and unmute

This commit is contained in:
imohkay 2021-10-26 15:56:07 +05:30
commit eab1b1b4f2
15 changed files with 120 additions and 26 deletions

View file

@ -149,4 +149,7 @@ p {
.fs1 {
font-size: 20px;
}
.fs2 {
font-size: 24px;
}

View file

@ -9,7 +9,7 @@
<link rel="stylesheet" href="style.css"></head>
<body>
<div class="bgc1 clearfix">
<h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;4)</small></h1>
<h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;7)</small></h1>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn fgc1">Grid Size: 20</h1>
@ -70,6 +70,51 @@
</div>
</div>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn fgc1">Grid Size: 24</h1>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="f-icon-volume_down"></span>
<span class="mls"> f-icon-volume_down</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e906" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe906;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="f-icon-volume_up"></span>
<span class="mls"> f-icon-volume_up</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e905" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe905;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="f-icon-volume_off"></span>
<span class="mls"> f-icon-volume_off</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e904" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe904;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
</div>
<!--[if gt IE 8]><!-->
<div class="mhl clearfix mbl">

View file

@ -11,4 +11,7 @@
<glyph unicode="&#xe901;" glyph-name="triangle-right" d="M768 460.8l-460.8-256v512l460.8-256z" />
<glyph unicode="&#xe902;" glyph-name="triangle-left" d="M716.8 716.8v-512l-460.8 256 460.8 256z" />
<glyph unicode="&#xe903;" glyph-name="triangle-down" d="M256 665.6h512l-256-460.8-256 460.8z" />
<glyph unicode="&#xe904;" glyph-name="volume_off" d="M512 768.667v-180l-90 90zM182 810.667l714-714-54-54-88 88q-66-56-156-78v88q50 14 96 50l-182 182v-288l-214 214h-170v256h202l-202 202zM810 426.667q0 102-59 180t-153 106v88q130-28 214-133t84-241q0-94-44-178l-64 66q22 54 22 112zM704 426.667q0-18-2-26l-104 104v94q44-22 75-72t31-100z" />
<glyph unicode="&#xe905;" glyph-name="volume_up" d="M598 800.667q130-28 214-133t84-241-84-241-214-133v88q94 28 153 106t59 180-59 180-153 106v88zM704 426.667q0-120-106-172v344q44-22 75-72t31-100zM128 554.667h170l214 214v-684l-214 214h-170v256z" />
<glyph unicode="&#xe906;" glyph-name="volume_down" d="M214 554.667h170l214 214v-684l-214 214h-170v256zM790 426.667q0-118-108-172v344q44-22 76-73t32-99z" />
</font></defs></svg>

Before

Width:  |  Height:  |  Size: 823 B

After

Width:  |  Height:  |  Size: 1.5 KiB

Before After
Before After

View file

@ -1 +1 @@
{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M768 716.8h-512l256-460.8 256 460.8z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-up"],"grid":20},"attrs":[{}],"properties":{"order":1,"id":3,"prevSize":20,"code":59648,"name":"triangle-up"},"setIdx":0,"setId":16,"iconIdx":0},{"icon":{"paths":["M768 512l-460.8 256v-512l460.8 256z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-right"],"grid":20},"attrs":[{}],"properties":{"order":2,"id":2,"prevSize":20,"code":59649,"name":"triangle-right"},"setIdx":0,"setId":16,"iconIdx":1},{"icon":{"paths":["M716.8 256v512l-460.8-256 460.8-256z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-left"],"grid":20},"attrs":[{}],"properties":{"order":3,"id":1,"prevSize":20,"code":59650,"name":"triangle-left"},"setIdx":0,"setId":16,"iconIdx":2},{"icon":{"paths":["M256 307.2h512l-256 460.8-256-460.8z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-down"],"grid":20},"attrs":[{}],"properties":{"order":4,"id":0,"prevSize":20,"code":59651,"name":"triangle-down"},"setIdx":0,"setId":16,"iconIdx":3}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"f-icon-","metadata":{"fontFamily":"icomoon","majorVersion":1,"minorVersion":0},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false,"noie8":true,"ie7":false,"showSelector":true},"imagePref":{"prefix":"icon-","png":false,"useClassSelector":true,"color":16777215,"bgColor":16777215,"classSelector":".icon","name":"icomoon","height":32,"columns":16,"margin":16},"historySize":50,"showCodes":true,"gridSize":16}}
{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M768 716.8h-512l256-460.8 256 460.8z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-up"],"grid":20},"attrs":[{}],"properties":{"order":1,"id":3,"prevSize":20,"code":59648,"name":"triangle-up"},"setIdx":0,"setId":16,"iconIdx":0},{"icon":{"paths":["M768 512l-460.8 256v-512l460.8 256z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-right"],"grid":20},"attrs":[{}],"properties":{"order":2,"id":2,"prevSize":20,"code":59649,"name":"triangle-right"},"setIdx":0,"setId":16,"iconIdx":1},{"icon":{"paths":["M716.8 256v512l-460.8-256 460.8-256z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-left"],"grid":20},"attrs":[{}],"properties":{"order":3,"id":1,"prevSize":20,"code":59650,"name":"triangle-left"},"setIdx":0,"setId":16,"iconIdx":2},{"icon":{"paths":["M256 307.2h512l-256 460.8-256-460.8z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["triangle-down"],"grid":20},"attrs":[{}],"properties":{"order":4,"id":0,"prevSize":20,"code":59651,"name":"triangle-down"},"setIdx":0,"setId":16,"iconIdx":3},{"icon":{"paths":["M214 384h170l214-214v684l-214-214h-170v-256zM790 512q0 118-108 172v-344q44 22 76 73t32 99z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["volume_down"],"grid":24},"attrs":[{}],"properties":{"order":1,"id":3,"prevSize":24,"code":59654,"name":"volume_down"},"setIdx":9,"setId":7,"iconIdx":0},{"icon":{"paths":["M598 138q130 28 214 133t84 241-84 241-214 133v-88q94-28 153-106t59-180-59-180-153-106v-88zM704 512q0 120-106 172v-344q44 22 75 72t31 100zM128 384h170l214-214v684l-214-214h-170v-256z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["volume_up"],"grid":24},"attrs":[{}],"properties":{"order":1,"id":2,"prevSize":24,"code":59653,"name":"volume_up"},"setIdx":9,"setId":7,"iconIdx":1},{"icon":{"paths":["M512 170v180l-90-90zM182 128l714 714-54 54-88-88q-66 56-156 78v-88q50-14 96-50l-182-182v288l-214-214h-170v-256h202l-202-202zM810 512q0-102-59-180t-153-106v-88q130 28 214 133t84 241q0 94-44 178l-64-66q22-54 22-112zM704 512q0 18-2 26l-104-104v-94q44 22 75 72t31 100z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["volume_off"],"grid":24},"attrs":[{}],"properties":{"order":1,"id":1,"prevSize":24,"code":59652,"name":"volume_off"},"setIdx":9,"setId":7,"iconIdx":2}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"f-icon-","metadata":{"fontFamily":"icomoon","majorVersion":1,"minorVersion":0},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false,"noie8":true,"ie7":false,"showSelector":true},"imagePref":{"prefix":"icon-","png":false,"useClassSelector":true,"color":16777215,"bgColor":16777215,"classSelector":".icon","name":"icomoon","height":32,"columns":16,"margin":16},"historySize":50,"showCodes":true,"gridSize":16}}

View file

@ -1,9 +1,9 @@
@font-face {
font-family: 'icomoon';
src:
url('fonts/icomoon.ttf?ru5m2') format('truetype'),
url('fonts/icomoon.woff?ru5m2') format('woff'),
url('fonts/icomoon.svg?ru5m2#icomoon') format('svg');
url('fonts/icomoon.ttf?5ydswh') format('truetype'),
url('fonts/icomoon.woff?5ydswh') format('woff'),
url('fonts/icomoon.svg?5ydswh#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
@ -36,3 +36,12 @@
.f-icon-triangle-down:before {
content: "\e903";
}
.f-icon-volume_down:before {
content: "\e906";
}
.f-icon-volume_up:before {
content: "\e905";
}
.f-icon-volume_off:before {
content: "\e904";
}