How to copy a theme in Vaadin7?

Flow
1

Hi,

I want to copy a theme in Vaadin 7. But how can I do it?

What I have done is the following:

  2. I use currently the “chameleon” theme from Vaadin7. My UI class is tagged with @Theme(“chameleon”) and all is fine.
  3. I have copy the VAADIN/themes/chameleon directory and rename the copy to VAADIN/themes/neutral
  4. I have compile the theme(s)
  5. i have change the annotation of the UI class to @Theme(“neutral”)
  6. compile all of my the java stuff
  7. redeploy my Web application

And it’s seems that the web application has no CSS rules (if I specify a non exsting theme in @Theme(“…”) I have the same result).

Where is my mismatch? What’s the best way to copy a theme?

Thanks,
Steffen

2

You should import the other theme’s scss file in a newly created theme rather then copying the style folder.
To do that create a new theme with an own style.scss file.
Inside the scss file you can then import the chameleon scss to use its style like this:

[code]
@import “…/chameleon/chameleon.scss”; /* Actual path/names might differ in your case */

@mixin mytheme {

@include chameleon;

/* An actual theme rule which overrites the chameleon style for v-button*/
.v-button {
color: blue;
}
}
[/code]For more information have a look at the Book of Vaadin on Themes.

3

Thanks! That works! :slight_smile:

I had also to learn to create a new theme in every case with the IDE (e.g. eclipse) with “New…” - “Vaadin” - “Vaadin Theme” …

4

Ranjit-

You aren’t actually using Valo in your example. You need to add valo to your theme.

@import "../valo/valo";

@mixin designer
{
    @include valo;
    ....
}

Regards,
Eric

5

Did you compile the theme after you made the changes? after any chnges to the theme, you must compile it to see the changes.

6

Please double-check that your @theme annotation has the correct theme name (if you change it to “valo” it should use the default valo theme, try that too).

As Eric said, your theme used the wrong imports (it used runo, instead of valo). You need to remove all references to the runo theme if you want to use valo, as the two aren’t compatible.