123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145 |
- .mixin { border: 1px solid black; }
- .mixout { border-color: orange; }
- .borders { border-style: dashed; }
- .mixin > * { border: do not match me; }
- #namespace {
- .borders {
- border-style: dotted;
- }
- .biohazard {
- content: "death";
- .man {
- color: transparent;
- }
- }
- }
- #theme {
- > .mixin {
- background-color: grey;
- }
- }
- #container {
- color: black;
- .mixin;
- .mixout;
- #theme > .mixin;
- }
- #header {
- .milk {
- color: white;
- .mixin;
- #theme > .mixin;
- }
- #cookie {
- .chips {
- #namespace .borders;
- .calories {
- #container;
- }
- }
- .borders;
- }
- }
- .secure-zone { #namespace .biohazard .man; }
- .direct {
- #namespace > .borders;
- }
- .bo, .bar {
- width: 100%;
- }
- .bo {
- border: 1px;
- }
- .ar.bo.ca {
- color: black;
- }
- .jo.ki {
- background: none;
- }
- .amp {
- &.support {
- color: orange;
- .higher {
- top: 0px;
- }
- &.deeper {
- height: auto;
- }
- }
- }
- .extended {
- .bo;
- .jo.ki;
- .amp.support;
- .amp.support.higher;
- .amp.support.deeper;
- }
- .do .re .mi .fa {
- .sol .la {
- .si {
- color: cyan;
- }
- }
- }
- .mutli-selector-parents {
- .do.re.mi.fa.sol.la.si;
- }
- .foo .bar {
- .bar;
- }
- .has_parents() {
- & .underParents {
- color: red;
- }
- }
- .has_parents();
- .parent {
- .has_parents();
- }
- .margin_between(@above, @below) {
- * + & { margin-top: @above; }
- legend + & { margin-top: 0; }
- & + * { margin-top: @below; }
- }
- h1 { .margin_between(25px, 10px); }
- h2 { .margin_between(20px, 8px); }
- h3 { .margin_between(15px, 5px); }
- .mixin_def(@url, @position){
- background-image: @url;
- background-position: @position;
- }
- .error{
- @s: "/";
- .mixin_def( "@{s}a.png", center center);
- }
- .recursion() {
- color: black;
- }
- .test-rec {
- .recursion {
- .recursion();
- }
- }
- .paddingFloat(@padding) { padding-left: @padding; }
- .button {
- .paddingFloat(((10px + 12) * 2));
- &.large { .paddingFloat(((10em * 2) * 2)); }
- }
- .clearfix() {
- // ...
- }
- .clearfix {
- .clearfix();
- }
- .clearfix {
- .clearfix();
- }
- .foo {
- .clearfix();
- }
|