Components

File: src/scss/_vendors/_sow/flags/main.scss can be disabled fom src/scss/main.scss

Country Flags

Based on flag-sprites.com, added as Smarty Core! Only 13Kb CSS (unminified) and a png sprite (26Kb optimized) located in assets/images/ directory
This way is userful for language switchers!
Please note: are not scallable using font size classes because is a PNG (single png with all flags - sprite)!

See at the bottom some examples.

usage: <i class="flag flag-us"></i>


<select class="form-control bs-select" data-live-search="true">

	<option val="ad" data-icon="flag flag-ad">ad</option>
	<option val="ae" data-icon="flag flag-ae">ae</option>
	<option val="af" data-icon="flag flag-af">af</option>
	<option val="ag" data-icon="flag flag-ag">ag</option>
	<option val="ai" data-icon="flag flag-ai">ai</option>
	<option val="al" data-icon="flag flag-al">al</option>
	<option val="am" data-icon="flag flag-am">am</option>
	<option val="an" data-icon="flag flag-an">an</option>
	<option val="ao" data-icon="flag flag-ao">ao</option>
	<option val="ar" data-icon="flag flag-ar">ar</option>
	<option val="as" data-icon="flag flag-as">as</option>
	<option val="at" data-icon="flag flag-at">at</option>
	<option val="au" data-icon="flag flag-au">au</option>
	<option val="aw" data-icon="flag flag-aw">aw</option>
	<option val="az" data-icon="flag flag-az">az</option>
	<option val="ba" data-icon="flag flag-ba">ba</option>
	<option val="bb" data-icon="flag flag-bb">bb</option>
	<option val="bd" data-icon="flag flag-bd">bd</option>
	<option val="be" data-icon="flag flag-be">be</option>
	<option val="bf" data-icon="flag flag-bf">bf</option>
	<option val="bg" data-icon="flag flag-bg">bg</option>
	<option val="bh" data-icon="flag flag-bh">bh</option>
	<option val="bi" data-icon="flag flag-bi">bi</option>
	<option val="bj" data-icon="flag flag-bj">bj</option>
	<option val="bm" data-icon="flag flag-bm">bm</option>
	<option val="bn" data-icon="flag flag-bn">bn</option>
	<option val="bo" data-icon="flag flag-bo">bo</option>
	<option val="br" data-icon="flag flag-br">br</option>
	<option val="bs" data-icon="flag flag-bs">bs</option>
	<option val="bt" data-icon="flag flag-bt">bt</option>
	<option val="bv" data-icon="flag flag-bv">bv</option>
	<option val="bw" data-icon="flag flag-bw">bw</option>
	<option val="by" data-icon="flag flag-by">by</option>
	<option val="bz" data-icon="flag flag-bz">bz</option>
	<option val="ca" data-icon="flag flag-ca">ca</option>
	<option val="catalonia" data-icon="flag flag-catalonia">catalonia</option>
	<option val="cd" data-icon="flag flag-cd">cd</option>
	<option val="cf" data-icon="flag flag-cf">cf</option>
	<option val="cg" data-icon="flag flag-cg">cg</option>
	<option val="ch" data-icon="flag flag-ch">ch</option>
	<option val="ci" data-icon="flag flag-ci">ci</option>
	<option val="ck" data-icon="flag flag-ck">ck</option>
	<option val="cl" data-icon="flag flag-cl">cl</option>
	<option val="cm" data-icon="flag flag-cm">cm</option>
	<option val="cn" data-icon="flag flag-cn">cn</option>
	<option val="co" data-icon="flag flag-co">co</option>
	<option val="cr" data-icon="flag flag-cr">cr</option>
	<option val="cu" data-icon="flag flag-cu">cu</option>
	<option val="cv" data-icon="flag flag-cv">cv</option>
	<option val="cw" data-icon="flag flag-cw">cw</option>
	<option val="cy" data-icon="flag flag-cy">cy</option>
	<option val="cz" data-icon="flag flag-cz">cz</option>
	<option val="de" data-icon="flag flag-de">de</option>
	<option val="dj" data-icon="flag flag-dj">dj</option>
	<option val="dk" data-icon="flag flag-dk">dk</option>
	<option val="dm" data-icon="flag flag-dm">dm</option>
	<option val="do" data-icon="flag flag-do">do</option>
	<option val="dz" data-icon="flag flag-dz">dz</option>
	<option val="ec" data-icon="flag flag-ec">ec</option>
	<option val="ee" data-icon="flag flag-ee">ee</option>
	<option val="eg" data-icon="flag flag-eg">eg</option>
	<option val="eh" data-icon="flag flag-eh">eh</option>
	<option val="england" data-icon="flag flag-england">england</option>
	<option val="er" data-icon="flag flag-er">er</option>
	<option val="es" data-icon="flag flag-es">es</option>
	<option val="et" data-icon="flag flag-et">et</option>
	<option val="eu" data-icon="flag flag-eu">eu</option>
	<option val="fi" data-icon="flag flag-fi">fi</option>
	<option val="fj" data-icon="flag flag-fj">fj</option>
	<option val="fk" data-icon="flag flag-fk">fk</option>
	<option val="fm" data-icon="flag flag-fm">fm</option>
	<option val="fo" data-icon="flag flag-fo">fo</option>
	<option val="fr" data-icon="flag flag-fr">fr</option>
	<option val="ga" data-icon="flag flag-ga">ga</option>
	<option val="gb" data-icon="flag flag-gb">gb</option>
	<option val="gd" data-icon="flag flag-gd">gd</option>
	<option val="ge" data-icon="flag flag-ge">ge</option>
	<option val="gf" data-icon="flag flag-gf">gf</option>
	<option val="gg" data-icon="flag flag-gg">gg</option>
	<option val="gh" data-icon="flag flag-gh">gh</option>
	<option val="gi" data-icon="flag flag-gi">gi</option>
	<option val="gl" data-icon="flag flag-gl">gl</option>
	<option val="gm" data-icon="flag flag-gm">gm</option>
	<option val="gn" data-icon="flag flag-gn">gn</option>
	<option val="gp" data-icon="flag flag-gp">gp</option>
	<option val="gq" data-icon="flag flag-gq">gq</option>
	<option val="gr" data-icon="flag flag-gr">gr</option>
	<option val="gs" data-icon="flag flag-gs">gs</option>
	<option val="gt" data-icon="flag flag-gt">gt</option>
	<option val="gu" data-icon="flag flag-gu">gu</option>
	<option val="gw" data-icon="flag flag-gw">gw</option>
	<option val="gy" data-icon="flag flag-gy">gy</option>
	<option val="hk" data-icon="flag flag-hk">hk</option>
	<option val="hm" data-icon="flag flag-hm">hm</option>
	<option val="hn" data-icon="flag flag-hn">hn</option>
	<option val="hr" data-icon="flag flag-hr">hr</option>
	<option val="ht" data-icon="flag flag-ht">ht</option>
	<option val="hu" data-icon="flag flag-hu">hu</option>
	<option val="ic" data-icon="flag flag-ic">ic</option>
	<option val="id" data-icon="flag flag-id">id</option>
	<option val="ie" data-icon="flag flag-ie">ie</option>
	<option val="il" data-icon="flag flag-il">il</option>
	<option val="im" data-icon="flag flag-im">im</option>
	<option val="in" data-icon="flag flag-in">in</option>
	<option val="io" data-icon="flag flag-io">io</option>
	<option val="iq" data-icon="flag flag-iq">iq</option>
	<option val="ir" data-icon="flag flag-ir">ir</option>
	<option val="is" data-icon="flag flag-is">is</option>
	<option val="it" data-icon="flag flag-it">it</option>
	<option val="je" data-icon="flag flag-je">je</option>
	<option val="jm" data-icon="flag flag-jm">jm</option>
	<option val="jo" data-icon="flag flag-jo">jo</option>
	<option val="jp" data-icon="flag flag-jp">jp</option>
	<option val="ke" data-icon="flag flag-ke">ke</option>
	<option val="kg" data-icon="flag flag-kg">kg</option>
	<option val="kh" data-icon="flag flag-kh">kh</option>
	<option val="ki" data-icon="flag flag-ki">ki</option>
	<option val="km" data-icon="flag flag-km">km</option>
	<option val="kn" data-icon="flag flag-kn">kn</option>
	<option val="kp" data-icon="flag flag-kp">kp</option>
	<option val="kr" data-icon="flag flag-kr">kr</option>
	<option val="kurdistan" data-icon="flag flag-kurdistan">kurdistan</option>
	<option val="kw" data-icon="flag flag-kw">kw</option>
	<option val="ky" data-icon="flag flag-ky">ky</option>
	<option val="kz" data-icon="flag flag-kz">kz</option>
	<option val="la" data-icon="flag flag-la">la</option>
	<option val="lb" data-icon="flag flag-lb">lb</option>
	<option val="lc" data-icon="flag flag-lc">lc</option>
	<option val="li" data-icon="flag flag-li">li</option>
	<option val="lk" data-icon="flag flag-lk">lk</option>
	<option val="lr" data-icon="flag flag-lr">lr</option>
	<option val="ls" data-icon="flag flag-ls">ls</option>
	<option val="lt" data-icon="flag flag-lt">lt</option>
	<option val="lu" data-icon="flag flag-lu">lu</option>
	<option val="lv" data-icon="flag flag-lv">lv</option>
	<option val="ly" data-icon="flag flag-ly">ly</option>
	<option val="ma" data-icon="flag flag-ma">ma</option>
	<option val="mc" data-icon="flag flag-mc">mc</option>
	<option val="md" data-icon="flag flag-md">md</option>
	<option val="me" data-icon="flag flag-me">me</option>
	<option val="mg" data-icon="flag flag-mg">mg</option>
	<option val="mh" data-icon="flag flag-mh">mh</option>
	<option val="mk" data-icon="flag flag-mk">mk</option>
	<option val="ml" data-icon="flag flag-ml">ml</option>
	<option val="mm" data-icon="flag flag-mm">mm</option>
	<option val="mn" data-icon="flag flag-mn">mn</option>
	<option val="mo" data-icon="flag flag-mo">mo</option>
	<option val="mp" data-icon="flag flag-mp">mp</option>
	<option val="mq" data-icon="flag flag-mq">mq</option>
	<option val="mr" data-icon="flag flag-mr">mr</option>
	<option val="ms" data-icon="flag flag-ms">ms</option>
	<option val="mt" data-icon="flag flag-mt">mt</option>
	<option val="mu" data-icon="flag flag-mu">mu</option>
	<option val="mv" data-icon="flag flag-mv">mv</option>
	<option val="mw" data-icon="flag flag-mw">mw</option>
	<option val="mx" data-icon="flag flag-mx">mx</option>
	<option val="my" data-icon="flag flag-my">my</option>
	<option val="mz" data-icon="flag flag-mz">mz</option>
	<option val="na" data-icon="flag flag-na">na</option>
	<option val="nc" data-icon="flag flag-nc">nc</option>
	<option val="ne" data-icon="flag flag-ne">ne</option>
	<option val="nf" data-icon="flag flag-nf">nf</option>
	<option val="ng" data-icon="flag flag-ng">ng</option>
	<option val="ni" data-icon="flag flag-ni">ni</option>
	<option val="nl" data-icon="flag flag-nl">nl</option>
	<option val="no" data-icon="flag flag-no">no</option>
	<option val="np" data-icon="flag flag-np">np</option>
	<option val="nr" data-icon="flag flag-nr">nr</option>
	<option val="nu" data-icon="flag flag-nu">nu</option>
	<option val="nz" data-icon="flag flag-nz">nz</option>
	<option val="om" data-icon="flag flag-om">om</option>
	<option val="pa" data-icon="flag flag-pa">pa</option>
	<option val="pe" data-icon="flag flag-pe">pe</option>
	<option val="pf" data-icon="flag flag-pf">pf</option>
	<option val="pg" data-icon="flag flag-pg">pg</option>
	<option val="ph" data-icon="flag flag-ph">ph</option>
	<option val="pk" data-icon="flag flag-pk">pk</option>
	<option val="pl" data-icon="flag flag-pl">pl</option>
	<option val="pm" data-icon="flag flag-pm">pm</option>
	<option val="pn" data-icon="flag flag-pn">pn</option>
	<option val="pr" data-icon="flag flag-pr">pr</option>
	<option val="ps" data-icon="flag flag-ps">ps</option>
	<option val="pt" data-icon="flag flag-pt">pt</option>
	<option val="pw" data-icon="flag flag-pw">pw</option>
	<option val="py" data-icon="flag flag-py">py</option>
	<option val="qa" data-icon="flag flag-qa">qa</option>
	<option val="re" data-icon="flag flag-re">re</option>
	<option val="ro" data-icon="flag flag-ro">ro</option>
	<option val="rs" data-icon="flag flag-rs">rs</option>
	<option val="ru" data-icon="flag flag-ru">ru</option>
	<option val="rw" data-icon="flag flag-rw">rw</option>
	<option val="sa" data-icon="flag flag-sa">sa</option>
	<option val="sb" data-icon="flag flag-sb">sb</option>
	<option val="sc" data-icon="flag flag-sc">sc</option>
	<option val="scotland" data-icon="flag flag-scotland">scotland</option>
	<option val="sd" data-icon="flag flag-sd">sd</option>
	<option val="se" data-icon="flag flag-se">se</option>
	<option val="sg" data-icon="flag flag-sg">sg</option>
	<option val="sh" data-icon="flag flag-sh">sh</option>
	<option val="si" data-icon="flag flag-si">si</option>
	<option val="sk" data-icon="flag flag-sk">sk</option>
	<option val="sl" data-icon="flag flag-sl">sl</option>
	<option val="sm" data-icon="flag flag-sm">sm</option>
	<option val="sn" data-icon="flag flag-sn">sn</option>
	<option val="so" data-icon="flag flag-so">so</option>
	<option val="somaliland" data-icon="flag flag-somaliland">somaliland</option>
	<option val="sr" data-icon="flag flag-sr">sr</option>
	<option val="ss" data-icon="flag flag-ss">ss</option>
	<option val="st" data-icon="flag flag-st">st</option>
	<option val="sv" data-icon="flag flag-sv">sv</option>
	<option val="sx" data-icon="flag flag-sx">sx</option>
	<option val="sy" data-icon="flag flag-sy">sy</option>
	<option val="sz" data-icon="flag flag-sz">sz</option>
	<option val="tc" data-icon="flag flag-tc">tc</option>
	<option val="td" data-icon="flag flag-td">td</option>
	<option val="tf" data-icon="flag flag-tf">tf</option>
	<option val="tg" data-icon="flag flag-tg">tg</option>
	<option val="th" data-icon="flag flag-th">th</option>
	<option val="tibet" data-icon="flag flag-tibet">tibet</option>
	<option val="tj" data-icon="flag flag-tj">tj</option>
	<option val="tk" data-icon="flag flag-tk">tk</option>
	<option val="tl" data-icon="flag flag-tl">tl</option>
	<option val="tm" data-icon="flag flag-tm">tm</option>
	<option val="tn" data-icon="flag flag-tn">tn</option>
	<option val="to" data-icon="flag flag-to">to</option>
	<option val="tr" data-icon="flag flag-tr">tr</option>
	<option val="tt" data-icon="flag flag-tt">tt</option>
	<option val="tv" data-icon="flag flag-tv">tv</option>
	<option val="tw" data-icon="flag flag-tw">tw</option>
	<option val="tz" data-icon="flag flag-tz">tz</option>
	<option val="ua" data-icon="flag flag-ua">ua</option>
	<option val="ug" data-icon="flag flag-ug">ug</option>
	<option val="um" data-icon="flag flag-um">um</option>
	<option val="us" data-icon="flag flag-us">us</option>
	<option val="uy" data-icon="flag flag-uy">uy</option>
	<option val="uz" data-icon="flag flag-uz">uz</option>
	<option val="va" data-icon="flag flag-va">va</option>
	<option val="vc" data-icon="flag flag-vc">vc</option>
	<option val="ve" data-icon="flag flag-ve">ve</option>
	<option val="vg" data-icon="flag flag-vg">vg</option>
	<option val="vi" data-icon="flag flag-vi">vi</option>
	<option val="vn" data-icon="flag flag-vn">vn</option>
	<option val="vu" data-icon="flag flag-vu">vu</option>
	<option val="wales" data-icon="flag flag-wales">wales</option>
	<option val="wf" data-icon="flag flag-wf">wf</option>
	<option val="ws" data-icon="flag flag-ws">ws</option>
	<option val="xk" data-icon="flag flag-xk">xk</option>
	<option val="ye" data-icon="flag flag-ye">ye</option>
	<option val="yt" data-icon="flag flag-yt">yt</option>
	<option val="za" data-icon="flag flag-za">za</option>
	<option val="zanzibar" data-icon="flag flag-zanzibar">zanzibar</option>
	<option val="zm" data-icon="flag flag-zm">zm</option>
	<option val="zw" data-icon="flag flag-zw">zw</option>

</select>