Linux SRV-16 6.18.44-paas #1 SMP PREEMPT_DYNAMIC Thu Aug 13 10:08:12 UTC 2026 x86_64
/srv/data/web/vhosts/www.shinegis.mu/htdocs/functions/scssphp/tests/inputs/
/srv/data/web/vhosts/www.shinegis.mu/htdocs/functions/scssphp/tests/inputs/selectors.scss
 * { color: blue; }
E { color: blue; }

E:not(:link) { color: blue; }
E:not(:link):not(:visited) { color: blue; }
E:not(:link, :visited) { color: blue; }
E:matches(:hover, :focus) { color: blue; }

E.warning { color: blue; }
E#id { color: blue; }
E[foo] { color: blue; }
E[foo="barbar"] { color: blue; }
E[foo="barbar" i] { color: blue; }
E[foo~="hello#$@%@$#^"] { color: blue; }
E[foo^="color: green;"] { color: blue; }
E[foo$="239023"] { color: blue; }
E[foo*="29302"] { color: blue; }
E[foo|="239032"] { color: blue; }

[foo] { color: blue; }
[foo] .helloWorld { color: blue; }
[foo].helloWorld { color: blue; }
[foo="barbar"] { color: blue; }
[foo~="hello#$@%@$#^"] { color: blue; }
[foo^="color: green;"] { color: blue; }
[foo$="239023"] { color: blue; }
[foo*="29302"] { color: blue; }
[foo|="239032"] { color: blue; }

E:dir(ltr) { color: blue; }
E:lang(en) { color: blue; }
E:lang(en, fr) { color: blue; }

E:any-link { color: blue; }
E:link { color: blue; }
E:visited { color: blue; }
E:local-link { color: blue; }
E:local-link(0) { color: red; }
E:local-link(1) { color: white; }
E:local-link(2) { color: red; }
E:target { color: blue; }
E:scope { color: blue; }

E:current { color: blue; }
E:current(:link) { color: blue; }
E:past { color: blue; }
E:future { color: blue; }

E:active { color: blue; }
E:hover { color: blue; }
E:focus { color: blue; }
E:enabled { color: blue; }
E:disabled { color: blue; }
E:indeterminate { color: blue; }
E:default { color: blue; }
E:in-range { color: blue; }
E:out-of-range { color: blue; }
E:required { color: blue; }
E:optional { color: blue; }
E:read-only { color: blue; }
E:read-write { color: blue; }

E:root { color: blue; }
E:empty { color: blue; }
E:first-child { color: blue; }
E:nth-child(odd) { color: blue; }
E:nth-child(2n+1) { color: blue; }
E:nth-child(5) { color: blue; }
E:last-child { color: blue; }
E:nth-last-child(-n+2) { color: blue; }
E:only-child { color: blue; }
E:first-of-type { color: blue; }
E:nth-of-type(2n) { color: blue; }
E:last-of-type { color: blue; }
E:nth-last-of-type(n) { color: blue; }
E:only-of-type { color: blue; }
E:nth-match(odd) { color: blue; }
E:nth-last-match(odd) { color: blue; }

E:column(n) { color: blue; }
E:nth-column(n) { color: blue; }
E:nth-last-column(n) { color: blue; }

E F { color: blue; }
E > F { color: blue; }
E + F { color: blue; }
E ~ F { color: blue; }

// namespaces
[foo|att=val] { color: blue }
[*|att] { color: yellow }
[att] { color: green }

// CSS2.1
E::first-line { color: blue; }
E::first-letter { color: blue; }
E::before { color: blue; }
E::after { color: blue; }

// CSS3 UI (at risk)
E::choices { color: blue; }
E::value { color: blue; }
E::repeat-index { color: blue; }
E::repeat-item { color: blue; }

E:first { color: blue; }
E:first-line { color: blue; }
E:first-letter { color: blue; }
E:before{ color: blue; }
E:after { color: blue; }
E:checked { color: blue; }
E:invalid { color: blue; }
E:valid { color: blue; }
E:left { color: blue; }
E:right { color: blue; }

// -moz experimental
E:any(ol) { color: blue; }
E::selection { color: blue; }

// one of these is nested property,
// the other is a css block.
div {
  font:something {
    size: 30em;
  }

  font: something {
    size: 30em;
  }

}

// self selector

.something {
    &.world {
        color: blue;
    }

    & .mold {
        height: 200px;
    }

    .dog & {
        color: blue;
    }
}

.simple {
    .dad & .wolf {
        color: blue;
    }

    &.rad.bad {
        color: blue;
    }

}

div {
    .something & .what {
        &.world {
            color: blue;
        }
    }
}

div {
    &.foo & {
        color: blue;
    }
    & + & {
        color: green;
    }
}

.main, div {
    .message div {
        .title {
            .nice-fonts & {
                font-size: 24px;
            }
        }
    }
}

$name: escape;
.#{$name}\% {
    color: red;
}

.escape-plan\% {
    color: green;
}

.element {
  #{".one, .two"} {
    property: value;
  }
}

@function H($el:false)
{
  $h: ();
    $newList: ();
    @each $ord in 1,2,3,4,5,6 {
        @if $el {
            $h: h#{$ord $el};
        } @else {
            $h: h#{$ord};
        }
        $newList: append($newList, $h, comma);
    }
    @return $newList;
}

@mixin H($prop, $val, $el:false) {
    $list: H($el);
    #{$list} {
        #{$prop}: $val;
    }
}

#secondary {
    @include H(color,  #e6e6e6);
}

@function tester() {
    @return (foo, bar);
}
.test   {
    #{tester()} {
        border: 1px dashed red;
    }
}

$span: 'span';
$p: 'p';
$div: 'div';

$all: $span, $p, $div;

#{$all} {
    a {
        color: red;
    }
}

.parent {
    $sub: unquote(".child");
    $self: unquote("&.self2");
    &.self { // works perfectly
        content: "should match .parent.self";
    }
    #{$sub} { // works as it should
        content: "should match .parent .child";
    }
    #{$self} { // does not work (see below)
        content: "should match .parent.self2";
    }
}

.parent {
    $selfMultiple: unquote("&.self1, &.self2");
    #{$selfMultiple} {
        content: "should match .parent.self1, .parent.self2";
    }

    $trailingSelf: unquote(".self1 &");
    #{$trailingSelf} {
        content: "should match .self1 .parent";
    }

    $doubleSelf: unquote("& + &");
    #{$doubleSelf} {
        content: "should match .parent + .parent";
    }
}

// combinatorial self
ul, ol {
    & & {
        display: block;
    }
}

// unicode
.👤  {
  display: inline-block;
}

.❮ {
  display:inline;
  content:'↦';
}

// interpolated
$selector: " ul li";
$end: ' ';
#{$selector} a .tocnumber #{$end} {
        min-width: 100%;
}


// escaped
.\31u\$ {clear: left;}
.\31 u\$ {clear: left;}
.\31u\24 {  clear: right;}
.\31 u\24 {  clear: right;}
.a\31 u\24 {  clear: both;}
$x: '\\28' + 'xlarge' + '\\29';
.\31 2u#{$x}, .\31 2u\24#{$x} { width: 100%; clear: none; margin-left: 0; }