volto-light-theme: Volto Theming, Reimagined
"kitconcept has been developing ""volto-light-theme"" during the last year. This theme is the placeholder of all the knowledge, feedback and the good practices that we've been learning the last years. The theme has some Volto add-ons peer dependencies: these are the add-ons that we consider ""essential"" to complement Volto.
They provide additional blocks and functionality as well. The Volto light theme is auto contained in an add-on, and can be used as theme in any Volto site using the ""theme"" directive in Volto. There is no need to create your own theme using volto-light-theme as skeleton, rather than that, you can extend the theme to match your styling requirements both in components and styles. It achieves both heavily using the build by enabling entry points that you can tap in other add-ons so you can add more styles to the original ""volto-light-theme"" build, rather and add (as in add the styles to the cascade) to the build.
It also uses SCSS as preprocessor of choice, using the custom Volto theme scape hatch. So the theme styles are entirely controled from the SCSS side. You can still use the normal Volto theming approach if needed (or more handy, like use some variables here and there). The ""volto-light-theme"" does not make use of SemanticUI in any of their components, so you are not tied to SemanticUI in any way.
It takes very seriously the vertical spacing between blocks and their relationships. Because of this, there is in place an special styleClassNameExtenders to extend the existing class names and enhance the DOM information and adjust styling accordingly. It also supports advanced block grouping via a custom group wrapper that also plays well with the vertical spacing needs. It uses a new layout model leveraging container queries. This allows a far more simpler styling of blocks both in render and edit mode and the removal of some hacks that were needed until now.
The Volto light theme makes heavy use of a docker development approach. It's used already in production sites and the overall feedback has been very positive."
