vaadin10 - 如何获得 Vaadin Valo Facebook 主题

Question

所以，我是 Vaadin 的新手，但我有兴趣使用“Facebook”主题，如他们的演示所示：https ://demo.vaadin.com/valo-theme/#!buttons-and-links （和然后选择右上角的“Facebook”）。但是，当下载最新的 Vaadin 12 系统时，我无法弄清楚如何获得“Facebook”它们。该文档似乎仅暗示“Light”和“Material”可用......如果我确定这是我的应用程序的“最佳”主题，我如何获得Facebook主题？

Answer 1

您链接的测试应用程序 ( https://demo.vaadin.com/valo-theme/#!buttons-and-links ) 在 Vaadin 7 和 8 中演示了 Valo 主题的功能。因此这并不直接适用于 Vaadin 10+，例如 Vaadin 12。在 Vaadin 12 中有一个名为 Lumo 的新主题系统。正如您所注意到的，它有两个基本变体。Vaadin 8 的“facebook”变体是通过设置几个 Valo 的内部 SASS 变量来实现的（参见：https ://github.com/vaadin/valo-demo/blob/master/src/main/webapp/VAADIN/themes/测试-valo-facebook/_variables.scss）

在 Lumo 主题系统中，您可以使用 CSS 自定义属性来实现类似的效果。您可以在此处找到有关使用的自定义属性的一些信息：https ://cdn.vaadin.com/vaadin-lumo-styles/1.3.3/demo/customization.html因此，通过以类似方式设置选定的属性，您很可能会实现相似的东西。