Plone Classic UI Theming Based on Barceloneta
Contents
Plone Classic UI Theming Based on Barceloneta#
Todo
This page is only an outline and needs a lot of work.
Use of SCSS
Colors, fonts and sizes via variable changeable
Properties for shadows, rounded corners, gradients.
plonetheme.barceloneta
npm package for includesbobtemplates.plone
templateTheming is based on Twitter Bootstrap 5
We used Bootstrap markup in templates
We used Bootstrap components wherever possible
Most of the look and feel can be changed via Bootstrap's variables
Hint: order is important in SCSS
Theme Package#
Generated theme package can be uploaded as ZIP-file
npm Package#
npm package with files required for Plone
dependencies required by theme to compile
Bootstrap Components#
Default components are extended with some custom components, such as a select or dropdown menu.
We use Boostrap variables in these cases.
Add-Ons and Templates#
Make life easy with...
use Bootstrap markup
use Bootstrap components
use Bootstrap variables