[TxMt] "Smart" CSS Tricks (Modification)

[Jonathan Kinney]

I absolutely love this CSS(plus) bundle. Only thing is that one of
it's defaults (the new deceleration) sort of disables the tab triggers
of the original CSS bundle that gives you snippets for things like
margin or border or background etc. It at least makes them hard to get
back to. I'll show you a very simple mod to make the tab triggers for
the original CSS bundle more usable from within this bundle's
structure.

The CSS(plus) bundle formats the new deceleration like this:

;
${1:property}: ${2:value};$0

Which is all well and good if you know all of the options for the
particular CSS property you are going to be working with (margin or
whatever) but what if you wanted to be able to type 'margin' and then
-> tab to see the snippets from the CSS bundle for margin? You'd have
to do some fancy multiple tabbing and back arrowing to get the cursor
out of snippet mode and back to normal so you could hit tab after you
typed margin on the first property spot. Then when that snippet fills
in you have to forward delete the remainder of what CSS(Plus) put in
for the value. It would end up looking like this

#ID {
	margin: 20px;: value;
}

Fortunately with 1 small addition you can make the New Deceleration
snippet highlight the whole line when it's executed allowing you to
type say 'background' (replacing the highlighted selection) and then
hit tab -> showing you a list of values for the background property.
Then when you finish editing that hitting tab will display the next
line as originally intended but highlight it again so you may replace
it's selection and do the same.

To drill into each manually simply (like the original) requires only 1
more tab. It just depends on how well you know all your CSS properties
and values whether or not this would be more work or helpful.

The mod is here between the lines...

---------------------------------

;
${1:${2:property}: ${3:value};$0}

----------------------------------

Make sure you don't have a return after that last }. The cursor should
be blinking right after the } or you will get extra line feeds every
time this snippet executes which would make it not be a time saver
really at all...

Happy TextMating ;-)