auto complete intellij - less/css - html

I have some problems with css auto complete on my html files.
My project is java project on spring/bootstrap. I have less file that is compiled to css later on. On my html files I don't have access to classes from less or bootstrap files. I have "webapp" folder configured correctly in project.
CSS files are in:
a) webapp\css\less\main.less
b) webapp\css\ (bootstrap, main.css main.min.css)
Is it possible to add css (class) completition to html files that are created in project?

It should do it out of the box for css: http://www.jetbrains.com/editors/html_css_editor.jsp?ide=idea
for LESS however you might need to use a plugin : https://plugins.jetbrains.com/plugin/7059?pr=idea
I know LESS works out of the box with WebStorm and PHPStorm, though
If it still doesn't work, you might need to set the right file extension or associate that file with a certain interpreter

Related

Minified CSS file doesn't update when I modify the normal css file - Wordpress

I am having problem on my Wordpress to save changes on module.css file.
It appears that I have a minified file : module.min.css which comes with the theme.
Each times I make a change it the module.css file, it doesn't change it on my website page. I check with google inspector, and the minified file is loaded, obvioulsy, without my changes.
My website page : https://dermelia.fr/epilation-laser-un-acte-medical/
I saw it could be a caching problem, then I tried to purge cache, I use WP Rocket plugin and Clouflare. I cleaned the cache on both Clouflare and my website, still nothing...
I would like to add just a border-top on my ".widget ul li { " class
Any suggestion ?
Hi Changing in your css files will not reflect in your min.css files you have to update it.
To updated the changes use,
grunt uglify
grunt cssmin
if you want to update html use,
grunt htmlmin
If you don't have grunt please install it.
If module.min.css is generated at run time by some plugin like autoptimize, it is most probably cache-related problem.
However, in your case, the theme most probably simply has two options (minified & not minified CSS) & you have chosen to use minified version to improve performance.
In this case, CSS files are completely independent & change in 1 file, will not affect another in any way.
You have two options:
Make changes in not-minified CSS file and then minify it on your own. Finally update both files.
Switch to use not-minified version & install something like previously mentioned autoptimize to calculate minified files at runtime.
Please note, that in both cases you would be better off by not modifying original theme files & creating a child theme instead.
Otherwise, all your changes will be lost once the theme will be updated.

Is there a way to configure eclipse that it treats gss files like css files?

I want to enable eclipse specific code completion and syntax highlighting for css to files that ends with gss. The gss files are similar to css files. They are called closure-stylesheets.
Is there a way to configure eclipse that it treats gss files like css files to get code completion enabled?
For individual files you can just right click on the file and select 'Open With > CSS editor' (this will be remembered for future editing)
To set for all files go to 'Preferences > General > Content Types'. Find 'CSS' under 'Text' and click 'Add...' to add a '*.gss' association.

joomla 3.3 css module overriding doesn't work

I have use the backend feaure to create an override for the module djmenu. This automatically create the folder mod_djmenu in template/protostar/html and create a default.php in this folder.
I want to override the djmenu.css which is originally placed in module/mod_djmenu/themes/default/css, so I created in template/protostar/html/mod_djmenu the folder themes/default/css and copy paste the djmenu.css there.
I changed some simple but obvious CSS properties (background...) to test the override but it's not changing anything on my website and when I use firebug I still that the original file is used and not the override. I went across several tutorials but without success.
What I am missing?
Here is what you should do to make the css overrides work (it's working for the dj-menu module only not every modules though)
1) copy paste the css files you want to override in the template/protostar/css folder
2) in dj-menu module setting, select - override from template - on the theme field (first tab in the module page).

Html, CSS files apache permissions

I have a question about file permissions of html - css files served by httpd (on CentOS).
I have a website with several html - php - css files. When a user enters the URL of my website, index.html is displayed as it should. I tried to browse one of my css files (just for fun), and I realized that css source code is displayed in the browser. I do not publish the css files and their exact names of course, but some names (e.g style.css , bootstrap.css etc) are trivial, and one can try and get the styling of my webpage easily.
What is the solution to that? I cannot take off the read permissions of these files, because apache would not style the html files (since it will not be able to read the css).
There's no solution to that, css files must be readable and downloadable. You can minify them if you want them to be less readable (and smaller which is its real use).
Edit: Relevant Answer

Setting up new framework-based projects and using LESS

So I'm trying to set up an environment where I can generate a new project and minimize the customization/complexity involved in setting up that new project. I'm using Structurer Pro (from nettuts+) to build the fileset, and this is an awesome thing. I've got github for MAC set up, allowing me to grab the latest Foundation framework files and put them in to the current project.
Now, I'm trying to incorporate LESS into the process also. However, Foundation's css files aren't currently set up with LESS, which means I have 2 options...(1) take a current version and LESS-ize them, then use those customized files to create new projects. (2) don't use LESS...
The other problem I have is, there seem to be quite a few compilers for LESS (simpLESS, CodeKit, LESS, compass), but none of them combine css files! So if I set up 10 LESS files (e.g. IE.less, mobile.less, grid.less, typography.less etc), and have the variables in them, I really don't want 10 css files as the output. I really want 1 compiled css file as the output. I know I can do this manually, or even through Clean css or any of the 30 other sites out there...
But is there one 'thing' out there that will let me use the latest files to create a project framework, customize it by applying a color swatch set to a series of variables (LESS), then compile & combine the resulting CSS for actual implementation?
Foundation ended up moving to SCSS in version 3, so this became kind of a moot point...
Trying to answer some of your questions:
Rename Foundation's .css files to .less and put in your /less/ directory.
Any .css file is a valid .less file (not vice versa though)
You don't have to convert this CSS to LESS, do so only for things you're going to be modifying, and save some time ;)
In your master.less file import these files with #import 'foundation-file';
re: how to combine css/less files :)
Compile only the master.less and include it in your HTML
master.less is your assumed MAIN stylesheet which may actually contain only #import statements, for me it's easier to manage everything this way (and where the combination happens). it will compile to master.css which you then use.
I'm not sure what css foundation includes, if it's a reset.css or something similar I would just leave it and not less-ize it. You would have two css files: one reset.css and one styles.css (the latter of which would be compiled from less files).
You could then add your own setup including a style.less which #imports the various components, if you make this generic enough you can reuse it throughout various projects.
The lessc compiler does handle the #imports of various files and combines them into one file: I have styles.less which #imports base.less components.less etc. I just compile the styles.less to styles.css and it handles the rest:
lessc styles.less styles.css
See: https://gist.github.com/1480684