Real SASS Support

First of all I have to say I am impressed with Vaadin and love it.
Once you get used to it, which of course takes a bit, it’s a blast to work with.
The Documentation is very nicely written and styled although a lot of the examples don’t work through copy&paste but that
help’s you understand Vaadin by solving these problems and for me therefore accelerated the learning :slight_smile:
(although that was also extremely frustrating at times and sometimes the Book of Vaadin for Vaadin 7 uses depreceated Vaadin 6 Code but hey it’s a huge book which propably takes forever to keep up to date and you already got enough to do developing Vaadin)

I love the Templating and through CSS/SCSS already endless ways to Layout and Style your Application.
But one thing I was really dissappointed with is the false Advertising about SASS.
In the Book of Vaadin you mention

Vaadin uses Sass for stylesheets. Sass is an extension of CSS3 that adds nested rules,
variables, mixins, selector inheritance, and other features to CSS. Sass supports two formats for stylesheet: 
Vaadin themes are written in SCSS (.scss), which is a superset of CSS3, but Sass also allows a more concise indented format (.sass)
[/code]But nowhere you state that compiling .sass is not implemented yet, you just wrote[code]
Sass can be used in two basic ways in Vaadin applications, either by compiling SCSS files to CSS or by doing the compilation on the fly.

That sentece sort of implies it but through googling and reading a lot about Vaadin and SASS support I found nowhere a sentece that directly stated “No .sass support for Vaadin at the moment”.
For me it’s a huge disappointment, because I worked with the real Power of SASS through *.sass for years now and really got to love it, and it’s very frustrating to remind yourself to add the stupid braces etc. after unlearning them on purpose. :confused:

Are there any Plans of adding that, or am I just plain stupid and really dumb for not getting it to work properly although it is already implemented?

Because i get the following error

java.io.FileNotFoundException: gyf.sass (parent: ****/VAADIN/themes/gyfv) at com.vaadin.sass.internal.visitor.ImportNodeHandler.traverse(ImportNodeHandler.java:58) Anyways thanks for such an amazing RIA Framework! Just my 2 cents about a tiny lack of feature in a huge sea of awesomeness! Keep up the good work! :slight_smile:

It’s not implemented yet and maybe on of the Vaadin core team members can comment this, but AFAIK there are no plans to implement *.sass support.

You can file tickets in
dev.vaadin.com
trac about Book of Vaadin also. Just put it under the Documentation component.

Hi,

I wouldn’t hold my breath on .sass support, since there’s still so much work to do on the actual feature side of the compiler, it lacks a bunch of the useful things from the original Sass compiler. I have no idea how hard it would be to support the other syntax, but I hope that once the compiler has enough features completed, the original Sass syntax support could be added.

Here’s a listing of the
open tickets for the Sass compiler
. Feel free to add new ones as you encounter them. Thanks!

Is it worth considering using JRuby & the actual real Sass ruby Gem to do the Sass compilation? That way, you’d get all the functionality of the real Sass compiler (plus bug fixes). I believe it’s possible to create a completely embedded combination of the two which would make it transparent. I did this a while ago for a an Ant build for a small project we have; yes, the jruby-complete-1.7.x.jar is ~20mb, but it’s only needed for development/compilation, not for production runtime.

Cheers,

Charles.

Charles, definitely possible, and in some cases even recommended, if you need all the Sass & Compass functionality. JRuby is an option, but you can always use just plain Ruby in development.

I would recommend either
LiveReload
(cross-platform) or
CodeKit
(Mac-only), if you wish to have something like live reload of your styles as well.

I faced the same problem with full Sass and Compass support when writing a Vaadin theme.

I’m using
Scout
to compile my Sass/Compass files into CSS.
Since the Vaadin themes have their references to images as relative paths to the current theme (e.g. relative to Reindeer, relative to Base etc) I have written a small Java class that parses all the Vaadin theme provided files and updates the paths to make them work in a compiled theme.

I have deployed a first custom theme using Sass, Compass and the modified Vaadin base themes and it seems to work fine.
12973.txt (2.88 KB)

Oh, I know I can do it :slight_smile: I meant as part of the Vaadin core! i.e. instead of maintaining your own Sass compiler within vaadin-theme-compiler-xxx.jar, use the Real Thing TM via JRuby. I suspect there are no license problems - Off the top of my head, without trying it, I guess the main issue would be finding resources inside jars when importing.

I just thought - once implemented - it would save trying to duplication functionality; DRY (well, others) and so on

[quote=Charles Anthony]
Oh, I know I can do it :slight_smile: I meant as part of the Vaadin core! i.e. instead of maintaining your own Sass compiler within vaadin-theme-compiler-xxx.jar, use the Real Thing TM via JRuby. I suspect there are no license problems - Off the top of my head, without trying it, I guess the main issue would be finding resources inside jars when importing.

I just thought - once implemented - it would save trying to duplication functionality; DRY (well, others) and so on
[/quote]Sure, I kinda thought you could :slight_smile:

Nicely summed up the issues there. I have to admit, I’m also currently using Scout.app for compiling the new theme that we’re developing, since the core version isn’t up to the task yet. And I’ve exported the core themes out of the JAR just to get it working easily with all the resources.

In retrospect, using the real thing via JRuby might have been a better choice. Implementing our own turned out to be quite a bit hairier than what we originally thought. We’ll have to see whether it makes sense to make the switch at some point.

Hi,

I was asked about related theme things lately and decided to try using the real sass compiler in a Vaadin project. During the exercise I also noticed this thread. The helper script by Alex was useful to convert the Vaadin theme to be compatible with std tools.

Although I haven’t really tried this in real projects, the setup seems to work fine. You can read about my findings from
my blog post
.

cheers,
matti