Hi,
I’m trying to create a vaadin standard layout for few apps. I would like to change dynamically some css properties (with theme variant for example). For example, changing the logo…
I try this:(inside my shared-styles.html).
I would like to be able to change a css property if the theme is dark.
/* Works but i need to define an extra variable */
p {
color:var(--custom-color);
}
/* does not work */
[theme~="dark"]
p {
background-color:grey;
}
Is there a solution to retrieve the theme on html inside the hello-world component ?
Is the first solution is the “right” way to override style inside webcomponent ?
You can find a full example (with some other stuff) here:
https://github.com/jcgueriaud/demo-vaadin-flow/blob/master/src/main/resources/META-INF/resources/frontend/styles/shared-styles.html
and
Thanks,