Resorted icons #60

This commit is contained in:
ManeraKai 2022-02-28 07:17:35 +03:00
parent d88fa5addd
commit fe7b433718
14 changed files with 191 additions and 221 deletions

View File

@ -47,6 +47,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -70,19 +83,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html" class="selected">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -49,6 +49,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -72,19 +85,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -49,6 +49,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -72,19 +85,7 @@
</svg>
<a href="../maps/maps.html" class="selected">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">
@ -92,12 +93,6 @@
<h4>Enable</h4>
<input id="disable-osm" type="checkbox" checked />
</div>
<!-- <div class="some-block option-block">
<h4>Instance</h4>
<div class="autocomplete">
<input id="osm-instance" type="url" placeholder="https://openstreetmap.org" />
</div>
</div> -->
</section>
<script type="module" src="../init.js"></script>
<script type="module" src="./maps.js"></script>

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html" class="selected">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html" class="selected">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">
<div class="some-block option-block">

View File

@ -49,6 +49,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -72,19 +85,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -48,6 +48,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html" class="selected">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -71,19 +84,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html" class="selected">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">
<div class="some-block option-block">

View File

@ -49,6 +49,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -72,19 +85,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -49,6 +49,19 @@
<img src="../../../assets/images/imgur-icon.png" />
<a href="../imgur/imgur.html">Imgur</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M0 0h24v24H0V0z" fill="none" />
@ -72,19 +85,6 @@
</svg>
<a href="../maps/maps.html">Maps</a>
</div>
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<a href="../wikipedia/wikipedia.html">Wikipedia</a>
</div>
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<a href="../medium/medium.html">Medium</a>
</div>
</section>
<section class="option-block">

View File

@ -68,6 +68,27 @@
<input id="disable-reddit" type="checkbox" checked />
</div>
<div class="some-block">
<div class="title">
<img src="../../../assets/images/wikipedia-icon.svg" />
<h4>Wikipedia</h4>
</div>
<input id="disable-wikipedia" type="checkbox" checked />
</div>
<div class="some-block">
<div class="title">
<!-- https://markentier.tech/posts/2020/10/medium-icon-svg/ -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1770 1000" fill="currentColor">
<circle cx="500" cy="500" r="500" />
<ellipse ry="475" rx="250" cy="501" cx="1296" />
<ellipse cx="1682" cy="502" rx="88" ry="424" />
</svg>
<h4>Medium</h4>
</div>
<input id="disable-medium" type="checkbox" checked />
</div>
<div class="some-block">
<div class="title">
@ -106,52 +127,6 @@
<input id="disable-osm" type="checkbox" checked />
</div>
<div class="some-block">
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24"
width="24px" fill="currentColor">
<g>
<rect fill="none" height="24" width="24" />
</g>
<g>
<g />
<g>
<path
d="M21,5c-1.11-0.35-2.33-0.5-3.5-0.5c-1.95,0-4.05,0.4-5.5,1.5c-1.45-1.1-3.55-1.5-5.5-1.5S2.45,4.9,1,6v14.65 c0,0.25,0.25,0.5,0.5,0.5c0.1,0,0.15-0.05,0.25-0.05C3.1,20.45,5.05,20,6.5,20c1.95,0,4.05,0.4,5.5,1.5c1.35-0.85,3.8-1.5,5.5-1.5 c1.65,0,3.35,0.3,4.75,1.05c0.1,0.05,0.15,0.05,0.25,0.05c0.25,0,0.5-0.25,0.5-0.5V6C22.4,5.55,21.75,5.25,21,5z M21,18.5 c-1.1-0.35-2.3-0.5-3.5-0.5c-1.7,0-4.15,0.65-5.5,1.5V8c1.35-0.85,3.8-1.5,5.5-1.5c1.2,0,2.4,0.15,3.5,0.5V18.5z" />
<g>
<path
d="M17.5,10.5c0.88,0,1.73,0.09,2.5,0.26V9.24C19.21,9.09,18.36,9,17.5,9c-1.7,0-3.24,0.29-4.5,0.83v1.66 C14.13,10.85,15.7,10.5,17.5,10.5z" />
<path
d="M13,12.49v1.66c1.13-0.64,2.7-0.99,4.5-0.99c0.88,0,1.73,0.09,2.5,0.26V11.9c-0.79-0.15-1.64-0.24-2.5-0.24 C15.8,11.66,14.26,11.96,13,12.49z" />
<path
d="M17.5,14.33c-1.7,0-3.24,0.29-4.5,0.83v1.66c1.13-0.64,2.7-0.99,4.5-0.99c0.88,0,1.73,0.09,2.5,0.26v-1.52 C19.21,14.41,18.36,14.33,17.5,14.33z" />
</g>
</g>
</g>
</svg>
<h4>Wikipedia</h4>
</div>
<input id="disable-wikipedia" type="checkbox" checked />
</div>
<div class="some-block">
<div class="title">
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24"
width="24px" fill="currentColor">
<g>
<rect fill="none" height="24" width="24" />
<g>
<path
d="M19,5v14H5V5H19 M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3L19,3z" />
</g>
<path d="M14,17H7v-2h7V17z M17,13H7v-2h10V13z M17,9H7V7h10V9z" />
</g>
</svg>
<h4>Medium</h4>
</div>
<input id="disable-medium" type="checkbox" checked />
</div>
<div class="buttons-popup">
<a class="button" id="change-instance">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">