0

So, I'm new to Vaadin, but am interested in using the "Facebook" theme as shown in their demo from here: https://demo.vaadin.com/valo-theme/#!buttons-and-links (and then choose "Facebook" in the top right corner). But, when downloading the latest Vaadin 12 system, I can't figure out how to get the "Facebook" them. The documentation only seems to imply that "Light" and "Material" are available....How do I get the Facebook theme if that's what I've determine is the "best" for my app?

Jonathan Sylvester
  • 1,275
  • 10
  • 23

1 Answers1

2

The test app you linked ( https://demo.vaadin.com/valo-theme/#!buttons-and-links ) demonstrates features of Valo theme in Vaadin 7 & 8. So this is not directly applicable for Vaadin 10+, e.g. Vaadin 12. In Vaadin 12 there is a new theme system called Lumo. And as you have noticed there are two base variants of it. That "facebook" variant for Vaadin 8 is implemented by just setting few internal SASS variables of Valo (see: https://github.com/vaadin/valo-demo/blob/master/src/main/webapp/VAADIN/themes/tests-valo-facebook/_variables.scss )

In Lumo theming system you can achieve something similar by using the CSS custom properties. You can find some information about used custom properties here: https://cdn.vaadin.com/vaadin-lumo-styles/1.3.3/demo/customization.html So by setting selected properties in similar fashion, you could most likely achieve something similar.

Tatu Lund
  • 9,949
  • 1
  • 12
  • 26