plonetheme.barceloneta-1.6.21-1.lbn19.noarch

Barceloneta is the name of the Plone 5 default theme. It's named after the Barcelona beach and neighbourhood. Barceloneta is a Diazo theme made from scratch using modern frontend technologies. It's responsive and spans throught all the Plone UI including the CMS backend part.

It's based on Bootstrap 3, but it's not dependent of it in any way. Although it reuses some of the structure and good practices of the original Bootstrap, it has its own personality and is fully adapted to Plone. Structure

Barceloneta uses LESS as a pre-processor to generate the resultant stylesheet. The LESS resources live in the plonetheme.barceloneta egg in the plonetheme/barceloneta/theme/less directory:

plonetheme/barceloneta/theme/less ├── accessibility.plone.less ├── alerts.plone.less ├── barceloneta-compiled.css ├── barceloneta-compiled.css.map ├── barceloneta.css ├── barceloneta.plone.export.less ├── barceloneta.plone.less ├── barceloneta.plone.local.less ├── behaviors.plone.less ├── breadcrumbs.plone.less ├── buttons.plone.less ├── code.plone.less ├── contents.plone.less ├── controlpanels.plone.less ├── deco.plone.less ├── discussion.plone.less ├── dropzone.plone.less ├── event.plone.less ├── fonts.plone.less ├── footer.plone.less ├── forms.plone.less ├── formtabbing.plone.less ├── grid.plone.less ├── header.plone.less ├── image.plone.less ├── loginform.plone.less ├── main.plone.less ├── mixin.borderradius.plone.less ├── mixin.buttons.plone.less ├── mixin.clearfix.plone.less ├── mixin.forms.plone.less ├── mixin.grid.plone.less ├── mixin.gridframework.plone.less ├── mixin.images.plone.less ├── mixin.prefixes.plone.less ├── mixin.tabfocus.plone.less ├── modal.plone.less ├── normalize.plone.less ├── pagination.plone.less ├── pickadate.plone.less ├── plone-toolbarlogo.svg ├── portlets.plone.less ├── print.plone.less ├── roboto ├── scaffolding.plone.less ├── search.plone.less ├── sitemap.plone.less ├── sitenav.plone.less ├── sortable.plone.less ├── states.plone.less ├── tables.plone.less ├── tablesorter.plone.less ├── tags.plone.less ├── thumbs.plone.less ├── toc.plone.less ├── tooltip.plone.less ├── tree.plone.less ├── type.plone.less ├── variables.plone.less └── views.plone.less

They are divided by base styling, layout, function, components and views, so they could be easily reusable and extended from other themes. The main LESS resource that imports all the others is barceloneta.plone.less.

It has a set of LESS variables that can be overriden either through the web using the Theming control panel or by reusing it in your own theme. They include colors, sizes, fonts and other useful parameters.

Barceloneta makes use of the new Diazo bundle to expose its resources to Plone using the Resource Registries. As it is a pure Diazo theme, it keeps a low profile being Plone agnostic and only containing the theme itself. Changes from previous versions of Plone

Regarding markup and comparing to the previous versions of Plone, Barceloneta introduced lots of changes in the default Plone markup to modernize it and make it more accessible. There are few parts of rendering Plone that were not updated.

However, any class or id that was stripped away from Plone was done with the purpose of making upgrades and adaptations of existing Diazo themes easy. Whenever possible additional classes and ids were introduced being always domain namespaced plone-*.