What is this odd SASS property syntax? - ruby

I'm working with some SASS code, written for ruby-sass v3.2. In some of the stylesheets, property declarations are written like:
.something
:height 10em
:width 100%
:font-size 1.5em
This compiles and appears to be valid, but I can't find reference to it anywhere. Is this just a quirk of Ruby parsing them as symbols, or something in SASS I've never seen before?

I had to use Wayback Machine to find the "official" information, and it seems that it is just the old SASS way to write a declaration:
Property Syntax
The indented syntax supports two ways of declaring CSS
properties. The first is just like CSS, except without the semicolon.
The second, however, places the colon before the property name. For
example:
#main
:color blue
:font-size 0.3em
By default, both ways may be used. However, the :property_syntax option may be used to specify that
only one property syntax is allowed.
I also found some others mentions of this syntax here:
Using colon syntax and variables in Sass
Convert Sass stylesheets from the old colon syntax
Deprecate old-style property syntax
Edit : there is also an online reference about this here.

Related

does highlight.js check syntax as well

In addition to highlighting syntax (which I suppose means indentation, color etc.), does highlight.js check syntax as well. For eg. if I write the following code in javascript
function {
}
Would highlight.js show error that the function name is missing. I know that ace.js does this. I want to replace ace.js with highlight.js.
No, Highlight.js does not check syntax, it only highlights code (with pattern matching). Often incorrect syntax is simply ignored, or could cause your code to be highlighted funny.
It MIGHT be possible to write a 3rd party grammar that did have some ability to detect (and highlight) syntax errors, but this is not something the core library is interested in doing.
[Disclaim: I'm the current Highlight.js maintainer.]

Style switching by interpolating a variable value

I'm trying to create a variable that will switch styles by changing it's value.
something like:
$style: 1;
$color1: #f60;
$color2: #096;
$color: $color#{style};
.a{
color: $color;
}
Unfortunately the result is: Undefined variable: "$color".
Could someone explain to me why this doesn't work?
Seems like this feature got added in SASS 3.3
When we released Sass 3.02, we added support for SCSS, which meant we had to actually parse all the selectors in the document. This meant that you couldn't just plop the parent selector, &, anywhere in a selector. Overall this was an improvement: it caught more errors and encouraged users to write more flexible mixins.
Unfortunately, it also made one important use-case harder. With the rise in popularity of BEM, OOCSS, and SMACSS, people became more and more interested in adding suffixes to classes. When using Sass, they wanted to write mixins to do this, and the restrictions on & made that very hard to do.
In Sass 3.3, we're loosening these restrictions. You can now write &-suffix (or &_suffix, or even &suffix if you really want) and Sass will make it work. If this fails to apply—for example, if & is * —Sass will print a helpful error message.
source

Does Emacs support font-lock for Ruby 2.0 percent literals?

How can I fix ruby 2.0 symbol array syntax in Emacs?
In standard ruby-mode, it displays symbol arrays in default color. In enh-ruby-mode, a definition of symbol array breaks my color theme entirely.
ruby-mode is currently not capable of rendering the array syntax correctly.
If you really are concerned about that, consider using the highlight-escape-sequences package, available through MELPA.
Edit The same author (Dmitry Gutov) seems to have made a commit on ruby-mode, fixing the syntax-highlighting for array of symbols, as we can see here. But that change is not available yet, so I guess we need to wait for Emacs 24.4...

Ruby's :yields:

I was looking through some tab-completions that were automatically set up for my editor, and I found one where y was mapped to:
:yields: arguments
What is this syntax called, when, where, how and for what is this used?
This is one of the many directives supported by the RDoc documentation tool. It is used to document the arguments that get passed to a block.

Sass mixin does not work

=rounded(!rad)
:-moz-border-radius = !rad
:-webkit-border-radius = !rad
:border-radius = !rad
I have this mixin defined in a .sass file. When I try to compile it with sass style.sass style2.css, I get this error:
Syntax error on line 2: Undefined constant: "!rad".
I've looked through the docs and can't find what I am doing wrong. If I reduce the sass file to just this section, the error still happens. I am not using it with Ruby/
That mixin looks absolutely correct to me. Is that in style.sass or style2.sass? I'm guessing you're defining it in one, and using it in the other.The first thing to check would be that when you're mixing it in, you're not forgetting to pass an argument. For instance:
.round_div
+round // will not work
Instead of
.round_div
+round(1em) // should work
If that's not the case, try updating Sass. The ability to pass arguments to mixins was added in 2.2.0.
I've got a gist a put up a few days ago for a slightly more complex version of the same mixin. It's working fine for me as long as I mix it in with an argument, and have a new enough version of Sass.

Resources