Made favicon switch colour when dark mode is used

This commit is contained in:
Corey 2020-08-01 12:07:35 +08:00
parent d6f1ca5a1f
commit 71943f257d
2 changed files with 34 additions and 3 deletions

View file

@ -1 +1,33 @@
<svg height="21" viewBox="0 0 21 21" width="21" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" stroke="#2a2e3b" stroke-linecap="round" stroke-linejoin="round" transform="translate(3 2)"><path d="m7 2.5h-4.5c-1.1045695 0-2 .8954305-2 2v9.0003682c0 1.1045695.8954305 2 2 2h10c1.1045695 0 2-.8954305 2-2v-4.5003682"/><path d="m9.49086518-.60570641c.79784342.01307433 1.43777452.66357797 1.43777452 1.46152846v9.87574095l-1.41421359 2.8284271-1.41421356-2.8284271-.04115759-9.92287518c-.00322702-.77801908.62486604-1.41134419 1.40288513-1.41457122.00964205-.00003999.01928425.00001901.02892509.00017699z" transform="matrix(.70710678 .70710678 -.70710678 .70710678 7.360659 -4.816202)"/><path d="m12.5 3.5.953 1"/></g></svg>
<svg
height="21"
viewBox="0 0 21 21"
width="21"
xmlns="http://www.w3.org/2000/svg"
>
<style>
path {
stroke: #2a2e3b;
}
@media (prefers-color-scheme: dark) {
path {
stroke: #fff;
}
}
</style>
<g
fill="none"
fill-rule="evenodd"
stroke-linecap="round"
stroke-linejoin="round"
transform="translate(3 2)"
>
<path
d="m7 2.5h-4.5c-1.1045695 0-2 .8954305-2 2v9.0003682c0 1.1045695.8954305 2 2 2h10c1.1045695 0 2-.8954305 2-2v-4.5003682"
/>
<path
d="m9.49086518-.60570641c.79784342.01307433 1.43777452.66357797 1.43777452 1.46152846v9.87574095l-1.41421359 2.8284271-1.41421356-2.8284271-.04115759-9.92287518c-.00322702-.77801908.62486604-1.41134419 1.40288513-1.41457122.00964205-.00003999.01928425.00001901.02892509.00017699z"
transform="matrix(.70710678 .70710678 -.70710678 .70710678 7.360659 -4.816202)"
/>
<path d="m12.5 3.5.953 1" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 742 B

After

Width:  |  Height:  |  Size: 961 B

View file

@ -12,7 +12,6 @@
defer
></script>
<link rel="icon" type="image/svg+xml" href="/images/favicons/favicon.svg" />
<link rel="alternate icon" href="/images/favicons/favicon.ico" />
<link
rel="mask-icon"
href="/images/favicons/safari-pinned-tab.svg"
@ -179,7 +178,7 @@
</g>
</svg>
</span>
<span class="whitespace-no-wrap">Download SVG Icons</span>
<span class="whitespace-no-wrap">Download SVG Icon</span>
</label>
</div>
<a