mirror of https://github.com/deuill/fawkss.git
72 lines
1.0 KiB
SCSS
72 lines
1.0 KiB
SCSS
//
|
|
// Simple mixin tests for Fawkss.
|
|
//
|
|
|
|
--- TEST ---
|
|
|
|
// Simple mixin with no parameters or parent selectors.
|
|
@mixin invisible-ink {
|
|
color: white;
|
|
background-color: white;
|
|
}
|
|
|
|
body {
|
|
@include invisible-ink;
|
|
}
|
|
|
|
// Nested mixin with additional rules.
|
|
@mixin invisible-box {
|
|
@include invisible-ink;
|
|
border: none;
|
|
}
|
|
|
|
#boxy-mcboxface {
|
|
@include invisible-box;
|
|
}
|
|
|
|
// Simple mixin with parameters.
|
|
@mixin paint-it($fg-color, $bg-color) {
|
|
color: $fg-color;
|
|
background-color: $bg-color;
|
|
}
|
|
|
|
#black-box {
|
|
@include paint-it(black, black);
|
|
}
|
|
|
|
// Mixin with default parameters and overrides.
|
|
$color-1: black;
|
|
$color-2: white;
|
|
$color-3: red;
|
|
|
|
@mixin gradient-me($color-1: purple, $color-2: black) {
|
|
linear-gradient(left, $color-1, $color-2, $color-3);
|
|
}
|
|
|
|
#rainbox-box {
|
|
@include gradient-me(green);
|
|
}
|
|
|
|
--- EXPECTED ---
|
|
|
|
body {
|
|
color: white;
|
|
background-color: white;
|
|
}
|
|
|
|
#boxy-mcboxface {
|
|
color: white;
|
|
background-color: white;
|
|
border: none;
|
|
}
|
|
|
|
#black-box {
|
|
color: black;
|
|
background-color: black;
|
|
}
|
|
|
|
#rainbox-box {
|
|
linear-gradient(left, green, black, red);
|
|
}
|
|
|
|
--- END --- |