[gtksourceview] css.lang: Reorganize test file

[Sébastien Wilmet <swilmet src gnome org>]

commit fa25d74cc15cfde83e16cd2a8b6fb70ede994c0b
Author: Jeffery To <jeffery to gmail com>
Date:   Thu May 24 03:12:12 2018 +0800

    css.lang: Reorganize test file
    
    This should make individual test cases easier to examine.

 tests/syntax-highlighting/file.css | 380 ++++++++++++++++++++++++++++---------
 1 file changed, 292 insertions(+), 88 deletions(-)
---
diff --git a/tests/syntax-highlighting/file.css b/tests/syntax-highlighting/file.css
index d73b7227..44f2aac9 100644
--- a/tests/syntax-highlighting/file.css
+++ b/tests/syntax-highlighting/file.css
@@ -1,144 +1,312 @@
 @charset "UTF-8";
+/* @charset must:
+   * be on the first line of the file
+   * appear at the start of the line
+   * be lowercase
+   * followed by one space
+   * have a double quoted encoding name (encoding is case insensitive)
+   * be terminated by semicolon
+*/
 
-@import URL("fineprint.css");
-@import 'custom.css';
-@import url('landscape.css') screen and (orientation: landscape), print;
 
-@namespace "http://www.w3.org/1999/xhtml";;
-@namespace svg url(http://www.w3.org/2000/svg);
+/*
+ * general
+ */
 
-@font-face {
-    font-family: MyHelvetica;
-    src: local("Helvetica Neue"),
-         local("HelveticaNeue"),
-         url(MgOpenModerna.ttf);
-    unicode-range: U+0025-00FF, U+4??;
+/* whitespace */
+#main
+{
+    color:aqua;
+    float: left!important;
+    margin  :  0  ;
+    width
+        :
+        100%
+        !
+        important
+        ;
 }
 
-@font-feature-values Font One {
-    @styleset {
-        nice-style: 12;
-    }
+/* case insensitivity */
+Body {
+    FONT: 12Px iTaLiC sans-SERIF;
 }
 
-#testID[lang|="zh"] {
-    font: 12px italic "Overpass", local-over-pass, sans-serif;
+
+/*
+ * selectors
+ */
+
+/* simple selectors */
+#testID,       /* id */
+.someclass,    /* class */
+div,           /* type */
+*,             /* universal */
+[lang|="zh"] { /* attribute */
+    color: black;
 }
 
-p + div {
-    color:aqua;
-    float: left!important;
+/* combinators */
+header + main, /* adjacent sibling */
+li ~ li,       /* general sibling */
+ul > li,       /* child */
+ul ul {        /* descendant */
+    color: blue;
 }
 
-.someclass,
-.otherclass {
-    font-size: 20px;
-    opacity: .5;
-    width: 100%;
+/* pseudo-elements */
+:after,
+::after,
+::placeholder,
+::selection {
+    color: green;
 }
 
-.nice-look {
-    font-variant-alternates: styleset(nice-style);
+/* pseudo-classes */
+:hover,
+:required,
+:lang(fr),
+:not(div#sidebar.fancy),
+:nth-child(n+1),
+:nth-last-child(-2n - 30),
+:nth-of-type(5),
+:nth-last-of-type(even) {
+    color: yellow;
+}
+
+/* pseudo-classes with invalid arguments */
+:not(div:before),         /* pseudo-element */
+:not(input::placeholder), /* pseudo-element */
+:not(p:not(:lang(en))),   /* nested :not */
+:nth-child(1.2n),         /* non-integer */
+:nth-child(.5),           /* non-integer */
+:nth-child(n+-1) {        /* number sign */
+    color: red;
 }
 
-#headline:after {
-    transform: scaleX(-1.75) rotate(+33.333e+3deg);
-    transition: transform 2s ease-in-out, color 400ms;
+/* namespace qualified */
+a,           /* type in default namespace */
+svg|a,       /* type in specified namespace */
+|a,          /* type in no namespace */
+*|a,         /* type in all namespaces (including no namespace) */
+svg|*,       /* universal */
+svg|[fill] { /* attribute */
+    color: white;
 }
 
-ul::before {}
 
-:lang(fr) > q {
-    quotes: '« ' ' »';
+/*
+ * basic data types
+ */
+
+#main {
+    /* angle */
+    transform: rotate(+33.333e+3deg);
+
+    /* color */
+    color: #f00;
+    color: #f00f; /* #rgba */
+    color: #ff0000;
+    color: #ff0000ff; /* #rrggbbaa */
+    color: red;
+    color: lightgoldenrodyellow;
+    color: rebeccapurple;
+    color: currentColor;
+
+    /* freqency (not currently used for any property) */
+    content: 44.1kHz;
+
+    /* integer */
+    z-index: +255;
+    z-index: -1;
+
+    /* length */
+    width: 10px;
+    width: 10.5rem;
+    width: -10e-2vw;
+
+    /* number */
+    opacity: .5;
+    opacity: 0.3333;
+    opacity: 1;
+    opacity: 2e-34;
+
+    /* percentage */
+    width: 100%;
+
+    /* string */
+    content: "double quoted";
+    content: 'single quoted';
+
+    /* time */
+    transition-duration: .4s;
+    transition-duration: 400ms;
+
+    /* unicode range */
+    unicode-range: U+0025-00FF;
+    unicode-range: U+4??; /* wildcard range */
 }
 
-p:not(.fancy) {
+/* ratio */
+@media (min-aspect-ratio: 16/9) {}
+
+/* resolution */
+@media (min-resolution: +2.54dpcm) {}
+
+
+/*
+ * identifiers
+ */
+
+/* leading hyphens */
+#-here.-there,
+#-- .--everywhere { /* two hyphens: https://stackoverflow.com/a/30822662 */
+    color: blue;
+}
+
+/* non-ASCII */
+#español,
+#你好,
+.❤♫ {
     color: green;
 }
 
-body :not(p) {
-    text-decoration: underline;
+/* invalid identifiers */
+#1id,      /* starts with digit */
+.-2class { /* starts with hyphen digit */
+    color: maroon;
 }
 
-li:nth-child(2n+1) {}
 
-link:hover {}
+/*
+ * escaping
+ */
+
+/* selectors */
+#\..\+\ space\@\>,                            /* special character escape */
+#\E9 dition .\0000E9dition .motion_\e9motion, /* Unicode character escape */
+.\e33 div,                                    /* trailing space terminates Unicode character escape */
+.\e33  div,                                   /* extra space to denote separate tokens */
+.\31 23 {                                     /* escape leading digit of identifier */
+
+    /* property value */
+    content: "\E9 dition \
+              \"\0000E9dition\" \
+              \e9motion";
 
-INPUT::PLACEHOLDER {
-    COLOR: REBECCAPURPLE;
+    /* function name */
+    background: \u\72\l(image.png);
 }
 
-input[type="number"]::-webkit-outer-spin-button,
-input[type="number"]::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-    margin: 0;
+
+/*
+ * functions
+ */
+
+#main {
+    /* url */
+    background: url("image.svg");
+
+    /* function argument keywords */
+    background-image: linear-gradient(to left top, #fff, blue);
+    grid-template-columns: repeat(2, minmax(max-content, 300px) 1fr) 100px;
 }
 
-input[type=number] {
-    -moz-appearance: textfield;
+
+/*
+ * style properties
+ */
+
+#main {
+    /* svg */
+    fill: url(#pattern);
+    text-rendering: optimizeLegibility;
+
+    /* css3 */
+    font-variant-east-asian: jis04;
+    size: letter;
+    transition-timing-function: ease-in;
+
+    /* animatable */
+    transition-property: height, font-size, visibility;
+}
+
+/*
+ * modifiers
+ */
+body {
+    background: pink !important;
 }
 
-svg|a {}
-*|a {}
 
-#-- .--hello-world, /* two hyphens: https://stackoverflow.com/a/30822662 */
-.-❤#-español.♫#你好, /* leading hyphen, non-ASCII */
-span.\. + .\+\ space\@\>, /* special character escape */
-div#\E9 dition .\0000E9dition .motion_\e9motion, /* Unicode character escape */
-.\e33 div, /* trailing space terminates Unicode character escape */
-.\e33  div, /* need extra space to denote separate tokens */
-#-notvendor-specific,
-.\31 23 {
-    background: \u\72\l("\E9 dition \"\0000E9dition\" \e9motion\
-                         .png");
+/*
+ * media queries
+ */
+
+@media screen, (orientation: portrait) {}
+@media not (print and (min-monochrome: 16) and (color)) {}
+@media only screen {} @media not print {}
+
+
+/*
+ * at-rules
+ */
+
+/* @font-face */
+@font-face {
+    font-family: MyHelvetica;
+    src: local("Helvetica Neue"),
+         local("HelveticaNeue"),
+         url(MgOpenModerna.ttf);
 }
 
-@-webkit-keyframes myanim {
-    from { opacity: 0.0; }
-    50%  { opacity: 0.5; }
-    to   { opacity: 1.0; }
+/* @font-feature-values */
+@font-feature-values Font One {
+    @styleset {
+        nice-style: 12;
+    }
+}
+.nice-look {
+    font-variant-alternates: styleset(nice-style);
 }
 
+/* @import */
+@import URL("fineprint.css");
+@import 'custom.css';
+@import url('landscape.css') screen and (orientation: landscape), print;
+
+/* @keyframes */
 @keyframes myanim {
     from { opacity: 0.0; }
     50%  { opacity: 0.5; }
     to   { opacity: 1.0; }
 }
 
+/* @media */
 @media all {
-    * ~ ul {
-        background-image: -webkit-linear-gradient(to left top, #fff, blue);
-        background-image:         linear-gradient(to left top, #fff, blue);
-        padding: 10VW;
+    body {
+        background: gray;
     }
-    @import 'custom.css';
     @media screen, (orientation: portrait) {
-        .heading > .news {
-            background-image: url(image.png);
-        }
-        .grid {
-            grid-template-columns: repeat(2, minmax(max-content, 300px) 1fr) 100px;
-            -ms-overflow-style: -ms-autohiding-scrollbar;
-        }
-    }
-    @media not (print and (min-monochrome: 16) and (color)) {
         body {
-            background-color: #FFFFFF;
-            border-color: currentColor;
-            color: #000;
+            background: grey;
         }
     }
-    @media only screen {} @media not print {}
 }
 
-@media (min-resolution: +2.54dpcm) {}
-
-@media (min-aspect-ratio: 16/9) {}
+/* @namespace */
+@namespace "http://www.w3.org/1999/xhtml";;
+@namespace svg url(http://www.w3.org/2000/svg);
 
-@page toc, index:first:left, :blank {
+/* @page */
+@page {
     bleed: 1cm;
+}
+@page toc, :blank {
     margin: 2cm;
     marks: crop cross;
+}
+@page index:left {
     size: A4;
 
     @top-right {
@@ -146,17 +314,53 @@ div#\E9 dition .\0000E9dition .motion_\e9motion, /* Unicode character escape */
     }
 }
 
+/* @supports */
 @supports (animation-name: test) {
     @keyframes 'my-complicated-animation' {
-        0%      {}
-        33.333% {}
-        66.667% {}
-        100%    {}
+        0%   { width: 0; }
+        100% { width: 100%; }
     }
 }
 
+
+/*
+ * vendor-specific extensions
+ */
+
+/* pseudo-elements */
+input[type="number"]::-webkit-outer-spin-button,
+input[type="number"]::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+}
+input[type="number"] {
+    -moz-appearance: textfield;
+}
+
+/* pseudo-classes */
+#page:-moz-full-screen,
+#page:-ms-fullscreen,
+#page:-webkit-full-screen {
+    background: silver;
+}
+
+/* functions */
+.footer {
+    background-image: -webkit-linear-gradient(to left top, #fff, blue);
+}
+
+/* style properties */
+#sidebar {
+    -ms-overflow-style: -ms-autohiding-scrollbar;
+}
 @supports not ((text-align-last: justify) or (-moz-text-align-last: justify)) {
     body {
         text-align: justify;
     }
 }
+
+/* at-rules */
+@-webkit-keyframes myanim {
+    from { opacity: 0.0; }
+    50%  { opacity: 0.5; }
+    to   { opacity: 1.0; }
+}