flag-icon-css

WebJar for flag-icon-css

License

License

MIT
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

flag-icon-css
Last Version

Last Version

2.8.0
Release Date

Release Date

Type

Type

jar
Description

Description

flag-icon-css
WebJar for flag-icon-css
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/lipis/flag-icon-css

Download flag-icon-css

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/flag-icon-css/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>flag-icon-css</artifactId>
    <version>2.8.0</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/flag-icon-css/
implementation 'org.webjars.bower:flag-icon-css:2.8.0'
// https://jarcasting.com/artifacts/org.webjars.bower/flag-icon-css/
implementation ("org.webjars.bower:flag-icon-css:2.8.0")
'org.webjars.bower:flag-icon-css:jar:2.8.0'
<dependency org="org.webjars.bower" name="flag-icon-css" rev="2.8.0">
  <artifact name="flag-icon-css" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='flag-icon-css', version='2.8.0')
)
libraryDependencies += "org.webjars.bower" % "flag-icon-css" % "2.8.0"
[org.webjars.bower/flag-icon-css "2.8.0"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

flag-icon-css

A collection of all country flags in SVG — plus the CSS for easier integration. See the demo.

Install

You can either download the whole project as is or install it via Bower or NPM:

$ bower install flag-icon-css
$ npm install flag-icon-css

Usage

For using the flags inline with text add the classes .flag-icon and .flag-icon-xx (where xx is the ISO 3166-1-alpha-2 code of a country) to an empty <span>. If you want to have a squared version flag then add the class flag-icon-squared as well. Example:

<span class="flag-icon flag-icon-gr"></span>
<span class="flag-icon flag-icon-gr flag-icon-squared"></span>

You could also apply this to any element, but in that case you'll have to use the flag-icon-background instead of flag-icon and you're set. This will add the correct background with the following CSS properties:

background-size: contain;
background-position: 50%;
background-repeat: no-repeat;

Which means that the flag is just going to appear in the middle of an element, so you will have to set manually the correct size of 4 by 3 ratio or if it's squared add also the flag-icon-squared class.

Development

Run the npm install to install the dependencies after cloning the project and you'll be able to:

To watch for changes and live reload if served

$ grunt

To build *.less files

$ grunt build

To serve it on localhost:8000

$ grunt connect

To have only specific countries in the css file, remove the ones that you don't need from the flag-icon-list.less file and build it again.

Credits

This project wouldn't exist without the awesome and now deleted collection of SVG flags by koppi.

Versions

Version
2.8.0
2.3.1
2.1.0
1.4.0
0.7.0