I was trying to figure out where, exactly, I was supposed to add theme=“dark” and the reference to “valo-colors” in my own Polymer layout. I stumbled upon the following by googling (!)
reference the above mentioned document on valo theming/styling in the flow documentation
tell people where to ask questions about Flow – there is no reference to this forum, found it by luck at the bottom of the list, am not even sure anyone from Vaadin reads it.
Include an example of applying the dark theme in a polymer layout (declaratively, with the correct inclusion of valo-colors, preferably in a layout that only includes an off-the-shelf component. A fully worked out paper-slider example, dark and light, without the rest, would be nice).
Where can one find the proper current version numbers for the now quite numerous Maven, Springboot, Bower dependencies…
Great to see you trying out Valo! And sorry about the state of our documentation at the moment. The link to the theming and styling documentations are very well hidden at the moment, in https://vaadin.com/elements/themes. Those will eventually be available more visible, the current plan being vaadin.com/themes, and more visible linked from other documentation.
Also, please update to the latest version of the theme if at all possible. Not sure about your current setup, though. If you are using an older platform version (up to 10.0 alpha10), the latest suitable theme version is 2.0 alpha5 (
documentation ). If you are using platform alpha11 or later then you are using alpha7 or later (
documentation ).
Ha, seems we don’t even have the
Gitter chat link visible in vaadin.com/flow. Luckily you already found that. I’ll ping the website team, let’s hope they find the time to add a link to the website
Thanks for the feedback – I’ll be asking “noob” questions, things that are obvious to the team are not necessarily as clear when coming in"clean".
For example : I’m on 10.0.0.alpha11 – this is already a confusing aspect, as in the past there was one Vaadin, and people thought of the server side. Took me quite a while to figure out that 10.0 referred to the the client side and that the other piece was 1.0-SNAPSHOT (Flow for the server side). Then until I found the “Releases” page on GitHub I had no clue the UI-server-side had been moved, and I thought I was mishandling my Maven. Lost a few hours there.
Concerning the dark theme example, I did manage to get things working. But the example doesn’t show clearly how to a) have a fully dark page – this needs to be shown both for the Java-only style and for the Polymer template style and b) how to have a user-switcheable light/dark theme (both for the Java-only and Polymer-template).
For a Polymer template, the following appears to be sufficient (slap a theme=“dark” on the top-level “div”) but this might be fragile – there is no html tag in the full-page Polymer templates I have seen, or else I’m confused, I’m learning by monkeying the beveragebuddy reviews-list.html page.
Absolutely, and those questions are really important for us, to see where our documentation (or features) are lacking.
You can also “slap” theme=“dark” on the HTML element if you want. Though, I’m right now reconsidering this feature, as it doesn’t work in IE11 and Edge14 (lack of native CSS custom properties support), so you’re right to say it might be fragile.
If we remove that, then having a light/dark theme switcher for the end user will be a bit more complicated to implement, as it basically requires a bit of JavaScript to run the ShadyCSS polyfill to recompute the custom property values.
ps. I see you’re still working on the weight-lifting software if my guess is right
