-
Notifications
You must be signed in to change notification settings - Fork 3
/
example-firefox.html
80 lines (68 loc) · 6.44 KB
/
example-firefox.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<style>
body {
display: flex;
place-items: center;
justify-content: center;
height: 100vh;
margin: 0 auto;
max-width: 1080px;
font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 12px;
}
.topsite {
display: grid;
grid-template-rows: 1fr auto;
place-items: center;
gap: 1em;
padding: 1em;
border-radius: 0.5em;
width: 75px;
}
.topsite:hover {
background: #dddddd22;
}
a {
text-decoration: none;
color: inherit;
}
img {
width: 32px;
height: 32px;
}
</style>
<a href="https://youtube.com">
<div class="topsite">
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACSUlEQVRYhe2WTUtUURjHf+fOnTvTGzGMQ9BYTjVIlBDVxl4oatHGlYJfwL5BCOp3cNNWXLhwkwStCyEwImlQQ03mBbN8m2hKbIxmOnfGp4UkWnSZM2PTQn9wduf//P/33uee88AB+x1lsllEFGB5bVFKbVYd4H5T0+VWpVqjImfPKRXxQSgAR6MQVBAEbMAB5C+1yoAG3AL8yEIR+PYd1hdFPmcta3EGph8uLLzYVeMEHHkCQ5tQFpB/vSbh+QU4vZ38GQzVw3jnSsIY4HAPrgqU6h1AQNrhrnUDbgI+k8bZK27BNasZzv8Pc4A4NFtNEDVSRSLQ1wehUM0BwnCSDLw0+naRiIjrimQyIh0dNfXAB5gkCTNGwoYGkVxOthkZEYnHqwqwCimLrYOlejo7IZGA7m5wzEoJHCYFyZrewE6mpkTa2iqulYVVy294H3gSi0G08p62AEvvlfngILS0wMBAxZISiC1Qqsl4YgJ6e2F01FgqUCQN48Y9oLVIPi/S0yMSCFT9G67AtL0Ba0axfT4YHob+fpibM37qnWRh3Z6H1SsmqlwOurpqMv7FV/hovYO0kWrTaODxJA3z1msY37OKhryBBIB/Gp7WexbIwtsGOAbAJYjOwli9zFdg9g5chN2noP3AcdqvK3W7Ec6cEgkrpY47cCi8dV/42RpKvYcXpUqIlAH3C2gNBZTKL4msfYKlhFKvHhWLj1Ow8XuAPxAR3/LystOotUMgYKO1jW17B9C6RDBYplBw39u2jsVirlKq7Kk5YF/zE0TQuB5oNz7XAAAAAElFTkSuQmCC'/>
<div>YouTube</div>
</div>
</a>
<a href="https://music.youtube.com">
<div class="topsite">
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABsElEQVRYhc1X7XVCIQy9doG+DdQJZAScQEZwBEdgBEdwBDdQN8AJxA3oBOmPPOyTPgI9VTHn5Bch9+aDAEClEKAIsAQcCaCMHnsbVeu3BnhNgBNAc+oIWP8HeFaItlaPBMz+Cm4ICA8AjxoIMLXg6wcCpyqXpI/8WeBR7zIxGdYcgAPwWUyTMYBKGt05YL+vSfIXADUBfBq93HBdR2QtUQh0E+dYo4TANl1XbMwUXK67UkTeM8huR2TMbxtjeI2IbZWq7weSzrlSHFkIRFqXa6z1j71MwkVwJabd+xpn46S9L5VDgXh0jhtYyykdRq410XZbrrPWvNdayc7KzRcC13XMcQhEm41MYrdjO6kZs4vGMFDacJFAFO/zvZHzMdCP7GmN57x0tqdT4HBgu1ky8uPedGYMJE8AAM5nGXwoqxVwuQDWAl1X7UMm8AKRCSwW9Z5OJ2A+5wyEUO0jT8DxnIAp3KLXK7BcAloD/n683/ZGX2PyDsew+SBqO4r7MrS7jHoCba/jYjPGcjzhQfI+T7KexMsfpWMk2j3Lk0y0+ZgMSLT7miVE2nxOR4g85Xv+DTyym+5sY/4gAAAAAElFTkSuQmCC'/>
<div>YTMusic</div>
</div>
</a>
<a href="https://github.com">
<div class="topsite">
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACDUlEQVRYhbVW7VXDMAw8ZwGyAWECsgHZgGwAG8AGhAnoBpQNYALKBC0T0E6QdILjh51Xo0r55t7LHynSyZYsyWEESJYAbgFkAFIAeVDtADQA9gDenXMfY/z2kWYkX0nWHI462KRzyauRxFogT1OIU5LbGcQSWw69DZI5553aQk0yl3xOnhzAD3yB/QcaAFfOuaYVJIL8U5B/A3gDcJhAdgi2X5Gs5TgHfcFJ3Ef6e5L7SLcRXxPkjbArFb+VJM+o570Q/6VaHoWfVMhyox7S+Ke1UTjFGctIhKA0rIFTDZSGfTY3AJy6pcRtG6GWozaXs19DSNve4CgT2Kd/jJ/LVAQflaEuQF/BGhbtBQbHJoHedI5LnF7gS5FdJACuFUW9MLmFPDEUS1T/IJ8JjDa7dA0AuFRkhwR+i9FgvY7RoN+kNOwT+HVKw91SAQB4NOS7rkZEkpbhYNAPMQtl26majp/Gr1Qncm3Ctjh1Wv4dRlW4lV0k+yH5QvJmAGlB8iHYdGEVG8UTq6YfoakIooVVMyD53kMaI5PG8XXVIaiM5+kxXwf12a9Bnw3ixOsgS0NwFaNNpyOIPpg3qBWkuf1MDOBsxDvFQQ5gA+AiiNaImpVz7rkvAEN1BFA45+wbiJxYBWg5/xOAdu3y5INA5R1PCMBaRgYHkZFchfz17gjtf/S9ZbmpGtLS65DKat6FX3k/Lk/amtkQAAAAAElFTkSuQmCC'/>
<div>GitHub</div>
</div>
</a>
<a href="https://twitch.tv">
<div class="topsite">
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABGUlEQVRYhe2XOxKCMBRF73PcmA1swxWoWYG6AgdsbBnpbRUax46OJbAEa4rEwhnlE0ggQBpuxSfDOXmBl4HQkrMj9hw4tI3pm21EBAALG/BilrrwzWMYoO+Wz2sVmGrmUoGp4SUBG/CSQF+479bXte16o4CtzAKzgHUBaSvukqYWrdu6rVdgUoHXxaJAEgLp7XvMgeOkAkkIJNc/nEX0a/vGL2EnuIDHYirtOaNWoDLzgMW0q47RrkB1Zyt+ZkWQLBwIWERr2T3jCqjgAFLkqM18EAEdOM+xYk96Dy6gAc9UcDMBFXyhhhsJKOF3ynQGk+5TPUcIU5gsJhVITeFA/06ofLtHE2hrKn3SaQm4gDckvFNOjhjlr+kDgCN7fLtYAaQAAAAASUVORK5CYII='/>
<div>Twitch</div>
</div>
</a>
<a href="https://arstechnica.com">
<div class="topsite">
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAEf0lEQVRYhb2WaWxUVRTHf+fNm+m0U6jQIYUBAwoqRCiWqEEgSGVrDK5hESObC5JAUBENKiRGP/BBgyaCCaZCad2wEtBo1ETEhCCLooJBbUFBqdChC907y5t3/PCmi/TRTgjtSV7ecs69v/89997zrpCi6cJQEG98GmpPBRkDDAX8SXcUqAT+QNhPjO/ko+pzqfQrPYIXZY8BVoA8CAxLUW8VsAeDrbKj+ugVCdClI/wkmteCPgMMTBF8qbUAm/FYG6Wori5lAfpwzvV4EoVA/hWCL+mQo3jsJbKj9kSPAnRp9mgS8ilw41WBd1gFYs+X4tqDlxWgywZeS8LYi3LDVYa30c4h9qzOmTDa4fPwYRnbeg0OoISwjRKdNyCriwDSgquBGb0G77A80j3r214Ekqm3jJ+AYB8IAIjgkTukqOoXJwOWLO9DOICfhK4CEH002I84PwMju22iCtJj3WoLTt67i5ca4pprErMnIoY7XBUizaAJMEywE2B6IS0DEnGItYI3HaIt4PWB1w+tTR1c2wZ/wGnbLqq982y8Ot3EMCZ38bXBDQMmz4W8AjRrEFJfBV9vhZM/wPCxaO50ZF8x3LcGGmvhy7chfzF6+73OGE8fg2+2QcvFpIguWZhioDrWdfS2BYFr0Aeeh8wBSEUZjJwAz+2EjP6QlQPzN8ALe2DOalQEpixAn3gLLoaRhmp00lzIDoEVd58FZbSJymDXqfJ4obkeWZ8P9TXg80H+Elj5DuRcB5EmxB9wMvXsrUjFKXiqEGlpgJ2vwvl/kH4ZkJ4JvnR3AUKOidDP3QtEm9GxdyJ3r0KHjEL8mc46EMO5EhYUrYXwGQgEYF8x5M2GLSeg/DB8WwRHPnMG476AMw23r+3w8TNh3W5oqEY2LYOtKzt2g4izyKwo+PyQFoCyQ/DiVCheB5YFT5fAzMch0nQ5ihpAvavLisNtc6AuDG8shl8POKn3mI6IZA4xPM5jIo6OyAUrBru2wEsFThZumZWMd1vpNJkI5119homUHYIZj8GGz500hpK/CcPjXF6vMxUoRJth9pNoXgFSdtDJyojxsH2Ns5vca0Kl5+XcwE3AXV1cphfOnoDKv2BgCE4fhw82oOdOImeOQWsjWhdGyo9APAKmD/n7ONJQBQOGQKwFPtkIh3c7tcJ1DcgXoo8EpyHsc52GzoUIcUYVjzqFCByfP7PTNMQg2gpqOwM2TKcQXa4iqiwQnTcsHX/kKDDGParX7AJ4xhlSWtGKynt9DAd0p5SELzjbMCHvAv/2Ib0Rkc2QPJDIhxfCKK/0oYDXpbi6vF0AAKOqC0F39QF8PxH/a20vlxxKBw/Csr4CJvQS/E885gwpqjzT9uF/pVi2V1Zh2vcDP/YCvBz0ns7wLgIcEbVnsYw5QOlVQwt7wVMgJTW/d3V1Y7oouAJYBwy/QnQY9E0iNZuklJi7th5MHwqGMGUpwkLQm1NpA5xC9GPULJSS8OnuAlM9ZaLLQxm0RieCMQnRcdgMRbR/0t0IRiXYv6HGATTxvbxf25BKv/8BvX6UDc2E7H0AAAAASUVORK5CYII='/>
<div>Ars Technica</div>
</div>
</a>
<a href="https://wired.com">
<div class="topsite">
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAB70lEQVRYhe3Xz05TURDH8Q//7KYtENiQspew4R2IewkrhbX6RhJ1TZS3kATfAKNdSkIkaEtL/9Dbf7g456YxsUDUpJeE2Zzk3Lm5v/nOnDNzp3BtgjY9yY8/CIDZcQ9yuRwoFoqgVq+BXq/3XwVkl8D6+jrYefYcHH8+Bh8ODkA+nwfNZhMkSfJXArJLYG5uDiwuLoJSqQRWVlbAqxcvQb1eB2/evQXD4RCjWmm32zcKyC6BXjdEUKuFCC8vG2BmOmieL4bTsbS0hBGp3Z1dsLwc9l/v7YFyufzH72SYQL8Pmq1Q5Wku+/0BqF5cgOlIJM39fKEA1h6vYURmnGWXwGAQCLRi5J1OJ+wPA4FGo/mbf78X/CuVCjg9PQ3vXV3dKCDDBGJOO0k3ruGmGw7CfqvdAtdxmhgMApl6I5yWys9AIul2bxSQXQJJJ0ScdMM6Mxtc87HKOzGyQTwtaW20WoHMxR27Z3YJnJx8A+/398HTrS2wvb0NrmPyv5+dgUI+kEm7YiN2yX4kNM6ySyCNsNkMVV2tVsFqaRUcHn4ExdgTUkK5R2GSOv9xjtvnhIkTmHLH/4J0RizEiOu1UOUbGxtgc/MJKH/9Ao4+HQW/OC+Mq4X7Q2CcpZPTwsICRj2jEW/E2+z+E/hXmziBBwG/AEFw0G8fjrBfAAAAAElFTkSuQmCC'/>
<div>Wired</div>
</div>
</a>