country-flags-css
Stylesheets with individual countries' flags and their spritesheets.
We're using the icon set from Go Squared Ltd. in this project. For short it's free for use, change and distribute (for more info see the license file).
Installing
Via NPM:
npm i -S country-flags-css
How to use it
With webpack
First of all you should configure module.rules
, so that all the
css dependecies required in your code should be placed in a single css bundle.
An example of such config:
test: /\.css$/ use: ExtractTextPlugin test: /\.scss$/ use: ExtractTextPlugin/** * File loader for supporting images, for example, in CSS files. */ test: /\.$/ use: loader: 'url-loader' options: name: '[name]-[hash].[ext]' limit: 4096 outputPath: '../images/'
Then you just import country-flags-css/dist/<CSS FILE YOU NEED>
from your
.jsx?
or .scss
code.
Stylesheets you can import:
all.css
- css classes for icons of all sizes and styles.flat.css
- css classes for icons of all sizes only flatly looking flags.shiny.css
- css classes for icons of all sizes only 3d looking flags.(flat|shiny)(16|24|32|48|64).css
(e.g.flat16.css
) - 16x16px flat flags.(flat|shiny)(16|24|32|48|64)sheet.css
(e.g.flat16sheet.css
) - 16x16px flat flags from spritesheet.
CSS classes
Example:
The classes denotes icon size and country code in ISO 3166-1 alpha-2 format respectively.
Note: cf
is an abbreviation of "Country Flag".