@media rules in scss file not correctly scoped #81

Closed
smlombardi opened this Issue May 31, 2012 · 12 comments

Comments

Projects
None yet
5 participants

I can write a rule such as

#rightcol { width: percent(340,980); @media screen and (max-width: 768px) { display: none; } }

Which compiles fine, but there is no coloring on the @media line and its scope is

invalid.illegal meta.property-name.css meta.property-list.css source.scss

Anything new on this? Here is a sample:

For this code:
#leftcol { width: percent(620, 980); float: left; border-right: 2px solid #C8C8C8; @include single-box-shadow(rgba(50, 50, 50, 0.5), 10px,0px,10px,-8px); @media screen and (max-width: 768px) { width: percent(768, 768); @include single-box-shadow(none); border-right: none; } @media screen and (max-width: 320px) { width: percent(320, 320); @include single-box-shadow(none); border-right: none; } }

ismell commented Jun 25, 2012

+1

@ghost ghost assigned stephenway Oct 22, 2012

Collaborator

stephenway commented Oct 24, 2012

@smlombardi Rule @media has improved a bit but it is tricky, will still work on a solution, but for now it's partially highlighted.

wafiq commented Dec 5, 2012

+1

@stephenway stephenway closed this in e8ab974 Dec 6, 2012

ismell commented Dec 6, 2012

You are a RexExp master! Thanks!

Collaborator

stephenway commented Dec 6, 2012

No problem dude. Been a long time coming!

Leaves "and" flagged as an error. as in @media screen and ...

Collaborator

stephenway commented Dec 6, 2012

@smlombardi Sure your on the latest from today? Sometimes it helps to switch to another syntax then back to SCSS.

I deleted and re-installed, no longer an error. Can you please match the scopes of CSS.tmLanguage, though? For example the "and" is keyword.operator.logic.media.css There is a whole dict key in the CSS language file of all these new media rules.

I can do a pull on your language file and add it if you want.

Collaborator

stephenway commented Dec 7, 2012

Right, I've seen that in the CSS bundle, but "and" applies to multiple at-rules in Sass rather than CSS3 which it only applies to media. In the SCSS grammar file it is listed as so:

<key>logical_operators</key>
<dict>
  <key>match</key>
  <string>\s(\=\=|\!\=|\&lt;\=|\&gt;\=|\&lt;|\&gt;|not|or|and)\s</string>
  <key>name</key>
  <string>keyword.control.operator</string>
</dict>

So it is still an operator but available to these other at-rules at the same time.

Makes sense

On Friday, December 7, 2012, Stephen Way wrote:

Right, I've seen that in the CSS bundle, but "and" applies to multiple
at-rules in Sass rather than CSS3 which it only applies to media. In the
SCSS grammar file it is listed as so:

logical_operators
match
\s(==|!=|<=|>=|<|>|not|or|and)\s
name
keyword.control.operator

So it is still an operator but available to these other at-rules at the
same time.


Reply to this email directly or view it on GitHubhttps://github.com/kuroir/SCSS.tmbundle/issues/81#issuecomment-11119421.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment