I've just started using SASS with Sublime Text 2 and it's great. I'm using the SCSS syntax.
However, I've been using Emmet and it does not seem to work with SCSS well when using tab (for me). With Emmet, I usually write: float and press tab, it converts it to float;. This is only after I made the following change to the preferences, for SCSS:
{
"preferences": {
"sass.propertyEnd": ";"
}
}
However, I also commonly write a class or element name: body, press tab and it creates body { }, with the cursor within the brackets. This seems to have stopped working, and since I've changed the preferences, it just ends the property with `;.
Is there a way to get this autocomplete function back, with element names and attributes?
I'm not clear on why you wanted to set propertyEnd initially, but I can highly recommend the even shorter expansions Emmet has to offer:
Ex: Type fl followed by tab and you should get float: left; with the 'left' already highlighted for you to change. fr also expands to float: right;.
I'm not sure if these are standard with Emmet or if they come with the SCSS Package for Sublime, but they save me a lot of time. If you get used to them it's even quicker then typing out a full float before hitting tab.
Related
Sublime Text does not register a sass variable ($variable) as a single item when highlighting, so when I double click on the name, it highlights the word, but does not include the $-symbol in the highlighting. Visual Studio, on the other hand, selects the $-symbol along with the variable name when double clicking on a variable to select it.
I write sass all day long, and it could make my life drastically easier if I could modify this small behavior. Is there a way to change this? I am sure it would be possible with a plugin, but I don't know if one exists or how to find it.
There is a setting named word_separators which provides a list of characters that are assumed to not be part of a word for the purposes of things like double click selection, navigating by words, and so on.
The default for that particular setting is set to the following, which includes the $ character that is causing you woes:
// Characters that are considered to separate words
"word_separators": "./\\()\"'-:,.;<>~!##$%^&*|+=[]{}`~?",
You can modify this setting to not include the $ character so that it's treated as a part of the identifier, which should do what you want.
In order to ensure that you don't experience any other knock-on effects of this, you may want to set the setting in the preferences specific to the Sass syntax.
To do that, you can select Preferences > Settings - Syntax Specific while you have a Sass file open and focused, and then copy the default setting into those settings and remove the $ character.
In RubyMine, when editing SASS or SCSS, the "compiled" path to the selector for the code you're currently editing is shown. Is there a way to do the same in the Atom editor? A tooltip or a status bar is what I'm looking for. In big SASS/SCSS files, it can be 100s of lines to the outer-most selector, and it is way too easy to insert a new selector at the wrong spot.
A package that claims to do what you want is ctags-status:
ctags-status package
Show the class/function/scope name of the current line on the status bar.
...
Tested languages
C / C++
Coffeescript
CSS / LESS / SCSS / SASS
...
However, I installed it, and it only worked for the first level of Sass/SCSS selectors; it only displayed [a], or [.container] instead of something like [.container > a]. It also only re-evaluates your position after a save.
You have to tick the "Show outer scope(s)" checkbox in the settings of the ctags-status package in order for the full path to the root to be displayed. Works like a charm here.
In my style.css, I have a color value that repeats itself about 30 times. Going row after row and changing it is Sisyphean. Is there any way to "give a command" to change it to another color fast? Maybe via my text editor (Notepad++), SASS, or some external program?
What would be more efficient you think?
If all occurrences of the colorcode should be changed, then you can use the "Find and Replace" function of Notepad++
Press Ctrl + H to bring up the Dialog. Insert your old colorcode and your new one and then click Replace all
And for easier change later you can define Variables in sass.
Example:
$myAwesomeColor: #F9E055;
.text { color: $myAwesomeColor; }
Is there a way of changing the default indent template for autocompletions in Sublime Text 2? For example if I have:
div {}
and hit enter between the parentheses, I get:
div {
}
but what I'd like to get is:
div {
}
It's just a personal taste thing, but I'm wondering if it's achievable via one of the config files. Any help would be much appreciated! Thanks!
Darren
Take a look here:
~/Library/Application Support/Sublime Text 2/Packages/Default/Add Line in Braces.sublime-macro
Unfortunately its some sort of a bug.
In javascript files (at least when i write nodeJs stuff) it messes up indentation.
Try selecting everything and select "reindent".
Looking forward to Sublime 3
Geany is the closest thing I can find to the perfect web development IDE. However, I can't find a way to automatically close curly brackets ({).
For example, typing:
function test()
{
..and pressing RETURN should cause this to happen:
function test()
{
// cursor ends up here (indented by 1 tab)
}
Is there anything that can make Geany do that?
This is a native feature of Geany,
Go to Preferences, then Completions, down there you can choose which one you want to auto close.
Check here for screenshots
You make something else:
If you want, open https://plugins.geany.org/autoclose.html and see "autoclose" plugin. You can install with :
sudo apt-get install geany-plugins-autoclose
and It is all
That isn't full answer to your question, but may be helpful.
I have Geany not in english, I make translations of menu's fields on my own.
Geany has a feature: when you type special text and press Tab, the text is going to be replaced with another text.
It works by default for if, else, for, while, do, switch and try.
Configuration of this feature is in [Tools]/[Config files]/[snippets.conf].
After doing some changes, save file and click [Tools]/[Reload configuration].
I added two lines to section C++:
class=class %cursor%%block%;\n
struct=struct %cursor%%block%;\n
With block=\s{\n\t%cursor%\n}
It doesn't let you press { Enter or { Tab to get
{
//cursor
}
because {=anything is ignored, I don't know why.
What you can do? You can have some another text, replaced using {\n\t%cursor%\n}, or define keybinding inserting it.
Geany can have user defined snippets. It is possible to open snippet configuration file from menu.
Tools ->
Configuration files ->
snippets.conf
Go to the language block where you want to add that feature.
For example:
[C]
if=if (%cursor%)%block_cursor%
else=else%block_cursor%
for=for (i = 0; i < %cursor%; i++)%block_cursor%
while=while (%cursor%)%block_cursor%
do=do\n{\n\t%cursor%\n} while (%cursor%)\n%cursor%
switch=switch (%cursor%)%brace_open%case %cursor%:\n\t\t%cursor%\n\t\tbreak;\n\tdefault:\n\t\t%cursor%\n%brace_close%%cursor%
At first it can be thought that the problem can be fixed just with adding this line
{=%\n{\n\t%cursor%\n}%
But Geany does not accept that when snippet is one non alphabetic character.
It will work for any other alphabetic character like this
b=%\n{\n\t%cursor%\n}% or bl=%\n{\n\t%cursor%\n}%
However I dont think it is what you want. The real solution you can find from geanys menu.
Edit
->Preferences
->Editor
->Completions
Tick the Auto-close quotes and brackets then click on apply and save
The Auto-close doesn't work if we place brackets inside another pair of brackets. For example, the inner bracket doesn't auto-close.{{|}
However, we can use the following snippet to create a block.
{={\n\t%cursor%\n}
But in order to use this snippet, we first have to include '{' char in our wordchars set by changing the below line in snippets.conf file.
wordchars=_abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789{