catamphetamine / country-flag-icons Goto Github PK

Hi, seems Netherlands Antilles flag is missing)

As mentioned, the design I'm working on calls for circular flags - it turns out, very little art direction is required to do this, and we could very easily add CSS-only modifiers to make this happen.

I hacked out a quick UI that lets me edit the CSS background-position percentage of every flag, and went over all of them and adjusted them by hand - you can see the result here:

https://codesandbox.io/s/thirsty-stallman-0pnlt

So really, all I would need to do is generate a bit of CSS from these values, which I'm going to do anyway for the project I'm working on.

I decided I don't want to manually build proportional versions of every flag - almost all of them look just fine if you simply center the view over the central visual element in each flag.

I also tried to be respectful of a few flags where details would inevitably be lost - I looked up the meaning of certain elements in these flags and tried to avoid cropping out elements that represent geographical/political entities.

For all but a few flags, this worked out well, I think - maybe 3 or 4 flags in there could use a bit of actual art direction to move certain elements around, but I think this is pretty good considering we wouldn't need to go through the hassle of shipping and maintaining another whole set of flags.

Well, let me know what you think? I'm building the CSS modifier anyhow and I'd be happy to submit a PR, if you'd like. 🙂

Correct one is below

After cloning and running npm install, I get the following error:

> [email protected] generate-countries /home/mindplay/workspace/country-flag-icons
> babel-node runnable/generate-countries

internal/modules/cjs/loader.js:796
    throw err;
    ^

Error: Cannot find module '/home/mindplay/workspace/country-flag-icons/runnable/generate-countries'

The runnable folder seems to be missing from source-control?

(This project looks fantastic, by the way! Every other flag package has some flags with way too much detail, inconsistent file sizes or dimensions etc. - it must have been quite a bit of work to curate this package... I'd like to contribute another build-script, one that inlines all the SVG images in a single CSS file to avoid the JavaScript overhead of the React component...)