Docs

You are viewing documentation for an older Vaadin version. View latest documentation

Docs

Legacy theme in MPR

By default the theme used with MPR is 'valo' and this can be changed with adding the MprTheme annotation with the wanted theme name to your root navigation level, RouterLayout or to the top level @Route.

The closest instance found will be used for first initialization for a UI instance, but the recommendation would be to put it always on the top most RouterLayout in the view chain.

Note
 Runtime changing of the theme is not supported 
@MprTheme("reindeer")
public class MainLayout extends Div implements RouterLayout {
}

@Route(value = "", layout = MainLayout.class)
public class RootTarget extends Div {
    public RootTarget() {
      LegacyWrapper addressbookWrapper = new LegacyWrapper(
                  new AddressbookLayout());
      add(addressbookWrapper);
    }
}

The theme can be a old legacy styles.css theme or a styles.scss theme. In the case of a SASS theme, on-the-fly compilation works out of the box without any changes.

Using your custom theme

Using your own Vaadin legacy theme remains the same as it was. Create your theme by following the instructions in the themes documentation for Vaadin 7 or Vaadin 8.

Then just add the @MprTheme annotation with your theme name on the AppShellConfigurator instance and your theme will be used for the legacy framework part.

D4B23313-2668-4528-B889-27DB4C01D05C