Sublime Forum

Zen Coding ( CSS Snippets )

#124

Hello,

I love this plugin;

However, I have a problem using it with the Twig bundle.

When inside a var declaration, the “.” (dot) triggers class=""

I.e. if I want to type : {{ foo.bar }}

I get : {{foo class=""}}

Thank you :smile:

0 Likes

#125

Amazing plugin!

How do you get it working with SCSS?

I have the file named as filename.scss, I have installed the SCSS textmate syntax file and added it to sublime, and have that syntax selected.

When I try something like “pos”, it says there are no completions. Works fine on normal CSS.

0 Likes

#126

Yep, that’s the SCSS tm bundle I’m using.

This is what the contents of my SCSS folder in my packages directory looks like:

CSS Zen.tmLanguage
CSS Zen.tmLanguage.cache
SCSS.tmLanguage
SCSS.tmLanguage.cache
source.textmate

I assume I’m correct in having SCSS selected as the syntax rather than CSS Zen.

Edit:

Argh, I was trying to expand an invalid snippet :frowning:

Are there any guides anywhere on zencoding for CSS?

0 Likes

#127

Sorry, didn’t get a chance to fully test and get back to you - had a big project to finish last week and was presenting at a conference, so 'twas a bit hectic. Yes, it seems to be working, but there is some unexpected behaviour that I don’t quite understand. In short, if I type one letter of a value, then hit Ctrl-Space, a dropdown list of completions will appear, but the completion I’m after doesn’t appear. E.g., I type display: b[Ctrl-Space] and would expect ‘block’ to appear in the list, but it doesn’t. If I type a few more chars, e.g, display: blo[Ctrl-Space], the completion appears. I’ve done a screencast to demonstrate: screenr.com/GC2s

Update: If I hit Ctrl-Space directly after the colon, I get a correct list of completions.

I thought we might have some problems with the nested selections in SCSS, but again, things seem to work pretty much apart from this funkyness: screenr.com/FC2s

In that case, I’m puzzled as to why I get two identical display completions. Ah, perhaps it’s because it’s using the ‘display’ present in the document and the ‘display’ present in your Zen internals? Seems like it should collapse identical entries.

Finally, is there any way of getting it to insert a space after the colon automatically when you do a value completion? I.e. If I type display:[Ctrl-Space] and choose, say, :inline-block from the list, I get this:

display:inline-block;

But what I want is this (note the space after the colon):

display: inline-block;

Possible?

0 Likes

#128

Yes. Textmate uses environment variables for this sort of thing. In this case, you’d set the var to a space. That space would get injected if the var exists, and not if it doesn’t exist. In E you could set the vars on a per project basis. Not sure if you could do the same with TM. It always struck me as quite an elegant way of doing it, although it was a bit opaque if you didn’t know the trick of setting the env var.

Thanks for the rest of the info. I’ll have to read and re-read to digest it all I think. :smile:

0 Likes

#129

Hi sublimator,

Don’t use ZenCoding but it look like this topic relate to an issue in it:
https://forum.sublimetext.com/t/bug-enter-key-problem/1966/1#p11058

0 Likes

#130

How do you clear the contents when using expand with abbreviation. Currently right now what is happening is something like this:
I have some sample text

Removeable Screen Walls
Sets up in minutes
Straight leg construction
No tools required
Heavy duty polyester fabric is water repellent, UV resistant and fade resistant
Sturdy, steel frame
Specifications:
Size: 10’ x 10’ x 115"
Area: 100 sq.ft.

I want to make this an unordered list so I select it and push Ctrl+Alt+Enter and input
ul#desc>li* it formats it correctly, however when I go to format another selection by pushing Ctrl+Alt+Enter

the company that truly understands the quality level demanded by those who take the outdoors seriously, whether it’s a family gathering in the park, a fishing trip by the river

it starts with what was last in the enter haiku field (unordered list) so that I must backspace and change that to the new (paragraph). So my question is how do you clear the field after each input? Or is this by design?
Because I feel I must be doing this wrong.

Using the latest zen coding
WIndows Build 2081

0 Likes

#131

Ctrl+u clears the entry field.

0 Likes

#132

[quote=“sublimator”]Good point, in general you are more likely to want to input a completely new entry yeah? It would be better to have the input to default to an empty string and have something like ctrl+(up|down) cycle through the history.

Bad design.[/quote]

Ok just thought it was me, will ctrl+u the go around

0 Likes

#133

I’ll be happy to help if I can! Just email me with your questions.

0 Likes

#134

Cool and awesome i like that… Great idea… :laughing:

0 Likes

#135

[quote=“sublimator”]

Ok just thought it was me, will ctrl+u the go around

I made it default to an empty string. When I get some time I’ll get around to adding some up/down input history bindings.[/quote]

Thanks for making the change. Will give the new plugin a test.

0 Likes

#136

Hm, after last update wrapping didn’t work for me anymore. But when I try to use wrapping with ZenCoding, undo is broken and do something very ugly :frowning:

0 Likes

#137

Just did a quick test and wrapping works good.
Tomorrow I will test more intensively.
Sublimator, thank you very much!

0 Likes

#138

Now I have not problems with wrapping and undo. But now ZenCoding works not as expected :smile: For example, Enter Koan make all code inline (not formatted) and didn’t place caret to href="|".

0 Likes

#139

http://img26.imageshack.us/img26/5954/errgw.png

See that. I think this is caused by Zen Coding.

Sometimes when i click Preferences … i get this.

I use dev 2096 x64 on Windows 7 but this happens from other dev builds and it still here :smile:

0 Likes

#140

And the problem is caused by zen or by the editor?

0 Likes

#141

Yes. I’ll try tomorrow

0 Likes

#142

It’s almost certainly an issue with Subilme Text 2 itself

0 Likes

#143

A bug has come to light in Zen for me. I think I’m using the most up-to-date version of Zen, and I’m on b2098 of ST2. I think the bug’s been around as long as I’ve known Zen on ST2. Anyway on to the bug:

The main bug here is that in PHP, if I place the caret in the middle of some PHP and hit the alt+shift+w command, any variable references (e.g., ‘$variable’) inside the PHP disappear. My assumption is that it has something to do with the dollar sign followed by word characters means something special which is somehow being clobbered by Zen.

So say you had this HTML:

<span><?php echo 'hi'; ?></span>
<span><?php echo $variable; ?></span>
<span><?php echo $object->property; ?></span>

After wrapping each line individually (for simplicity) you end up with:

<span><a href=""><?php echo 'hi'; ?></a></span>
<span><a href=""><?php echo ; ?></a></span>
<span><a href=""><?php echo ->property; ?></a></span>

Another thing I’m experiencing which may or may not be a bug is that if these PHP snippets weren’t individually wrapped in HTML tags (in this case span but it can be anything in my testing) it treats the three lines of PHP as a single block and therefore will wrap the ‘a’ (in this case) around the three lines as a whole rather than each line getting its own ‘a’. Now, I have a feeling this may be how the plugin is supposed to work, as it will never be able to predict whether an HTML author means a list or a non-breaking paragraph (the normal HTML whitespace rules) by multiple lines with no separating tags. Having said that, I think that for the most part, the preferred behaviour would be broken lines. I know this can be done by selecting multiple lines, pressing c+s+l to split lines, and then Zenning, but I think that default behaviour for Zen really could be straight select then Zen treats the lines as separate entities. I bet that >90% of the time people do that they mean it as if the lines are separate. But feel free to correct me, other developers.

0 Likes