Merge pull request #4 from essentialkaos/develop

Add examples to README
main
ᴀɴᴛᴏɴ ɴᴏᴠᴏᴊɪʟᴏᴠ 3 years ago committed by GitHub
commit b9dd5bf871
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="60" height="20" role="img" aria-label="flat: blue"><title>flat: blue</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="60" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="33" height="20" fill="#007ec6"/><rect width="60" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="230">blue</text><text x="425" y="140" transform="scale(.1)" fill="#fff" textLength="230">blue</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="102" height="20" role="img" aria-label="flat: brightgreen"><title>flat: brightgreen</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="102" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="75" height="20" fill="#4c1"/><rect width="102" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="635" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="650">brightgreen</text><text x="635" y="140" transform="scale(.1)" fill="#fff" textLength="650">brightgreen</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="73" height="20" role="img" aria-label="flat: critical"><title>flat: critical</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="73" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="46" height="20" fill="#e05d44"/><rect width="73" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="495" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="360">critical</text><text x="495" y="140" transform="scale(.1)" fill="#fff" textLength="360">critical</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="72" height="20" role="img" aria-label="flat: ff69b4"><title>flat: ff69b4</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="72" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="45" height="20" fill="#ff69b4"/><rect width="72" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="485" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">ff69b4</text><text x="485" y="140" transform="scale(.1)" fill="#fff" textLength="350">ff69b4</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="69" height="20" role="img" aria-label="flat: green"><title>flat: green</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="69" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="42" height="20" fill="#97ca00"/><rect width="69" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="475" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="320">green</text><text x="475" y="140" transform="scale(.1)" fill="#fff" textLength="320">green</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="91" height="20" role="img" aria-label="flat: important"><title>flat: important</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="91" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="64" height="20" fill="#fe7d37"/><rect width="91" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="585" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="540">important</text><text x="585" y="140" transform="scale(.1)" fill="#fff" textLength="540">important</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="80" height="20" role="img" aria-label="flat: inactive"><title>flat: inactive</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="80" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="53" height="20" fill="#9f9f9f"/><rect width="80" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="525" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">inactive</text><text x="525" y="140" transform="scale(.1)" fill="#fff" textLength="430">inactive</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="111" height="20" role="img" aria-label="flat: informational"><title>flat: informational</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="111" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="84" height="20" fill="#007ec6"/><rect width="111" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="685" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="740">informational</text><text x="685" y="140" transform="scale(.1)" fill="#fff" textLength="740">informational</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="86" height="20" role="img" aria-label="flat: lightgrey"><title>flat: lightgrey</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="86" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="59" height="20" fill="#9f9f9f"/><rect width="86" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="555" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="490">lightgrey</text><text x="555" y="140" transform="scale(.1)" fill="#fff" textLength="490">lightgrey</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="76" height="20" role="img" aria-label="flat: orange"><title>flat: orange</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="76" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="49" height="20" fill="#fe7d37"/><rect width="76" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="505" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="390">orange</text><text x="505" y="140" transform="scale(.1)" fill="#fff" textLength="390">orange</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="55" height="20" role="img" aria-label="flat: red"><title>flat: red</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="55" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="28" height="20" fill="#e05d44"/><rect width="55" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="405" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="180">red</text><text x="405" y="140" transform="scale(.1)" fill="#fff" textLength="180">red</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="80" height="20" role="img" aria-label="flat: success"><title>flat: success</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="80" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="53" height="20" fill="#4c1"/><rect width="80" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="525" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">success</text><text x="525" y="140" transform="scale(.1)" fill="#fff" textLength="430">success</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="72" height="20" role="img" aria-label="flat: yellow"><title>flat: yellow</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="72" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="45" height="20" fill="#dfb317"/><rect width="72" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="485" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">yellow</text><text x="485" y="140" transform="scale(.1)" fill="#fff" textLength="350">yellow</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="105" height="20" role="img" aria-label="flat: yellowgreen"><title>flat: yellowgreen</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="105" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="27" height="20" fill="#555"/><rect x="27" width="78" height="20" fill="#a4a61d"/><rect width="105" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="145" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="170">flat</text><text x="145" y="140" transform="scale(.1)" fill="#fff" textLength="170">flat</text><text aria-hidden="true" x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="680">yellowgreen</text><text x="655" y="140" transform="scale(.1)" fill="#fff" textLength="680">yellowgreen</text></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="78" height="18" role="img" aria-label="plastic: blue"><title>plastic: blue</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="78" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="33" height="18" fill="#007ec6"/><rect width="78" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="605" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="230">blue</text><text x="605" y="130" transform="scale(.1)" fill="#fff" textLength="230">blue</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="120" height="18" role="img" aria-label="plastic: brightgreen"><title>plastic: brightgreen</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="120" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="75" height="18" fill="#4c1"/><rect width="120" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="815" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="650">brightgreen</text><text x="815" y="130" transform="scale(.1)" fill="#fff" textLength="650">brightgreen</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="91" height="18" role="img" aria-label="plastic: critical"><title>plastic: critical</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="91" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="46" height="18" fill="#e05d44"/><rect width="91" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="675" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="360">critical</text><text x="675" y="130" transform="scale(.1)" fill="#fff" textLength="360">critical</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="90" height="18" role="img" aria-label="plastic: ff69b4"><title>plastic: ff69b4</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="90" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="45" height="18" fill="#ff69b4"/><rect width="90" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="665" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">ff69b4</text><text x="665" y="130" transform="scale(.1)" fill="#fff" textLength="350">ff69b4</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="87" height="18" role="img" aria-label="plastic: green"><title>plastic: green</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="87" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="42" height="18" fill="#97ca00"/><rect width="87" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="655" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="320">green</text><text x="655" y="130" transform="scale(.1)" fill="#fff" textLength="320">green</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="109" height="18" role="img" aria-label="plastic: important"><title>plastic: important</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="109" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="64" height="18" fill="#fe7d37"/><rect width="109" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="765" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="540">important</text><text x="765" y="130" transform="scale(.1)" fill="#fff" textLength="540">important</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="98" height="18" role="img" aria-label="plastic: inactive"><title>plastic: inactive</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="98" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="53" height="18" fill="#9f9f9f"/><rect width="98" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="705" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">inactive</text><text x="705" y="130" transform="scale(.1)" fill="#fff" textLength="430">inactive</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="129" height="18" role="img" aria-label="plastic: informational"><title>plastic: informational</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="129" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="84" height="18" fill="#007ec6"/><rect width="129" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="865" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="740">informational</text><text x="865" y="130" transform="scale(.1)" fill="#fff" textLength="740">informational</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="104" height="18" role="img" aria-label="plastic: lightgrey"><title>plastic: lightgrey</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="104" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="59" height="18" fill="#9f9f9f"/><rect width="104" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="735" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="490">lightgrey</text><text x="735" y="130" transform="scale(.1)" fill="#fff" textLength="490">lightgrey</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="94" height="18" role="img" aria-label="plastic: orange"><title>plastic: orange</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="94" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="49" height="18" fill="#fe7d37"/><rect width="94" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="685" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="390">orange</text><text x="685" y="130" transform="scale(.1)" fill="#fff" textLength="390">orange</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="73" height="18" role="img" aria-label="plastic: red"><title>plastic: red</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="73" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="28" height="18" fill="#e05d44"/><rect width="73" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="585" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="180">red</text><text x="585" y="130" transform="scale(.1)" fill="#fff" textLength="180">red</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="98" height="18" role="img" aria-label="plastic: success"><title>plastic: success</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="98" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="53" height="18" fill="#4c1"/><rect width="98" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="705" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">success</text><text x="705" y="130" transform="scale(.1)" fill="#fff" textLength="430">success</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="90" height="18" role="img" aria-label="plastic: yellow"><title>plastic: yellow</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="90" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="45" height="18" fill="#dfb317"/><rect width="90" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="665" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">yellow</text><text x="665" y="130" transform="scale(.1)" fill="#fff" textLength="350">yellow</text></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="123" height="18" role="img" aria-label="plastic: yellowgreen"><title>plastic: yellowgreen</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#fff" stop-opacity=".7"/><stop offset=".1" stop-color="#aaa" stop-opacity=".1"/><stop offset=".9" stop-color="#000" stop-opacity=".3"/><stop offset="1" stop-color="#000" stop-opacity=".5"/></linearGradient><clipPath id="r"><rect width="123" height="18" rx="4" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="45" height="18" fill="#555"/><rect x="45" width="78" height="18" fill="#a4a61d"/><rect width="123" height="18" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="235" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">plastic</text><text x="235" y="130" transform="scale(.1)" fill="#fff" textLength="350">plastic</text><text aria-hidden="true" x="835" y="140" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="680">yellowgreen</text><text x="835" y="130" transform="scale(.1)" fill="#fff" textLength="680">yellowgreen</text></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="20" role="img" aria-label="square: blue"><title>square: blue</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="33" height="20" fill="#007ec6"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="635" y="140" transform="scale(.1)" fill="#fff" textLength="230">blue</text></g></svg>

After

Width:  |  Height:  |  Size: 620 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="123" height="20" role="img" aria-label="square: brightgreen"><title>square: brightgreen</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="75" height="20" fill="#4c1"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="845" y="140" transform="scale(.1)" fill="#fff" textLength="650">brightgreen</text></g></svg>

After

Width:  |  Height:  |  Size: 639 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="94" height="20" role="img" aria-label="square: critical"><title>square: critical</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="46" height="20" fill="#e05d44"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="705" y="140" transform="scale(.1)" fill="#fff" textLength="360">critical</text></g></svg>

After

Width:  |  Height:  |  Size: 632 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="93" height="20" role="img" aria-label="square: ff69b4"><title>square: ff69b4</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="45" height="20" fill="#ff69b4"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="695" y="140" transform="scale(.1)" fill="#fff" textLength="350">ff69b4</text></g></svg>

After

Width:  |  Height:  |  Size: 626 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="90" height="20" role="img" aria-label="square: green"><title>square: green</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="42" height="20" fill="#97ca00"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="685" y="140" transform="scale(.1)" fill="#fff" textLength="320">green</text></g></svg>

After

Width:  |  Height:  |  Size: 623 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="112" height="20" role="img" aria-label="square: important"><title>square: important</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="64" height="20" fill="#fe7d37"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="795" y="140" transform="scale(.1)" fill="#fff" textLength="540">important</text></g></svg>

After

Width:  |  Height:  |  Size: 636 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="101" height="20" role="img" aria-label="square: inactive"><title>square: inactive</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="53" height="20" fill="#9f9f9f"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="735" y="140" transform="scale(.1)" fill="#fff" textLength="430">inactive</text></g></svg>

After

Width:  |  Height:  |  Size: 633 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="132" height="20" role="img" aria-label="square: informational"><title>square: informational</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="84" height="20" fill="#007ec6"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="895" y="140" transform="scale(.1)" fill="#fff" textLength="740">informational</text></g></svg>

After

Width:  |  Height:  |  Size: 648 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="107" height="20" role="img" aria-label="square: lightgrey"><title>square: lightgrey</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="59" height="20" fill="#9f9f9f"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="765" y="140" transform="scale(.1)" fill="#fff" textLength="490">lightgrey</text></g></svg>

After

Width:  |  Height:  |  Size: 636 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="97" height="20" role="img" aria-label="square: orange"><title>square: orange</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="49" height="20" fill="#fe7d37"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="715" y="140" transform="scale(.1)" fill="#fff" textLength="390">orange</text></g></svg>

After

Width:  |  Height:  |  Size: 626 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="76" height="20" role="img" aria-label="square: red"><title>square: red</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="28" height="20" fill="#e05d44"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="615" y="140" transform="scale(.1)" fill="#fff" textLength="180">red</text></g></svg>

After

Width:  |  Height:  |  Size: 617 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="101" height="20" role="img" aria-label="square: success"><title>square: success</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="53" height="20" fill="#4c1"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="735" y="140" transform="scale(.1)" fill="#fff" textLength="430">success</text></g></svg>

After

Width:  |  Height:  |  Size: 627 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="93" height="20" role="img" aria-label="square: yellow"><title>square: yellow</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="45" height="20" fill="#dfb317"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="695" y="140" transform="scale(.1)" fill="#fff" textLength="350">yellow</text></g></svg>

After

Width:  |  Height:  |  Size: 626 B

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="126" height="20" role="img" aria-label="square: yellowgreen"><title>square: yellowgreen</title><g shape-rendering="crispEdges"><rect width="48" height="20" fill="#555"/><rect x="48" width="78" height="20" fill="#a4a61d"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" transform="scale(.1)" fill="#fff" textLength="380">square</text><text x="865" y="140" transform="scale(.1)" fill="#fff" textLength="680">yellowgreen</text></g></svg>

After

Width:  |  Height:  |  Size: 642 B

@ -10,7 +10,7 @@
<a href="#license"><img src="https://gh.kaos.st/apache2.svg"></a> <a href="#license"><img src="https://gh.kaos.st/apache2.svg"></a>
</p> </p>
<p align="center"><a href="#installation">Installation</a><a href="#usage-example">Usage example</a><a href="#build-status">Build Status</a><a href="#contributing">Contributing</a><a href="#thanks">Thanks</a><a href="#license">License</a></p> <p align="center"><a href="#installation">Installation</a><a href="#usage-example">Usage example</a><a href="#examples">Examples</a><a href="#build-status">Build Status</a><a href="#contributing">Contributing</a><a href="#thanks">Thanks</a><a href="#license">License</a></p>
<br/> <br/>
@ -55,6 +55,25 @@ func main() {
} }
``` ```
### Examples
| Flat | Flat Square | Plastic |
|------|-------------|---------|
| ![flat](.github/images/flat_brightgreen.svg) | ![square](.github/images/square_brightgreen.svg) | ![plastic](.github/images/plastic_brightgreen.svg) |
| ![flat](.github/images/flat_green.svg) | ![square](.github/images/square_green.svg) | ![plastic](.github/images/plastic_green.svg) |
| ![flat](.github/images/flat_yellowgreen.svg) | ![square](.github/images/square_yellowgreen.svg) | ![plastic](.github/images/plastic_yellowgreen.svg) |
| ![flat](.github/images/flat_yellow.svg) | ![square](.github/images/square_yellow.svg) | ![plastic](.github/images/plastic_yellow.svg) |
| ![flat](.github/images/flat_orange.svg) | ![square](.github/images/square_orange.svg) | ![plastic](.github/images/plastic_orange.svg) |
| ![flat](.github/images/flat_red.svg) | ![square](.github/images/square_red.svg) | ![plastic](.github/images/plastic_red.svg) |
| ![flat](.github/images/flat_blue.svg) | ![square](.github/images/square_blue.svg) | ![plastic](.github/images/plastic_blue.svg) |
| ![flat](.github/images/flat_lightgrey.svg) | ![square](.github/images/square_lightgrey.svg) | ![plastic](.github/images/plastic_lightgrey.svg) |
| ![flat](.github/images/flat_success.svg) | ![square](.github/images/square_success.svg) | ![plastic](.github/images/plastic_success.svg) |
| ![flat](.github/images/flat_important.svg) | ![square](.github/images/square_important.svg) | ![plastic](.github/images/plastic_important.svg) |
| ![flat](.github/images/flat_critical.svg) | ![square](.github/images/square_critical.svg) | ![plastic](.github/images/plastic_critical.svg) |
| ![flat](.github/images/flat_informational.svg) | ![square](.github/images/square_informational.svg) | ![plastic](.github/images/plastic_informational.svg) |
| ![flat](.github/images/flat_inactive.svg) | ![square](.github/images/square_inactive.svg) | ![plastic](.github/images/plastic_inactive.svg) |
| ![flat](.github/images/flat_custom.svg) | ![square](.github/images/square_custom.svg) | ![plastic](.github/images/plastic_custom.svg) |
### Build Status ### Build Status
| Branch | Status | | Branch | Status |

Loading…
Cancel
Save