Where does the CSS go?

General
1

I want to bold the text of a MenuBar.MenuItem. As far as I’ve been able to discern, the way to do this is to add a class to the MenuItem using setStyleName (a poorly chosen method name since I’m really adding a CSS class name).

OK, so now I’ve set the class to “mymenuitem” and I have my CSS: .mymenuitem { font-weight:bold }…


Where does the CSS go?

I have searched the forums and the Vaadin book to no avail. Can someone enlighten me?

Or am I headed in the completely wrong direction?

Thanks in advance!

2

Hi,

You have to create a theme for your application. For more information, see
Book of Vaadin
.

3

Seriously? To bold one menu item’s text, I have to create my own theme? There is no simpler way to make minor adjustments to the look and feel?

4

Creating your own theme does not mean you have to create the theme from scratch. You inherit the default theme and then you can tweak the components you wish.

Check out Book of Vaadin for details.

5

True, it’s not nearly as bad as I’d feared. Actually, it’s just a matter of creating a few directories and a blank stylesheet, then importing the default theme’s stylesheet. Now I can put my own style declarations below the import and style away to my heart’s content. Very nice!

Suggested improvement for the second edition of the Vaadin book: Have a section entitled “How to modify styles with CSS” or some similar phrase, and explain how to do basic modifications there. Most people don’t read programming books sequentially like they would read a novel. They hop around using the index or a search feature. To me, Themes suggests a full, heavyweight reskinning of the application and is the last place I’d think to look for something as simple as bolding one menu item. A much better index might also serve the same function.

Thanks for the help! It’s looking great now.