Fundacja Nowoczesna Polska | Kod - redakcja.git/blob

   1 .error {
   2   border: 1px #f00;
   3   background: #fdd;
   4 }
   5 .error.intrusion {
   6   font-size: 1.3em;
   7   font-weight: bold;
   8 }
   9 .intrusion .error {
  10   display: none;
  11 }
  12 .badError:extend(.error all) {
  13   border-width: 3px;
  14 }
  15
  16 .foo .bar, .foo .baz {
  17     display: none;
  18 }
  19
  20 .ext1 .ext2
  21     :extend(.foo all) {
  22 }
  23
  24 .ext3:extend(.foo all),
  25 .ext4:extend(.foo all) {
  26 }
  27
  28 div.ext5,
  29 .ext6 > .ext5 {
  30     width: 100px;
  31 }
  32
  33 .should-not-exist-in-output,
  34 .ext7:extend(.ext5 all) {
  35 }
  36
  37 .ext {
  38   test: 1;
  39 }
  40 // same as
  41 // .a .c:extend(.ext all)
  42 // .b .c:extend(.ext all)
  43 // .a .c .d
  44 // .b .c .d
  45 .a, .b {
  46   test: 2;
  47   .c:extend(.ext all) {
  48     test: 3;
  49     .d {
  50       test: 4;
  51     }
  52   }
  53 }
  54
  55 .replace.replace,
  56 .c.replace + .replace {
  57   .replace,
  58   .c {
  59     prop: copy-paste-replace;
  60   }
  61 }
  62 .rep_ace:extend(.replace all) {}
  63
  64 .attributes {
  65   [data="test"] {
  66     extend: attributes;
  67   }
  68   .attribute-test {
  69     &:extend([data="test"] all);
  70   }
  71   [data] {
  72     extend: attributes2;
  73   }
  74   .attribute-test2 {
  75     &:extend([data] all); //you could argue it should match [data="test"]... not for now though...
  76   }
  77   @attr-data: "test3";
  78   [data=@{attr-data}] {
  79     extend: attributes2;
  80   }
  81   .attribute-test {
  82     &:extend([data="test3"] all);
  83   }
  84 }
  85
  86 .header {
  87   .header-nav {
  88     background: red;
  89     &:before {
  90       background: blue;
  91     }
  92   }
  93 }
  94
  95 .footer {
  96   .footer-nav {
  97     &:extend( .header .header-nav all );
  98   }
  99 }