subhaze / css-extended Goto Github PK

what's the quickest path to support Stylus? I can use the sass package to get most of what I need. this is because Im writing Stylus in SCSS format.

Currently all completions found in CSS files, HTML files, PHP files, etc... are added to the project cache key. Since HTML/PHP/etc... inline styles are document specific create a new cache key for those files so that other files are not cross pollinated with CSS symbols that would never be associated to them.

Not displaying Class or ID's in HTML doc.
ST 2
Win 7

Looks like this option doesn't work, Sublime 3, Ubuntu
in my case
"load_external_files": ["/Work/ikit/init/css/core/_.scss", "/Work/ikit/init/css/mixins/_.scss"],

very useful plugin anyway, thanks!

When trying to text expand using Emmet and supplying class names, it disables Emmets tab-completion and just shows a list of classnames. I'm not sure if I am missing something in the docs, or a specific key-binding I should be using, but I would prefer to keep tab-completion.

• Sublime Text 3 - 3083
• OSX 10.10.5
• No errors in console

Love the plugin. It would be great if it had a few options like:

• Affected file types. So that I could use the plugin on html like files such as cshtml (Razor Views). "css_extend_source": ["source.html","source.cshtml","source.php"]
• Auto clear cache on close. "autoclear_css_cache":true
• Auto load css from folders: "css_cache_include":["c:\dev\test\*.css"]

Hello,
I opened a topic in the forum here involving your plugin maybe you can have a look.
http://www.sublimetext.com/forum/viewtopic.php?f=3&t=16472

My css folder contains 6 *.less files which I try to cache via on css-folder in sidebar.
I get this error 5 times (at different positions though)
UnicodeDecodeError: 'ascii' codec can't decode byte 0xc3 in position 52: ordinal not in range(128)
console:

PARSING FILE /Users/me/some/long/path/vars.less
Traceback (most recent call last):
  File "style_parser in /Users/me/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 114, in <lambda>
  File "style_parser in /Users/me/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 100, in parse_file
  File "./python3.3/encodings/ascii.py", line 26, in decode
UnicodeDecodeError: 'ascii' codec can't decode byte 0xc3 in position 795: ordinal not in range(128)

But one file passes the compiler: debugging.less
debugging.less does not have a single intended mixin inside, which is probably why it passes?
Although in LESS a declaration of a class is a mixin by itself, I guess.

The strangest part now is, that I get completions for some mixins I used inside the debugging.less.

.no-text-selection; for instance. I just use it inside debugging.less and yet get it as an completion.
No declaration with { } for this class. I just used it!

1. What is happening here? (could it be my umlaut comments, since I'm german?)
2. Would you be so kind and help me to get the other 5 files running?
3. Is there an option to only get auto completion for "actual" mixins alá .mixin() wether with parameter or not.

Thanks so much.
I'll be a wizard with this plugin up and running.

UPDATE:
Yap, one ö inside of debugging.less kills the parsing here aswell. What do we do now? :O

Shouldn't be much of a problem. Might do it myself once I get some time.

Not giving any autocompletions.

I installed the package. When open a project and right click on the side bar folder, the menu "CSS Extended Completion" does not come up/show.

Once again just another suggestion, feel free to close this if you're not interested.

As a web developer I use Emmet to speed up my html building. With Emmet you can basically write css like string and then hit tab and it will turn it into html with appropriate tags. Check it out to see what I mean.

It would be great if the plugin could detect the . or # in an emmet string and auto-suggest class & id names from cached css files.

Hi,

In ST2 works perfect but in ST3 the CSS Scope class auto-suggestion does not work in .css files. In .html files works perfect. Pseudo clases does not work neither.

Please help!

An option to allow styles added within a <style> tag to be added to the completion list outside of the HTML file it's within.

I have some strange situation.

OS X 10.9.3
Sublime text 3 build 3059
Plugin configuration:

{
  "css_extension": [".less"]
}

I delete cache and add several .less files to it again. But plugin try parse css files from another folder. All files have UTF-8 encoding

Traceback (most recent call last):
  File "/Applications/Sublime Text.app/Contents/MacOS/sublime_plugin.py", line 263, in on_post_save_async
    callback.on_post_save_async(v)
  File "css_style_completions in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 62, in on_post_save_async
  File "style_parser in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 125, in parse_view
  File "X/encodings/ascii.py", line 26, in decode
UnicodeDecodeError: 'ascii' codec can't decode byte 0xd0 in position 344: ordinal not in range(128)
PARSING FILE /Users/userName/web/in/css/bootstrap.css
PARSING FILE /Users/userName/web/in/css/in.css
PARSING FILE /Users/userName/web/in/css/bootstrap-responsive.css

UPDATE: Right click on LESS folder in sidebar menu, click on "Add LESS files to cache" and see in console:

Traceback (most recent call last):
  File "/Applications/Sublime Text.app/Contents/MacOS/sublime_plugin.py", line 263, in on_post_save_async
    callback.on_post_save_async(v)
  File "css_style_completions in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 62, in on_post_save_async
  File "style_parser in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 125, in parse_view
  File "X/encodings/ascii.py", line 26, in decode
UnicodeDecodeError: 'ascii' codec can't decode byte 0xd0 in position 344: ordinal not in range(128)
PARSING FILE /Users/userName/web/in/css/bootstrap.css
PARSING FILE /Users/userName/web/in/css/in.css
PARSING FILE /Users/userName/web/in/css/bootstrap-responsive.css
PARSING FILE /Users/userName/web/source/less/backend.less
PARSING FILE /Users/userName/web/source/less/frontend.less

Why plugin parse CSS folder? Also plugin reparse all css and less files after save html file!

UPDATE

Breaks all Sublime hotkeys after that:

Traceback (most recent call last):
  File "/Applications/Sublime Text.app/Contents/MacOS/sublime_plugin.py", line 263, in on_post_save_async
    callback.on_post_save_async(v)
  File "css_style_completions in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 62, in on_post_save_async
  File "style_parser in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 125, in parse_view
  File "X/encodings/ascii.py", line 26, in decode
UnicodeDecodeError: 'ascii' codec can't decode byte 0xd0 in position 819: ordinal not in range(128)
PARSING FILE /Users/max/Work/Projects/kata.im/web/public/css/frontend.css
PARSING FILE /Users/max/Work/Projects/kata.im/web/source/css/frontend.css
Writing file /Users/max/Work/Projects/kata.im/inc/abstracts/frontend-header.php with encoding UTF-8 (atomic)
Writing file /Users/max/Work/Projects/kata.im/inc/abstracts/frontend-header.php with encoding UTF-8 (atomic)
PARSING SAVED VIEW
Traceback (most recent call last):
  File "/Applications/Sublime Text.app/Contents/MacOS/sublime_plugin.py", line 263, in on_post_save_async
    callback.on_post_save_async(v)
  File "css_style_completions in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 62, in on_post_save_async
  File "style_parser in /Users/max/Library/Application Support/Sublime Text 3/Installed Packages/CSS Extended Completions.sublime-package", line 125, in parse_view
  File "X/encodings/ascii.py", line 26, in decode
UnicodeDecodeError: 'ascii' codec can't decode byte 0xd0 in position 852: ordinal not in range(128)
PARSING FILE /Users/max/Work/Projects/kata.im/web/public/css/frontend.css
error: plugin_host has exited unexpectedly, plugin functionality won't be available until Sublime Text has been restarted

How I can repair that?

Simply describe the situation as follows:
OS: Mac OSX 10.9.2, ST3 Beta Build 3059
I didn't change any default setting but add support for emmet as you described:
"auto_complete_selector": "source - comment, meta.tag - punctuation.definition.tag.begin, text.html.basic"in CSS Extended Completion Setting -- User
There are two files: index.html and style.css
After I add the css selectors(id/class names) in the style.css and save the file, then the id/class names will show up in the completion list in the index.html automatically, but not in style.css itself(have to evoke [Ctrl+Space]).
However if I add id/class names in theindex.html and save the file, the added id/class name won't show up in the index.html file itself or in the style.css, even with [Ctrl+Space]

As you said in Cache on Save

If the document is a .html/.php/etc... it will parse that file and extract any classes/IDs found within style tags and only show you those completions within that file, plus any from the main project cache.

I doubt the package doesn't work out for this function or my setting is incorrect.

A desirable situation would be if I add one id/class name in the html file, later when I want to add another id/class name in the same html file or to use one css selector in the css file, all previously added id/class names in the html file would automatically show up in the completion list.

Is this possible with this package?

Hi. I've found something interesting, CSS-Extended is duplicating some completions.

I believe the problem is in fact that now the core CSS completions on ST3 are better, and CSSE is trying to enhance something that is already there. Any thoughts?

• Add id/class attributes in HTML elements to completion list

CSS class/id suggestions do not work within the Handlebars file type (see plugin https://sublime.wbond.net/packages/Handlebars).

When I open a folder in ST3 that has subfolders with multiple "style.css" files, then open and edit any html file that contains a link to a stylesheet named "style.css", CSS-Extended parses all files named "style.css" in ALL subfolders (45 files for me, as I have many old-version-subfolders)

Example: File->Open Folder -> "C:\xampp\htdocs\myfolder"

Writing file /C/xampp/htdocs/myfolder/subfolder1/index.html with encoding UTF-8 (atomic)
Found styles linked in HTML
['C:\\xampp\\htdocs\\myfolder\\subfolder1\\style.css', C:\\xampp\\myfolder\\folder\\subfolder2\\style.css', 'C:\\xampp\\htdocs\\myfolder\\subfolder3\\style.css', ......]
PARSING FILE C:\xampp\htdocs\myfolder\subfolder1\style.css
PARSING FILE C:\xampp\htdocs\myfolder\subfolder2\style.css
PARSING FILE C:\xampp\htdocs\myfolder\subfolder3\style.css
PARSING FILE ......

The status bar says CSS Extended: parsing file 1 of 45, and it takes about 20 seconds for all 45 stylesheets to parse, each time I save the html file.

Files containing for example Chinese characters do not get parsed and the plugin produces an error similar to this:

UnicodeDecodeError: 'charmap' codec can't decode byte 0x9d in position 885: character maps to <undefined>

Easy way to fix this is to modify style_parser.py on lines 99 and 131 by adding encoding='utf8' to the open function.

Before:

 98            get_output_panel().set_name(file_path)
 99            with open(file_path, 'r') as f:
100                content = f.read()

After:

 98            get_output_panel().set_name(file_path)
 99            with open(file_path, 'r', encoding='utf8') as f:
100                content = f.read()

I was just about to write this issue under https://github.com/bnlucas/SassBuilder/ when I found out this error relates to CSS Extended Completions.

This issue stopped SassBuilder from compiling. I'm on Mac OS X 10.9 with Sublime Text 2, updated Homebrew and everything else I can think of.

Error on compilation:

Writing file /User/brett/www/project1/sass/title.scss with encoding UTF-8
PARSING SAVED VIEW
Traceback (most recent call last):
  File "./sublime_plugin.py", line 190, in on_post_save
  File "./sublime_plugin.py", line 154, in run_timed_function
  File "./sublime_plugin.py", line 189, in <lambda>
  File "./css_style_completions.py", line 62, in on_post_save
  File "./style_parser.py", line 141, in parse_view
TypeError: 'encoding' is an invalid keyword argument for this function

I looked up which file those relate to and once I removed CSS Extended Completions, it started working again.

Working output:

Writing file /User/brett/www/project1/sass/title.scss with encoding UTF-8

My packages:

{
    "auto_upgrade_last_run": null,
    "installed_packages":
    [
        "AdvancedNewFile",
        "Alignment",
        "ApacheConf.tmLanguage",
        "BeautifyRuby",
        "cdnjs",
        "Clipboard History",
        "CoffeeScript",
        "Color Highlighter",
        "Color Scheme - Creamy",
        "CSS Extended Completions",
        "Dayle Rees Color Schemes",
        "EncodingHelper",
        "Handlebars",
        "HTML Boilerplate",
        "HTML Snippets",
        "HTML-CSS-JS Prettify",
        "HTML5",
        "HTMLBeautify",
        "JavaScript Snippets",
        "Laravel 4 Snippets",
        "Laravel Generator",
        "LESS",
        "Nettuts+ Fetch",
        "Package Control",
        "RenameTab",
        "Sass",
        "SASS Build",
        "SassBeautify",
        "SassBuilder",
        "SchemeCycler",
        "SCSS",
        "SFTP",
        "StringEncode",
        "sublime-text-handlebars",
        "sublimelint",
        "SublimeLinter",
        "SublimeOnSaveBuild",
        "Syntax Highlighting for Sass",
        "Theme - Brogrammer",
        "Theme - Centurion",
        "Theme - Centurion Blue",
        "Theme - Farzher",
        "Theme - Minimal",
        "Theme - Soda",
        "Theme - Spacegray",
        "TrailingSpaces",
        "Whitespace"
    ],
    "repositories":
    [
        "https://github.com/nrw/sublime-text-handlebars.git"
    ]
}

Work on a better readme with screen grabs/animated gifs.

happened after cache restructuring.

Hello There !

Thanks for the amazing plugin, it's super duper helpful, although, I can't seem to be able to autocomplete class names when I activate it.

Steps to reproduce bug ->

1. Download the LESS sublime syntax plugin - https://github.com/danro/Less-sublime
2. Install this one (CSS-Extended)
3. Write a class.
4. Try to autocomplete it, I would expect the following result to occur (the first capture)
5. But sadly I see is the second (with no completions...)

Would you know why this occurs ?

Thanks in advance and again thanks for this amazing plugin !

CSS-Extended does not work on Linux and ST3 3061.

reloading plugin CSS-Extended.commands
reloading plugin CSS-Extended.css_style_completions
Traceback (most recent call last):
  File "/opt/sublime_text_3/sublime_plugin.py", line 73, in reload_plugin
    m = importlib.import_module(modulename)
  File "./importlib/__init__.py", line 90, in import_module
  File "<frozen importlib._bootstrap>", line 1584, in _gcd_import
  File "<frozen importlib._bootstrap>", line 1565, in _find_and_load
  File "<frozen importlib._bootstrap>", line 1532, in _find_and_load_unlocked
  File "<frozen importlib._bootstrap>", line 584, in _check_name_wrapper
  File "<frozen importlib._bootstrap>", line 1022, in load_module
  File "<frozen importlib._bootstrap>", line 1003, in load_module
  File "<frozen importlib._bootstrap>", line 560, in module_for_loader_wrapper
  File "<frozen importlib._bootstrap>", line 868, in _load_module
  File "<frozen importlib._bootstrap>", line 313, in _call_with_frames_removed
  File "/home/thebits/.config/sublime-text-3/Packages/CSS-Extended/css_style_completions.py", line 62, in <module>
    os.makedirs(cache_dir)
  File "./os.py", line 269, in makedirs
PermissionError: [Errno 13] Permission denied: '/opt/sublime_text_3/CSS/'

How I can add JSX support?
tmLanguage file – https://github.com/reactjs/sublime-react/blob/master/syntax/jsx/tmLanguage/JavaScript%20(JSX).JSON-tmLanguage#L458

Hi! Not really a sublimer, but trying to.

I've been trying to autocomplete classes inside CSS attributes (i.e <div class="autocomplete-this-class">) but it's not working at all on Sublime 2.

I've added all the CSS files to cache (from the sidebar) and still nothing.

Somehow, the plugin works a little bit in Sublime 3, but doesn't show all the available classes... It doesn't even show classes who have been alredy manually called earlier in the same HTML.

Really don't understand the documentation and the User/Default setting files :(

Greetings!

Windows 7 64bit
SUblime Version 2.0.2, Build 2221
Sublime 3, Build 3059

In build 3101 / 3102 / 3103 when using this plugin in random(?) time show error:

plugin_host has exited unexpectedly, plugin functionality won't be 
available until Sublime Text has been restarted

Log from console:

PARSING FILE path\to\file.css
PARSING FILE path\to\file.css
error: plugin_host has exited unexpectedly, plugin functionality won't be available until Sublime Text has been restarted

:(

I am definitely not 100% sure if this is a CSS-Extended issue, but as per the screen shot two of the pseudo selectors seem messed up:

• nth-type-of
• nth-last-type-of

Please let me know if you need any more info! Thanks so much!

Almost every project I work in doesn't have the css file directly linked to that file. I was wondering if there was a way I could make it work on all files that end with .html within a sublime package? Thanks for all the hardwork.

Have a setting that can either be global or per project that contains a folder pattern to automatically index.

after install, right click on any file in project to add file to cache, the css extended showing but disabled.
auto complete function is not working also.

sublime text 3 build 3059, 64 bit version
ubuntu 14.04 LTS 64 bit

• Add instructions in the README.md on what selectors to add for auto triggering the completion list (if possible, in ST3 some areas this is impossible due to how the default CSS package code is setup)
• More clearly state how the plug-in works and how to add files to the cache
• Look into caching linked stylesheets on file save
• Add elements to the completion list in CSS files
• Update font stack based on http://www.awayback.com/revised-font-stack/ and allow it to be managed via the package settings file

Plugin breakes editor - when I save file or add files to cache, the editor stop working (no response...). I have this situation since 3 days - before everything worked....

Still not getting autocompletions within CSS files, have to use ctrl + space not receiving select list popup.

Win 7 - ST3 build 3059
Win 8 - ST3 build 3059

Sublime text allow you to overwrite and extend package files by creating folder with syntax name in /Data/Packages, like: /Data/Packages/CSS. Files in this folders will overwrite or extend functionality from default /Packages folder. I would love to add your repository to my package manager custom repos list, but I don't want to overwrite default CSS syntax files, because they might change in future. Hope that make sense (if not I can give more verbose description). Let me know and thank you very much for this plugin! :)

Hi,

I have html file with a simple:

And when I type .c in css file and click ctrl + space, I cannot see container class.

I am using Sublime Text 3 on Windows

There are no errors in console

Using Sublime Text 3 build 3065
Windows 8.1
No errors reported

So they work for HTML files but not PHP files.

How to solve?

Thanks

I've ST3 and I recently installed this plugin. When I make my changes to CSS file ST will crash. It doesn't happen every time. I noticed it happens when:

• Hit ctrl+s multiple time(I've this weird habit).
• Some times on creation of new CSS file.

for details, Here is my list of installed packages:

{
    "bootstrapped": true,
    "in_process_packages":
    [
    ],
    "install_missing": true,
    "installed_packages":
    [
        "1337 Color Scheme",
        "ACF Snippets",
        "AdvancedNewFile",
        "Align Arguments",
        "Alignment",
        "AlignTab",
        "ASCII Decorator",
        "ASP Snippets",
        "AutoFileName",
        "Autoprefixer",
        "Babel",
        "Babel Snippets",
        "BracketHighlighter",
        "Chain of Command",
        "Color Highlighter",
        "Console Wrap for js",
        "DocBlockr",
        "Emmet",
        "Emmet Css Snippets",
        "Emmet Style Reflector",
        "Emoji",
        "FileDiffs",
        "Git",
        "GitGutter",
        "Handlebars",
        "HTML Snippets",
        "HTMLBeautify",
        "Inc-Dec-Value",
        "JavaScriptNext - ES6 Syntax",
        "JSHint",
        "JSX",
        "Local History",
        "LoremIpsum",
        "Markdown Preview",
        "MarkdownEditing",
        "Material Theme",
        "Material Theme - Appbar",
        "Materialize-Appbar",
        "Oceanic Next Color Scheme",
        "Origami",
        "Package Control",
        "Preap",
        "React Templates",
        "ReactJS",
        "ReactJS Snippets",
        "RegReplace",
        "SCSS",
        "SCSS Snippets",
        "SideBarEnhancements",
        "SublimeCodeIntel",
        "SublimeLinter",
        "Theme - Brogrammer",
        "Theme - Dark Material",
        "Theme - Gravity",
        "Theme - Solarized Flat",
        "Theme - Spacegray",
        "Trimmer",
        "View In Browser"
    ]
}

This may not have the entry of CSS Extended Completions. As I was removing CSS related plugins one by one to test.

I'm not sure if this is my fault...

When I add fa in class, fa lists all the font awesome css, but it needs to start with fa.
I have to add fa manually.
Another issue is if I want to add more than one css rule (new css: box1), no list appears
ie. div class="fa fa-glass box1"

ST2 Win7

In my minified css file, all data is written on one line :)

CSS extend does not suggest from stylesheets in Handlebar typed files (https://github.com/daaain/Handlebars).

Hello ,

I have been facing this problem for a while now, I tried changing my sublime build version but no luck. Right Now I am using Sublime 3 Build 3065 on a Fedora 21 System. I tried copying the default package settings to user package settings still no luck. I am still unable to enable that menu option in my sidebar.

This is my console LOG:

Traceback (most recent call last):
File "/opt/sublime_text/sublime_plugin.py", line 73, in reload_plugin
m = importlib.import_module(modulename)
File "./importlib/init.py", line 90, in import_module
File "", line 1584, in _gcd_import
File "", line 1565, in _find_and_load
File "", line 1532, in _find_and_load_unlocked
File "/opt/sublime_text/sublime_plugin.py", line 671, in load_module
exec(compile(source, source_path, 'exec'), mod.dict)
File "01-ssl-linux in /home/rubol/.config/sublime-text-3/Installed Packages/0_package_control_loader.sublime-package", line 26, in
NameError: name 'e' is not defined
reloading plugin 0_package_control_loader.02-bz2
reloading plugin CSS Extended Completions.cache
reloading plugin CSS Extended Completions.commands
reloading plugin CSS Extended Completions.completions
reloading plugin CSS Extended Completions.css_style_completions
reloading plugin CSS Extended Completions.extended_css_completions
reloading plugin CSS Extended Completions.location
reloading plugin CSS Extended Completions.project
reloading plugin CSS Extended Completions.settings
reloading plugin CSS Extended Completions.style_parser
reloading plugin CSS3.css3_completions
reloading plugin CSS3.rgb_to_hex
reloading plugin CSS3.validator
reloading plugin CSSLint.CSSLint
reloading plugin CSSLint.version_file_checker
reloading plugin Emmet.emmet-plugin
loaded 1172 snippets
reloading plugin Package Control.Package Control
reloading plugin Package Control.bootstrap
reloading plugin SideBarEnhancements.SideBar
reloading plugin SideBarEnhancements.SideBarAPI
reloading plugin SideBarEnhancements.SideBarDefaultDisable
reloading plugin Xdebug Client.main
reloading plugin SFTP.SFTP
SFTP: enabling custom linux ssl module
SFTP: _ssl module import error - libssl.so.1.0.0: cannot open shared object file: No such file or directory
SFTP: _ssl module import error - libssl.so.1.0.0: cannot open shared object file: No such file or directory
SFTP: _ssl module import error - libssl.so.1.0.0: cannot open shared object file: No such file or directory
plugins loaded
CSSLint is a .sublime-package; Verifying required files.
Emmet: No need to update PyV8
Package Control: Skipping automatic upgrade, last run at 2014-12-29 19:34:20, next run at 2014-12-29 20:34:20 or after

Please help me fix this, as this is one of the most important plugin in sublime for me. Pardon me if this turn out to be a system specific issue.

Regards

I'm on windows platform, sublime text 3.x
my html project folder structure looks like

c:/test
+-----asset/
+----css/
test.html

I added
"load_external_files": ["asset/css/*.css"],

while editing the html file and try to reference css class from the style.css, nothing appear. no class sugggestion provided.

Installed on clean Sublime 3. Not working with default setup.

Using Sublime Text 3 build 3065
Windows 8.1
No errors reported

Great work!

After adding my scss file to the cache it doesn't pick up the classes and ids defined for auto completion in a HTML file. Is this not supported or do I have a bug?

Cheers