UN flag doesn't match up to the source SVG about twemoji-colr HOT 5 CLOSED

I investigated a bit more and found that the size of the SVGs might be to blame, as grunt-webfont seems to work better with larger SVGs, especially 512px ones. We might need to resize the SVGs somehow to fix this and other emojis. Relevant bug: sapegin/grunt-webfont#321

EDIT: After some testing, I have come to the conclusion that it is not the size of the SVGs.

from twemoji-colr.

Would it be worth adding an override SVG for this as a workaround? After chopping up the paths a bit with Inkscape (then trimming the markup back down again) I have an SVG that when placed in overrides produces a decent rendering.

from twemoji-colr.

That could be a viable solution.

from twemoji-colr.

I've finally pushed my mentioned override to KwanEsq@4f3c9bb
It's possible it could be simplified a bit, but it does the job.

from twemoji-colr.

So to document the steps for creating the override file:

1. Copy twemoji/2/svg/1f1fa-1f1f3.svg to twemoji-colr/overrides/1f1fa-1f1f3.svg
2. Open twemoji-colr/overrides/1f1fa-1f1f3.svg in Inkscape
3. Select the path with the landmasses in (7th of the 9 paths in the group)
4. In the "Path" menu select "Break Apart"
5. Several of the ocean sections are now solid white
6. Select one of the new paths making up a white ocean section
7. Shift-click every re-coloured ocean section, so they are all selected at once
8. Open twemoji/2/svg/1f1fa-1f1f3.svg in Inkscape
9. Flick between the modified and second copy to compare and not miss any small bits
10. In the "Fill and Stroke" > "Fill" panel click on "Flat colour"
11. Use the colour picker to set the background blue as the fill colour
12. Double check you didn't miss any small bits
13. In the "Object" menu select "Group"
14. "File" > "Save As..."
15. Choose "Optimised SVG" as the output format
16. Tick the following options:
    1. Options
       1. Shorten colour values
       2. Convert CSS attributes to XML attributes
       3. Collapse groups
       4. Create groups for similar attributes
       5. Work around renderer bugs
    2. SVG Output
       1. Remove the XML declaration
       2. Remove metadata
       3. Remove comments
    3. IDs
       1. Remove unused IDs
17. Save
18. Optional: open the override SVG and remove the version attribute from the root svg element

from twemoji-colr.