Permalink
Find file
Fetching contributors…
Cannot retrieve contributors at this time
40 lines (34 sloc) 1.23 KB
// Wallis and Futuna
// http://www.crwflags.com/fotw/flags/wf.html
// http://www.vexilla-mundi.com/wallis_and_futuna_flag.html
@mixin flag-wlf() {
@include ratio(2 / 3);
$unit: $height / 180;
$red: #d50032;
$white: #FFF;
$blue: #003057;
$canton-width: 91 * $unit;
$canton-height: 61 * $unit;
$canton-border: $unit;
$square-size: 60 * $unit;
$square-left: $width - (120 * $unit);
$square-top: $height - (120 * $unit);
$hypotenuse: sqrt($square-size * $square-size * 2);
$half-hypotenuse: $hypotenuse / 2;
$square-stripe-size: 12 * $unit;
$half-square-stripe-size: $square-stripe-size / 2;
// Rounding error forces me to remove 1px
$square-stripe-distance: $half-hypotenuse - $half-square-stripe-size - 1px;
background-color: $red;
&:before {
@include rectangle($white, $canton-width, $canton-height);
border-right: $canton-border solid $white;
border-bottom: $canton-border solid $white;
@include three-columns($blue, $white, $red);
}
&:after {
@include square($white, $square-size, $square-left, $square-top);
background-image: stripe(45deg, $red, $square-stripe-size, $square-stripe-distance),
stripe(-45deg, $red, $square-stripe-size, $square-stripe-distance);
}
};