davejansen/system.css
1
0
Fork 0
mirror of https://github.com/sakofchit/system.css.git synced 2026-05-05 06:01:22 +09:00
Code Issues Activity

Simplify radio border svg, create separate svg for focused state, add focused state

Browse Source 
Foo
This commit is contained in:
Patrick H. Lauke
2022-08-12 21:22:35 +01:00
parent 1bc39d155c
commit b1301bab26
3 changed files with 29 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
icon/radio-border-focused.svg Normal file
View File

@@ -0,0 +1,14 @@
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="4" width="4" height="2" fill="black"/>
<rect y="4" width="2" height="4" fill="black"/>
<rect x="10" y="4" width="2" height="4" fill="black"/>
<rect x="2" y="1" width="2" height="2" fill="black"/>
<rect x="8" y="1" width="2" height="2" fill="black"/>
<rect x="9" y="2" width="2" height="2" fill="black"/>
<rect x="1" y="2" width="2" height="2" fill="black"/>
<rect x="4" y="10" width="4" height="2" fill="black"/>
<rect x="2" y="9" width="2" height="2" fill="black"/>
<rect x="8" y="9" width="2" height="2" fill="black"/>
<rect x="9" y="8" width="2" height="2" fill="black"/>
<rect x="1" y="8" width="2" height="2" fill="black"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 742 B

24
icon/radio-border.svg
View File

@@ -1,14 +1,14 @@
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="3.90698" width="4.18605" height="1.06667" fill="black"/>
<rect y="8" width="4" height="1.11628" transform="rotate(-90 0 8)" fill="black"/>
<rect x="10.8837" y="8" width="4" height="1.11628" transform="rotate(-90 10.8837 8)" fill="black"/>
<rect x="1.95349" y="1.06667" width="1.95349" height="1.06667" fill="black"/>
<rect x="8.09302" y="1.06667" width="1.95349" height="1.06667" fill="black"/>
<rect x="10.0465" y="4" width="1.86667" height="0.837209" transform="rotate(-90 10.0465 4)" fill="black"/>
<rect x="1.11627" y="4" width="1.86667" height="0.837209" transform="rotate(-90 1.11627 4)" fill="black"/>
<rect width="4.18605" height="1.06667" transform="matrix(1 0 0 -1 3.90698 12)" fill="black"/>
<rect width="1.95349" height="1.06667" transform="matrix(1 0 0 -1 1.95349 10.9333)" fill="black"/>
<rect width="1.95349" height="1.06667" transform="matrix(1 0 0 -1 8.09302 10.9333)" fill="black"/>
<rect width="1.86667" height="0.837209" transform="matrix(0 1 1 0 10.0465 8)" fill="black"/>
<rect width="1.86667" height="0.837209" transform="matrix(0 1 1 0 1.11627 8)" fill="black"/>
<rect x="4" width="4" height="1" fill="black"/>
<rect y="4" width="1" height="4" fill="black"/>
<rect x="11" y="4" width="1" height="4" fill="black"/>
<rect x="2" y="1" width="2" height="1" fill="black"/>
<rect x="8" y="1" width="2" height="1" fill="black"/>
<rect x="10" y="2" width="1" height="2" fill="black"/>
<rect x="1" y="2" width="1" height="2" fill="black"/>
<rect x="4" y="11" width="4" height="1" fill="black"/>
<rect x="2" y="10" width="2" height="1" fill="black"/>
<rect x="8" y="10" width="2" height="1" fill="black"/>
<rect x="10" y="8" width="1" height="2" fill="black"/>
<rect x="1" y="8" width="1" height="2" fill="black"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 747 B