[gtksourceview] css.lang: Move media queries and @media call into separate contexts

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

commit f91ea476ceade29e8ee6a44b938cef1225b16ca8
Author: Jeffery To <jeffery to gmail com>
Date:   Thu May 10 19:51:46 2018 +0800

    css.lang: Move media queries and @media call into separate contexts
    
    This moves the media query and at-media-call contexts into top-level
    contexts.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=796130

 data/language-specs/css.lang       |   89 +++++++++++++++++++++++------------
 tests/syntax-highlighting/file.css |    8 ++--
 2 files changed, 62 insertions(+), 35 deletions(-)
---
diff --git a/data/language-specs/css.lang b/data/language-specs/css.lang
index 7a70c6d..f1002ea 100644
--- a/data/language-specs/css.lang
+++ b/data/language-specs/css.lang
@@ -1361,6 +1361,53 @@
       </include>
     </context>
 
+    <context id="media-query-operators" style-ref="at-rules">
+      <keyword>and</keyword>
+      <keyword>not</keyword>
+      <keyword>only</keyword>
+    </context>
+
+    <context id="media-types" style-ref="keyword">
+      <keyword>all</keyword>
+      <keyword>print</keyword>
+      <keyword>screen</keyword>
+      <keyword>speech</keyword>
+    </context>
+
+    <context id="media-feature-test">
+      <start>\(</start>
+      <end>\)</end>
+      <include>
+        <context ref="def:c-like-comment-multiline"/>
+        <context ref="def:c-like-close-comment-outside-comment"/>
+        <context ref="media-queries"/>
+        <context ref="css3-media-features"/>
+        <context ref="css3-media-feature-values"/>
+        <context ref="hexadecimal-color"/>
+        <context ref="resolution"/>
+        <context ref="dimension"/>
+        <context ref="percentage"/>
+        <context ref="ratio"/>
+        <context ref="number"/>
+      </include>
+    </context>
+
+    <context id="media-queries">
+      <include>
+        <context ref="media-query-operators"/>
+        <context ref="media-types"/>
+        <context ref="media-feature-test"/>
+      </include>
+    </context>
+
+    <context id="at-rule-general-block" end-parent="true">
+      <start>\{</start>
+      <end>\}</end>
+      <include>
+        <context ref="css"/>
+      </include>
+    </context>
+
     <context id="keyframe-selector" style-ref="function">
       <keyword>from</keyword>
       <keyword>to</keyword>
@@ -1392,6 +1439,16 @@
       </include>
     </context>
 
+    <context id="at-media-call">
+      <start>(?&lt;=@media)</start>
+      <include>
+        <context ref="def:c-like-comment-multiline"/>
+        <context ref="def:c-like-close-comment-outside-comment"/>
+        <context ref="media-queries"/>
+        <context ref="at-rule-general-block"/>
+      </include>
+    </context>
+
     <context id="punctuators" style-ref="others-3">
       <match>[{}();,]</match>
     </context>
@@ -1451,37 +1508,7 @@
         <context ref="selector-class"/>
         <context ref="selector-tagname"/>
         <context ref="at-keyframes-call"/>
-        <context id="at-media-call">
-          <start>(?&lt;=(@media))</start>
-          <end>\{</end>
-          <include>
-            <context id="media-keywords" style-ref="at-rules">
-              <keyword>and</keyword>
-              <keyword>not</keyword>
-              <keyword>only</keyword>
-            </context>
-            <context id="media-types" style-ref="keyword">
-              <keyword>all</keyword>
-              <keyword>print</keyword>
-              <keyword>screen</keyword>
-              <keyword>speech</keyword>
-            </context>
-            <context id="at-media-arguments">
-              <start>\(</start>
-              <end>\)</end>
-              <include>
-                <context ref="css3-media-features"/>
-                <context ref="css3-media-feature-values"/>
-                <context ref="hexadecimal-color"/>
-                <context ref="resolution"/>
-                <context ref="dimension"/>
-                <context ref="percentage"/>
-                <context ref="ratio"/>
-                <context ref="number"/>
-              </include>
-            </context>
-          </include>
-        </context>
+        <context ref="at-media-call"/>
       </include>
     </context>
 
diff --git a/tests/syntax-highlighting/file.css b/tests/syntax-highlighting/file.css
index e428042..d3a1773 100644
--- a/tests/syntax-highlighting/file.css
+++ b/tests/syntax-highlighting/file.css
@@ -7,7 +7,7 @@
 }
 
 #testID[lang|="zh"] {
-    font: 12px italic "Overpass";
+    font: 12px italic "Overpass", sans-serif;
 }
 
 p + div {
@@ -78,7 +78,7 @@ div#\E9 dition .\0000E9dition .motion_\e9motion, /* Unicode character escape */
         background-image:         linear-gradient(to left top, #fff, blue);
         padding: 10VW;
     }
-    @media screen and (orientation: portrait) {
+    @media screen, (orientation: portrait) {
         .heading > .news {
             background-image: url(image.png);
         }
@@ -87,14 +87,14 @@ div#\E9 dition .\0000E9dition .motion_\e9motion, /* Unicode character escape */
             -ms-overflow-style: -ms-autohiding-scrollbar;
         }
     }
-    @media print and (min-monochrome: 16) {
+    @media not (print and (min-monochrome: 16) and (color)) {
         body {
             background-color: #FFFFFF;
             border-color: currentColor;
             color: #000;
         }
     }
-    @media screen {} @media print {}
+    @media only screen {} @media not print {}
 }
 
 @media (min-resolution: +2.54dpcm) {}