Extract SVG inline styles to CSS file

This commit is contained in:
2022-12-13 01:13:47 +01:00
parent 52e588e0cc
commit 3d0dde80d0
2 changed files with 25 additions and 18 deletions

View File

@@ -35,27 +35,27 @@
<a id="mode" aria-label="Toggle light and dark theme" tabindex="0">
<svg class="mode-sunny" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512">
<title>LIGHT</title>
<line x1="256" y1="48" x2="256" y2="96" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="256" y1="416" x2="256" y2="464" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="403.08" y1="108.92" x2="369.14" y2="142.86" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="142.86" y1="369.14" x2="108.92" y2="403.08" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="464" y1="256" x2="416" y2="256" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="96" y1="256" x2="48" y2="256" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="403.08" y1="403.08" x2="369.14" y2="369.14" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="142.86" y1="142.86" x2="108.92" y2="108.92" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<circle cx="256" cy="256" r="80" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="256" y1="48" x2="256" y2="96" />
<line x1="256" y1="416" x2="256" y2="464" />
<line x1="403.08" y1="108.92" x2="369.14" y2="142.86" />
<line x1="142.86" y1="369.14" x2="108.92" y2="403.08" />
<line x1="464" y1="256" x2="416" y2="256" />
<line x1="96" y1="256" x2="48" y2="256" />
<line x1="403.08" y1="403.08" x2="369.14" y2="369.14" />
<line x1="142.86" y1="142.86" x2="108.92" y2="108.92" />
<circle cx="256" cy="256" r="80" />
</svg>
<svg class="mode-moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512" >
<title>DARK</title>
<line x1="256" y1="48" x2="256" y2="96" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="256" y1="416" x2="256" y2="464" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="403.08" y1="108.92" x2="369.14" y2="142.86" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="142.86" y1="369.14" x2="108.92" y2="403.08" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="464" y1="256" x2="416" y2="256" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="96" y1="256" x2="48" y2="256" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="403.08" y1="403.08" x2="369.14" y2="369.14" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="142.86" y1="142.86" x2="108.92" y2="108.92" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<circle cx="256" cy="256" r="80" style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px" />
<line x1="256" y1="48" x2="256" y2="96" />
<line x1="256" y1="416" x2="256" y2="464" />
<line x1="403.08" y1="108.92" x2="369.14" y2="142.86" />
<line x1="142.86" y1="369.14" x2="108.92" y2="403.08" />
<line x1="464" y1="256" x2="416" y2="256" />
<line x1="96" y1="256" x2="48" y2="256" />
<line x1="403.08" y1="403.08" x2="369.14" y2="369.14" />
<line x1="142.86" y1="142.86" x2="108.92" y2="108.92" />
<circle cx="256" cy="256" r="80" />
</svg>
</a>
<div class="trigger">