How to prevent inline styles in vaadin output

(or “my first vaadin”)

At her work my girlfriend, who is a java programmer, has been asked to use vaadin to create table reports. She told me that she had some problems styling her tables and asked me to look at them.

So
if
I am going to work on this from the template side at all I must ask the following:
Is it possible to remove
all
inline css definitions and replace them with classes?
If I could just prevent all
style=‘’
from being written, the code may still be savable.

For now it seems a lot faster to just strip everything out and use jquery for a do over. I’m inclined to tell her to use Wicket instead.

Honestly, I have a couple of years of experience in designing and theming but i have not seen such an amount of code diarrhoea since Frontpage. If you look past her classes: inline styles? tables instead of table headers? Random overflow statements? There must be some mistake. This can’t be default output. Please tell me I’m wrong on this.

:frowning:
11387.txt (7.47 KB)

First off, welcome to the forum,

In theory they could be replaced with classes, and in many cases they should be, but currently it is not possible.

I have total dedication to make some of it happen for version 7, as longs I’m given the time develop in stead of doing client work 100% of the time. The performance of the table would probably benefit a lot if all those
style=‘width: 74px’
would be replace with classes like
v-column1
etc., the browser is much faster at applying stylesheet changes than individual element style changes.

For the other, non-dynamic values, I’m planning on moving all of them to GWT generated styles, i.e. as CSSResources. That will result in obscured classnames, but those styles are mostly stuff that you should not override in any case - styles that are expected by the client side rendering engine. But you could then more easily override them with a more specific selector.

As a workaround for now you can use the
!important
statement to override all the inline styles. Ugly, but doable.

Doesn’t change this fact one bit, but still, go look at the stuff that some other frameworks generate, such as Cappuccino or Qooxdoo, same thing there. For Cappuccino, it’s all inline styles, no classes at all, but their themeing is done in a different way anyhow.

The semantics of the structures are way off, I must admit as well. But up until recently, that hasn’t made any difference since no search engine would index that stuff anyway. As long as it renders correctly, everything is fine. Many of the DOM structure decision have been forced by some problematic browser bugs, making it impossible to use the most semantic structures. At least in the past. For version 7 we’re planning on dropping IE6 from the supported list, which will affect this hugely.

In any case, if you do decide to stick with Vaadin, I’m more than happy to help with the styling.