Allow developers to avoid applying semantic-ui to public facing views

[pnicolli]

Draft of the work to fix #842.

To test this, customize src/theme.js in your own volto-app and apply the changes suggested in the comment.
To add your own styles for public facing views, add them in your theme.js customization.

This is still experimental, still has Italian comments (sorry :P ), but I wanted to post this for anyone who wants to test this approach.

Disclaimer: the naming backend/frontend for cms views and public views is confusing and temporary and has to be replaced somehow. Suggestions on naming are accepted.

[pnicolli]

One thing I can already tell you I will work on is code splitting. I would love to load semantic-ui only for logged-in users, when using this approach.

[djay]

Agree the frontend/backend names aren’t useful. public-ui vs admin-ui? (even though public could be private to some users?). themed vs edit-ui? display vs edit?

[djay]

@pnicolli One thing to keep in mind is that Plones in-line approach is the outlier and most CMS systems have an admin-ui and a theme and they aren't the same thing. Systems like django come with an admin-ui and no theme, they are essentially headless. So perhaps its about calling it themed vs non-themed admin UI? Or perhaps its closer to django where you have no public view so its a headless CMS with volto admin UI?

[pnicolli]

Changed the naming from backend/frontend to cms-ui/public-ui

[pnicolli]

We have a first version of a volto theme using bootstrap for public views and pastanaga for the cms views here

It's really just a bunch of configurations at this time (notice especially razzle.config.js) and the import of our base scss styles inside src/theme.js.

[tisto]

@pnicolli awesome!

[sneridagh]

@pnicolli Woohooo! Questions, questions!

https://github.com/RedTurtle/design-volto-theme/blob/master/src/theme.js#L10 Did you managed to make it work with a local non-released @plone/volto repo using mrs.developer? I will try to document asap but for sure you are going to need it.

Another, how about code splitting? Did you already play with it?

[pnicolli]

@sneridagh mrs.developer wasn't involved at this time, we just used this PR branch split_styles in order to test it: https://github.com/RedTurtle/design-volto-theme/blob/master/package.json#L62
We will try to use mrs.developer or something similar (will actually probably try yarn link first, it's usually my preferred tool) asap in order to add lazy loading stuff. Actually, in order to do that, merging the main lazy-loading machinery would be awesome. So the second answer is no, we didn't try lazy loading stuff yet.

[tiberiuichim]

@nzambello @pnicolli With current Volto it's possible to load scss really easy, no need for the separate razzle loader declaration. I've done it like this: https://github.com/eea/volto-searchkit/blob/master/razzle.extend.js

This uses the https://www.npmjs.com/package/razzle-plugin-scss official plugin

[nzambello]

@tiberiuichim nice, I'm testing it: RedTurtle/design-volto-theme#82

[nzambello]

@tiberiuichim updated the docs for the sass loader

[tisto]

Notes from Volto early adopters meeting today:

• Timo will review this PR over the weekend
• we will discuss this PR on the next @plone/volto-team meeting next Tuesday

[avoinea]

LGTM

[tisto]

Note @plone/volto-team meeting:

• Minor release
• No breaking is expected
• The release will happen soon (today or tomorrow)

[nzambello]

Woah! Thank you @tisto
Months of work completed, hooray! 🎉

[tisto]

@nzambello thank you for working on this and contributing your work to Volto!!! Awesome work! Sorry, it took me so long to review and merge.