wikimedia/mediawiki-extensions-Popups
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/Popups synced 2024-09-24 10:49:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

Manually optimize & reduce SVG markup

Browse source 
Reduce and optimize SVG markup by
- removing unnecessary `id` attributes,
- lowercasing hex colors following code standard
- merging repeating `fill` attributes in `<g>` elements and
- following `<svg>` root element attribute sequence as anywhere else

Change-Id: I71df1df5fee0c363df41a996b5ec32d587b76f56
This commit is contained in:
Volker E 2018-08-08 16:58:27 +02:00
parent f96762880b
commit ed529488f8
6 changed files with 55 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
resources/ext.popups.images/cog.svg
View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<g fill="#54595D">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<g fill="#54595d">
<path d="M10.112 4.554a5.334 5.334 0 1 0 0 10.668 5.334 5.334 0 0 0 0-10.668zm0 7.823a2.49 2.49 0 1 1 0-4.978 2.49 2.49 0 0 1 0 4.978z"/>
<path d="M11.4 5.303L11.05 3h-2.1L8.6 5.303a4.9 4.9 0 0 1 2.8 0zm-2.8 9.394L8.95 17h2.1l.35-2.303a4.9 4.9 0 0 1-2.8 0zm5.712-7.028l1.4-1.876L14.2 4.309l-1.876 1.4a4.9 4.9 0 0 1 1.981 1.981l.007-.021zm-8.624 4.662L4.309 14.2 5.8 15.691l1.876-1.4a4.9 4.9 0 0 1-1.981-1.981l-.007.021zm9.009-.931L17 11.05v-2.1l-2.303-.35a4.9 4.9 0 0 1 0 2.8zM5.303 8.6L3 8.95v2.1l2.303.35a4.9 4.9 0 0 1 0-2.8zm7.028 5.712l1.876 1.4 1.484-1.512-1.4-1.876a4.9 4.9 0 0 1-1.981 1.981l.021.007zM7.669 5.688L5.8 4.309 4.309 5.8l1.4 1.876a4.9 4.9 0 0 1 1.96-1.988z"/>
</g>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 839 B

After

Width:  |  Height:  |  Size: 839 B

42
resources/ext.popups.images/footer-ltr.svg
View file

@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="230" height="179" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 230 179">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="230" height="179" viewBox="0 0 230 179">
<defs>
<rect id="a" width="201" height="13" rx="2"/>
<rect id="b" width="201" height="169" y="10" rx="2"/>
@ -12,27 +12,27 @@
</g>
<use fill="#fff" xlink:href="#b"/>
<rect width="199" height="167" x="1" y="11" stroke="#a2a9b1" stroke-width="2" rx="2"/>
<g opacity=".4" transform="translate(67 35)">
<g opacity=".4" fill="#72777d" transform="translate(67 35)">
<rect width="73" height="2" y="7" fill="#c8ccd1" rx="1"/>
<rect width="81" height="2" y="31" fill="#72777d" rx="1"/>
<rect width="32" height="2" y="85" fill="#72777d" rx="1"/>
<rect width="73" height="2" x="35" y="85" fill="#72777d" rx="1"/>
<rect width="17" height="2" y="45" fill="#72777d" rx="1"/>
<rect width="17" height="2" x="91" y="45" fill="#72777d" rx="1"/>
<rect width="68" height="2" x="20" y="45" fill="#72777d" rx="1"/>
<rect width="17" height="2" y="78" fill="#72777d" rx="1"/>
<rect width="37" height="2" x="72" y="78" fill="#72777d" rx="1"/>
<rect width="49" height="2" x="20" y="78" fill="#72777d" rx="1"/>
<rect width="24" height="2" x="84" y="31" fill="#72777d" rx="1" transform="matrix(-1 0 0 1 192 0)"/>
<rect width="81" height="2" y="66" fill="#72777d" rx="1"/>
<rect width="14" height="2" x="54" y="24" fill="#72777d" rx="1"/>
<rect width="37" height="2" x="71" y="24" fill="#72777d" rx="1"/>
<rect width="51" height="2" y="24" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="59" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="52" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="92" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="38" fill="#72777d" rx="1"/>
<rect width="51" height="2" fill="#72777d" rx="1"/>
<rect width="81" height="2" y="31" rx="1"/>
<rect width="32" height="2" y="85" rx="1"/>
<rect width="73" height="2" x="35" y="85" rx="1"/>
<rect width="17" height="2" y="45" rx="1"/>
<rect width="17" height="2" x="91" y="45" rx="1"/>
<rect width="68" height="2" x="20" y="45" rx="1"/>
<rect width="17" height="2" y="78" rx="1"/>
<rect width="37" height="2" x="72" y="78" rx="1"/>
<rect width="49" height="2" x="20" y="78" rx="1"/>
<rect width="24" height="2" x="84" y="31" rx="1" transform="matrix(-1 0 0 1 192 0)"/>
<rect width="81" height="2" y="66" rx="1"/>
<rect width="14" height="2" x="54" y="24" rx="1"/>
<rect width="37" height="2" x="71" y="24" rx="1"/>
<rect width="51" height="2" y="24" rx="1"/>
<rect width="108" height="2" y="59" rx="1"/>
<rect width="108" height="2" y="52" rx="1"/>
<rect width="108" height="2" y="92" rx="1"/>
<rect width="108" height="2" y="38" rx="1"/>
<rect width="51" height="2" rx="1"/>
</g>
<rect width="30" height="2" x="67" y="158" fill="#72777d" opacity=".4" rx="1"/>
<rect width="30" height="2" x="99" y="158" fill="#72777d" opacity=".4" rx="1"/>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.6 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

42
resources/ext.popups.images/footer-rtl.svg
View file

@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="235" height="179" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 235 179">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="235" height="179" viewBox="0 0 235 179">
<defs>
<rect id="a" width="201" height="13" rx="2"/>
<rect id="b" width="201" height="169" y="10" rx="2"/>
@ -13,27 +13,27 @@
</g>
<use fill="#fff" xlink:href="#b"/>
<rect width="199" height="167" x="1" y="11" stroke="#a2a9b1" stroke-width="2" rx="2"/>
<g opacity=".4" transform="matrix(-1 0 0 1 132 35)">
<g opacity=".4" fill="#72777d" transform="matrix(-1 0 0 1 132 35)">
<rect width="73" height="2" y="7" fill="#c8ccd1" rx="1"/>
<rect width="81" height="2" y="31" fill="#72777d" rx="1"/>
<rect width="32" height="2" y="85" fill="#72777d" rx="1"/>
<rect width="73" height="2" x="35" y="85" fill="#72777d" rx="1"/>
<rect width="17" height="2" y="45" fill="#72777d" rx="1"/>
<rect width="17" height="2" x="91" y="45" fill="#72777d" rx="1"/>
<rect width="68" height="2" x="20" y="45" fill="#72777d" rx="1"/>
<rect width="17" height="2" y="78" fill="#72777d" rx="1"/>
<rect width="37" height="2" x="72" y="78" fill="#72777d" rx="1"/>
<rect width="49" height="2" x="20" y="78" fill="#72777d" rx="1"/>
<rect width="24" height="2" x="84" y="31" fill="#72777d" rx="1" transform="matrix(-1 0 0 1 192 0)"/>
<rect width="81" height="2" y="66" fill="#72777d" rx="1"/>
<rect width="14" height="2" x="54" y="24" fill="#72777d" rx="1"/>
<rect width="37" height="2" x="71" y="24" fill="#72777d" rx="1"/>
<rect width="51" height="2" y="24" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="59" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="52" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="92" fill="#72777d" rx="1"/>
<rect width="108" height="2" y="38" fill="#72777d" rx="1"/>
<rect width="51" height="2" fill="#72777d" rx="1"/>
<rect width="81" height="2" y="31" rx="1"/>
<rect width="32" height="2" y="85" rx="1"/>
<rect width="73" height="2" x="35" y="85" rx="1"/>
<rect width="17" height="2" y="45" rx="1"/>
<rect width="17" height="2" x="91" y="45" rx="1"/>
<rect width="68" height="2" x="20" y="45" rx="1"/>
<rect width="17" height="2" y="78" rx="1"/>
<rect width="37" height="2" x="72" y="78" rx="1"/>
<rect width="49" height="2" x="20" y="78" rx="1"/>
<rect width="24" height="2" x="84" y="31" rx="1" transform="matrix(-1 0 0 1 192 0)"/>
<rect width="81" height="2" y="66" rx="1"/>
<rect width="14" height="2" x="54" y="24" rx="1"/>
<rect width="37" height="2" x="71" y="24" rx="1"/>
<rect width="51" height="2" y="24" rx="1"/>
<rect width="108" height="2" y="59" rx="1"/>
<rect width="108" height="2" y="52" rx="1"/>
<rect width="108" height="2" y="92" rx="1"/>
<rect width="108" height="2" y="38" rx="1"/>
<rect width="51" height="2" rx="1"/>
</g>
<rect width="30" height="2" x="69" y="158" fill="#72777d" opacity=".4" rx="1"/>
<rect width="30" height="2" x="101" y="158" fill="#72777d" opacity=".4" rx="1"/>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.7 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

6
resources/ext.popups.images/multiple-articles-ltr.svg
View file

@ -1,5 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="2 2 20 20">
<path fill="#C8CCD1" d="M11 12h4V7h-4v5zm-5 2h9v-1H6v1zm0 2h9v-1H6v1zm0 2h9v-1H6v1zm4-9H6v1h4V9zm0 2H6v1h4v-1zm0-4H6v1h4V7zM4 5h13v16H7c-1.7 0-3-1.3-3-3V5z"/>
<path fill-rule="evenodd" fill="#C8CCD1" d="M18 4v14h2V2H7v2"/>
<g fill="#c8ccd1">
<path d="M11 12h4V7h-4v5zm-5 2h9v-1H6v1zm0 2h9v-1H6v1zm0 2h9v-1H6v1zm4-9H6v1h4V9zm0 2H6v1h4v-1zm0-4H6v1h4V7zM4 5h13v16H7c-1.7 0-3-1.3-3-3V5z"/>
<path fill-rule="evenodd" d="M18 4v14h2V2H7v2"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 355 B

After

Width:  |  Height:  |  Size: 353 B

6
resources/ext.popups.images/multiple-articles-rtl.svg
View file

@ -1,5 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="2 2 20 20">
<path fill="#C8CCD1" d="M13 12H9V7h4v5zm5 2H9v-1h9v1zm0 2H9v-1h9v1zm0 2H9v-1h9v1zm-4-9h4v1h-4V9zm0 2h4v1h-4v-1zm0-4h4v1h-4V7zm6-2H7v16h10c1.7 0 3-1.3 3-3V5z"/>
<path fill="#C8CCD1" fill-rule="evenodd" d="M6 4v14H4V2h13v2"/>
<g fill="#c8ccd1">
<path d="M13 12H9V7h4v5zm5 2H9v-1h9v1zm0 2H9v-1h9v1zm0 2H9v-1h9v1zm-4-9h4v1h-4V9zm0 2h4v1h-4v-1zm0-4h4v1h-4V7zm6-2H7v16h10c1.7 0 3-1.3 3-3V5z"/>
<path fill-rule="evenodd" d="M6 4v14H4V2h13v2"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 356 B

After

Width:  |  Height:  |  Size: 354 B

8
resources/ext.popups.images/sad-face.svg
View file

@ -1,8 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="37" height="27" viewBox="0 0 37 27" xmlns="http://www.w3.org/2000/svg">
<g id="Page-1" fill="none" fill-rule="evenodd">
<g id="sad-face" fill="#C8CCD1">
<path d="M5.475.7v20.075L0 26.25h31.025c3.102 0 5.475-2.372 5.475-5.475V.7H5.475zm20.44 4.562c1.277 0 2.19 1.095 2.19 2.19 0 1.096-.913 2.373-2.19 2.373-1.278 0-2.19-1.095-2.19-2.19s1.095-2.373 2.19-2.373zm-9.855 0c1.277 0 2.19 1.095 2.19 2.19 0 1.096-1.095 2.373-2.19 2.373s-2.19-1.095-2.19-2.19.913-2.373 2.19-2.373zm4.928 8.213c-7.153 0-8.415 7.012-8.415 7.012s2.805-1.403 8.415-1.403c5.61 0 8.414 1.403 8.414 1.403S28 13.475 20.988 13.475z" id="Shape"/>
</g>
<svg xmlns="http://www.w3.org/2000/svg" width="37" height="27" viewBox="0 0 37 27">
<g fill="#c8ccd1" fill-rule="evenodd">
<path d="M5.475.7v20.075L0 26.25h31.025c3.102 0 5.475-2.372 5.475-5.475V.7H5.475zm20.44 4.562c1.277 0 2.19 1.095 2.19 2.19 0 1.096-.913 2.373-2.19 2.373-1.278 0-2.19-1.095-2.19-2.19s1.095-2.373 2.19-2.373zm-9.855 0c1.277 0 2.19 1.095 2.19 2.19 0 1.096-1.095 2.373-2.19 2.373s-2.19-1.095-2.19-2.19.913-2.373 2.19-2.373zm4.928 8.213c-7.153 0-8.415 7.012-8.415 7.012s2.805-1.403 8.415-1.403c5.61 0 8.414 1.403 8.414 1.403S28 13.475 20.988 13.475z"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 688 B

After

Width:  |  Height:  |  Size: 625 B