FlatSVGIcon: support color filtering

This commit is contained in:
Karl Tauber
2020-05-03 18:21:00 +02:00
parent 464787dc1e
commit 4bd3b889dc
15 changed files with 154 additions and 85 deletions

View File

@@ -1,9 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<g fill="#AFB1B3" fill-rule="evenodd" transform="translate(1 3)">
<rect width="11" height="2" x="2" y="4"/>
<g transform="translate(0 .02)">
<rect width="7" height="1.8" x="-.389" y="2.24" transform="rotate(-45 3.111 3.14)"/>
<rect width="1.8" height="7" x="2.211" y="3.317" transform="rotate(-45 3.111 6.817)"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 442 B

View File

@@ -1,6 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<g fill="none" fill-rule="evenodd">
<path fill="#AFB1B3" d="M11,3 L4,3 L4,11 L2,11 L2,1 L11,1 L11,3 Z"/>
<path fill="#AFB1B3" d="M5,4 L14,4 L14,14 L5,14 L5,4 Z M7,6 L7,7 L12,7 L12,6 L7,6 Z M7,10 L7,11 L12,11 L12,10 L7,10 Z M7,8 L7,9 L12,9 L12,8 L7,8 Z"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 363 B

View File

@@ -1,6 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<g fill="none" fill-rule="evenodd">
<polygon fill="#AFB1B3" points="9 7 12 7 8 11 4 7 7 7 7 2 9 2" transform="matrix(-1 0 0 1 16 0)"/>
<rect width="12" height="2" x="2" y="12" fill="#AFB1B3"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 301 B

View File

@@ -1,9 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<g fill="#AFB1B3" fill-rule="evenodd" transform="matrix(-1 0 0 1 15 3)">
<rect width="12" height="2" x="1" y="4"/>
<g transform="translate(0 .02)">
<rect width="7" height="1.8" x="-.389" y="2.24" transform="rotate(-45 3.111 3.14)"/>
<rect width="1.8" height="7" x="2.211" y="3.317" transform="rotate(-45 3.111 6.817)"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 449 B

View File

@@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#AFB1B3" d="M6.53206047,5.10906 C6.68535547,4.77581 6.77200047,4.40923501 6.77200047,4.01600001 C6.77200047,2.54303502 5.57896548,1.35000002 4.10600049,1.35000002 C2.63303549,1.35000002 1.4400005,2.54303502 1.4400005,4.01600001 C1.4400005,5.488965 2.63303549,6.68199999 4.10600049,6.68199999 C4.49923548,6.68199999 4.86581048,6.59535499 5.19906048,6.44205999 L6.77200047,8.01499999 L5.19906048,9.58793998 C4.86581048,9.43464498 4.49923548,9.34799998 4.10600049,9.34799998 C2.63303549,9.34799998 1.4400005,10.541035 1.4400005,12.014 C1.4400005,13.486965 2.63303549,14.6799999 4.10600049,14.6799999 C5.57896548,14.6799999 6.77200047,13.486965 6.77200047,12.014 C6.77200047,11.620765 6.68535547,11.25419 6.53206047,10.92094 L8.10500046,9.34799998 L12.7705004,14 L14.7700004,14 L14.7700004,13.347 L6.53206047,5.10906 Z M4.1053342,5.33702364 C3.37236745,5.33702364 2.77266738,4.74383861 2.77266738,4.00402356 C2.77266738,3.26420851 3.37236745,2.67102348 4.1053342,2.67102348 C4.83830096,2.67102348 5.43800103,3.26420851 5.43800103,4.00402356 C5.43800103,4.74383861 4.83830096,5.33702364 4.1053342,5.33702364 Z M4.1053342,13.3350241 C3.37236745,13.3350241 2.77266738,12.7418391 2.77266738,12.0020241 C2.77266738,11.262209 3.37236745,10.669024 4.1053342,10.669024 C4.83830096,10.669024 5.43800103,11.262209 5.43800103,12.0020241 C5.43800103,12.7418391 4.83830096,13.3350241 4.1053342,13.3350241 Z M8.10333468,8.33627383 C7.91676132,8.33627383 7.77016797,8.18964382 7.77016797,8.00302381 C7.77016797,7.8164038 7.91676132,7.66977379 8.10333468,7.66977379 C8.28990803,7.66977379 8.43650138,7.8164038 8.43650138,8.00302381 C8.43650138,8.18964382 8.28990803,8.33627383 8.10333468,8.33627383 Z M12.7710002,2.00452344 L8.77299971,6.00352368 L10.1056665,7.33652377 L14.7700004,2.67102348 L14.7700004,2.00452344 L12.7710002,2.00452344 Z"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.9 KiB

View File

@@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#737373" fill-rule="evenodd" d="M3,1 L3,0 L7,0 L7,1 L10,1 L10,13 L0,13 L0,1 L3,1 Z M4,1 L4,2 L6,2 L6,1 L4,1 Z M2,4 L2,11 L8,11 L8,4 L2,4 Z" transform="translate(3 1)"/>
<path fill="#6E6E6E" fill-rule="evenodd" d="M3,1 L3,0 L7,0 L7,1 L10,1 L10,13 L0,13 L0,1 L3,1 Z M4,1 L4,2 L6,2 L6,1 L4,1 Z M2,4 L2,11 L8,11 L8,4 L2,4 Z" transform="translate(3 1)"/>
</svg>

Before

Width:  |  Height:  |  Size: 274 B

After

Width:  |  Height:  |  Size: 274 B

View File

@@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#AFB1B3" fill-rule="evenodd" d="M3,1 L3,0 L7,0 L7,1 L10,1 L10,13 L0,13 L0,1 L3,1 Z M4,1 L4,2 L6,2 L6,1 L4,1 Z M2,4 L2,11 L8,11 L8,4 L2,4 Z" transform="translate(3 1)"/>
</svg>

Before

Width:  |  Height:  |  Size: 274 B

View File

@@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#AFB1B3" d="M8.35170965,4.66666667 C6.5846115,4.66666667 4.98422073,5.32666667 3.75058618,6.4 L1.35000002,4 L1.35000002,10 L7.35146542,10 L4.93754267,7.58666667 C5.86443566,6.81333333 7.04472385,6.33333333 8.35170965,6.33333333 C10.712286,6.33333333 12.7194428,7.87333333 13.4196138,10 L14.9999996,9.48 C14.0731067,6.68666667 11.4524668,4.66666667 8.35170965,4.66666667 Z" transform="matrix(-1 0 0 1 16.35 0)"/>
</svg>

Before

Width:  |  Height:  |  Size: 517 B

View File

@@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#AFB1B3" fill-rule="evenodd" d="M12.5747152,11.8852806 C11.4741474,13.1817355 9.83247882,14.0044386 7.99865879,14.0044386 C5.03907292,14.0044386 2.57997332,11.8615894 2.08820756,9.0427473 L3.94774327,9.10768372 C4.43372186,10.8898575 6.06393114,12.2000519 8.00015362,12.2000519 C9.30149237,12.2000519 10.4645985,11.6082097 11.2349873,10.6790094 L9.05000019,8.71167959 L14.0431479,8.44999981 L14.3048222,13.4430431 L12.5747152,11.8852806 Z M3.42785637,4.11741586 C4.52839138,2.82452748 6.16775464,2.00443857 7.99865879,2.00443857 C10.918604,2.00443857 13.3513802,4.09026967 13.8882946,6.8532307 L12.0226389,6.78808057 C11.5024872,5.05935553 9.89838095,3.8000774 8.00015362,3.8000774 C6.69867367,3.8000774 5.53545628,4.39204806 4.76506921,5.32142241 L6.95482203,7.29304326 L1.96167436,7.55472304 L1.70000005,2.56167973 L3.42785637,4.11741586 Z" transform="rotate(3 8.002 8.004)"/>
</svg>

Before

Width:  |  Height:  |  Size: 984 B

View File

@@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#AFB1B3" d="M8,3 C4.81818182,3 2.10090909,5.07333333 1,8 C2.10090909,10.9266667 4.81818182,13 8,13 C11.1818182,13 13.8990909,10.9266667 15,8 C13.8990909,5.07333333 11.1818182,3 8,3 Z M8,11.5 C6.068,11.5 4.5,9.932 4.5,8 C4.5,6.068 6.068,4.5 8,4.5 C9.932,4.5 11.5,6.068 11.5,8 C11.5,9.932 9.932,11.5 8,11.5 Z M8,6 C6.89333333,6 6,6.89333333 6,8 C6,9.10666667 6.89333333,10 8,10 C9.10666667,10 10,9.10666667 10,8 C10,6.89333333 9.10666667,6 8,6 Z"/>
</svg>

Before

Width:  |  Height:  |  Size: 552 B

View File

@@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill="#AFB1B3" d="M8.00170962,4.66666667 C6.23461148,4.66666667 4.63422071,5.32666667 3.40058616,6.4 L1,4 L1,10 L7.00146539,10 L4.58754265,7.58666667 C5.51443563,6.81333333 6.69472383,6.33333333 8.00170962,6.33333333 C10.362286,6.33333333 12.3694428,7.87333333 13.0696137,10 L14.6499996,9.48 C13.7231066,6.68666667 11.1024667,4.66666667 8.00170962,4.66666667 Z"/>
</svg>

Before

Width:  |  Height:  |  Size: 463 B