Come creare diversi temi su Valo in Vaadin?

Question

Ora è uscito Vaadin 7.3 ed ha il bellissimo Valo Theme. Ma non so come importarlo nel mio progetto? Ora sto usando un tema predefinito con i miei file scss personalizzati. Mi piacerebbe assaggiare Valo. Per favore qualcuno mi aiuti a importare il tema valo nel mio progetto.

Più oltre, come posso scegliere gli stili di tema? Valo Theme Demo ha diversi stili di tema come Default, Blueprint, Dark, Metro, Flat. Come scegliere queste categorie come vorrei?

Answer 1

leggere il fine manuale: https://vaadin.com/book/vaadin7/-/page/themes.valo.html#themes.valo.use

c'è una intera sezione dedicata alla Valo

i diversi temi in cima Valo come si vede nella valo-demo sono tutti fatti con l'impostazione delle principali variabili SASS visto nel libro.

ad es. https://github.com/vaadin/valo-demo/blob/master/src/main/webapp/VAADIN/themes/tests-valo-flatdark/_variables.scss

Answer 2

A seguito della risposta accettata, è possibile specificare il tema utilizzando il @Theme annotazioni sul Class UI ed estendere il tema con la creazione di una cartella con il nome del vostro tema sotto VAADIN\themes.

All'interno di tale cartella devi creare uno styles.scss e .scss:

styles.scss

@import "licensing.scss"; 

.licensing { 
    @include licensing; 
} 

licensing.scss

@import "../valo/valo.scss"; 

@mixin licensing { 
    @include valo; 
} 

Tema della nota: Example on github.

File di tema: Example theme folder.