Skip to content

Commit

Permalink
add custom media queries highlight, add tests for media queries level…
Browse files Browse the repository at this point in the history 
… 4 draft
  • Loading branch information
@i-akhmadullin
i-akhmadullin committed Jul 15, 2014
1 parent 14e2c8d commit b1ba738
Show file tree
Hide file tree
Showing 4 changed files with 135 additions and 0 deletions.
50 changes: 50 additions & 0 deletions CSS3.tmLanguage
View file
Original file line number Diff line number Diff line change
Expand Up @@ -246,6 +246,56 @@
</dict>
</array>
</dict>
<dict>
<key>begin</key>
<string>(?=\s*@custom-media\s*.*?)</string>
<key>end</key>
<string>\s*;</string>
<key>endCaptures</key>
<dict>
<key>1</key>
<dict>
<key>name</key>
<string>punctuation.section.property-list.css</string>
</dict>
</dict>
<key>patterns</key>
<array>
<dict>
<key>begin</key>
<string>\s*((@)custom-media)(?=.*?)</string>
<key>beginCaptures</key>
<dict>
<key>1</key>
<dict>
<key>name</key>
<string>keyword.control.at-rule.custom-media.css</string>
</dict>
<key>2</key>
<dict>
<key>name</key>
<string>punctuation.definition.keyword.css</string>
</dict>
<key>3</key>
<dict>
<key>name</key>
<string>support.constant.custom-media.css</string>
</dict>
</dict>
<key>end</key>
<string>\s*(?=;)</string>
<key>name</key>
<string>meta.at-rule.custom-media.css</string>
<key>patterns</key>
<array>
<dict>
<key>include</key>
<string>#media-query-list</string>
</dict>
</array>
</dict>
</array>
</dict>
<dict>
<key>begin</key>
<string>(?=\s*@(-webkit-|-moz-|-o-)?keyframes\s*.*?)</string>
Expand Down
1 change: 1 addition & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -232,6 +232,7 @@ progid:DXImageTransform.Microsoft.Shadow
#### At-rules
```
@keyframes (without keyframe selectors atm)
@custom-media (custom media queries)
```

#### Tags
Expand Down
50 changes: 50 additions & 0 deletions src/patterns/patterns.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -226,6 +226,56 @@
</dict>
</array>
</dict>
<dict>
<key>begin</key>
<string>(?=\s*@custom-media\s*.*?)</string>
<key>end</key>
<string>\s*;</string>
<key>endCaptures</key>
<dict>
<key>1</key>
<dict>
<key>name</key>
<string>punctuation.section.property-list.css</string>
</dict>
</dict>
<key>patterns</key>
<array>
<dict>
<key>begin</key>
<string>\s*((@)custom-media)(?=.*?)</string>
<key>beginCaptures</key>
<dict>
<key>1</key>
<dict>
<key>name</key>
<string>keyword.control.at-rule.custom-media.css</string>
</dict>
<key>2</key>
<dict>
<key>name</key>
<string>punctuation.definition.keyword.css</string>
</dict>
<key>3</key>
<dict>
<key>name</key>
<string>support.constant.custom-media.css</string>
</dict>
</dict>
<key>end</key>
<string>\s*;</string>
<key>name</key>
<string>meta.at-rule.custom-media.css</string>
<key>patterns</key>
<array>
<dict>
<key>include</key>
<string>#media-query-list</string>
</dict>
</array>
</dict>
</array>
</dict>
<dict>
<key>begin</key>
<string>(?=\s*@(-webkit-|-moz-|-o-)?keyframes\s*.*?)</string>
Expand Down
34 changes: 34 additions & 0 deletions test.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -479,3 +479,37 @@ col.selected || td,
grid-auto-flow: stack;
grid-auto-rows: auto;
}

/* http://dev.w3.org/csswg/mediaqueries/ */
@custom-media --narrow-window (max-width: 30em);
@media (--narrow-window) and (script) { ... }

@media (device-width < 800px) { ... }
@media (resolution >= 2dppx) { ... }
@media (update-frequency: none) { ... }
@media (update-frequency: slow) { ... }
@media (update-frequency: normal) { ... }
@media (overflow-block: none) { ... }
@media (overflow-block: scroll) { ... }
@media (overflow-block: optional-paged) { ... }
@media (overflow-block: paged) { ... }
@media (overflow-inline: none) { ... }
@media (overflow-inline: scroll) { ... }
@media (color >= 8) { ... }
@media (color-index >= 1) { ... }
@media (pointer:coarse) { ... }
@media (pointer:fine) {
@media (any-pointer:coarse) { ... }
@media (any-pointer:fine) {

@media (hover:hover) { ... }
@media (hover:on-demand) { ... }
@media (any-hover:hover) { ... }
@media (any-hover:on-demand) { ... }

@media (light-level: normal) { ... }
@media (light-level: dim) { ... }
@media (light-level: washed) { ... }

@media (scripting:initial-only) { ... }
@media (scripting:enabled) { ... }

0 comments on commit b1ba738

Please sign in to comment.