How to add a vaadin theme from a library

Question

I develop a vaadin library project. This library is used by several vaadin applications. The library has GUIs which can be used in applications.

Currently, the styles for the GUIs in the library has to be manually added to the themes of depending applications. I am looking for a way go embed the styles in the library itself and use it just by a reference from the applications (just like the applications import the valo theme using following declaration).

@import "../valo/valo";

.my-theme {
  @include valo;
}

There is a solution mentioned in this answer, by using war overlays. But I cannot convert the library to a war due to some other reasons, so that solution is not going to work for me.

I think this should be doable since vaadin theme is actually on a jar, which we can import like mentioned above. But I don't know how.

Can anyone suggest me a way?

Answer 1

Create a new project with your favourite tooling (maven, gradle, ...) and make sure, that this building chain allows for compilation of the theme (eg via a plugin or allows you to execute (a) SASS compiler, see https://vaadin.com/book/vaadin7/-/page/themes.compiling.html )

Add the theme you like for base as dependency (eg com.vaadin:vaadin-themes . Then put your theme where you would usually put it in a project and follow the guide lines for proper SASS theme setup (see https://vaadin.com/book/vaadin7/-/page/themes.html#figure.themes.theme-contents and https://vaadin.com/book/vaadin7/-/page/themes.creating.html )

Build a jar from this project and check the content. Make sure, that all files composing this theme are in VAADIN/themes/<theme>/ within. Make sure, that there is a VAADIN/themes/<theme>/styles.css -- this is the compiled theme.

Deploy that jar to your local/company repository or use the jar directly in your projects.