1.flag-icon-background { 2 background-size: contain; 3 background-position: 50%; 4 background-repeat: no-repeat; 5} 6 7.flag-icon { 8 .flag-icon-background; 9 position: relative; 10 display: inline-block; 11 width: unit((4 / 3), em); 12 line-height: 1em; 13 &:before { 14 content: "\00a0"; 15 } 16 &.flag-icon-squared { 17 width: 1em; 18 } 19} 20 21.flag-icon(@country) { 22 .flag-icon-@{country} { 23 background-image: ~"url(@{flag-icon-css-path}@{flag-icon-rect-path}/@{country}.svg)"; 24 &.flag-icon-squared { 25 background-image: ~"url(@{flag-icon-css-path}@{flag-icon-square-path}/@{country}.svg)"; 26 } 27 } 28} 29