Toura/mulberry — Issue #194: Remove all style settings from page templates
Author: mrdanimal
Created: 2011-12-12 21:20:35+00:00
State: open

The page template yaml files are a strange mix of layout (defining rows, columns, size options) and controller configuration (capabilities). The layout options are limited to a very specific types of layout because all rows and columns get the `.region` class which forces you to use the flex-box model. This is useful in many cases, but not all. There is also the odd `size:fixed` option, which is useful for fixed navs, but not much else. Screens also have an odd `backgroundImage` option which is very limited and not useful for styling, but is used by our internal CMS.

As a general rule, we've made styles reusable by defining Sass mixins instead of classnames, because this is far more flexible, but page templates is one case that breaks this rule.

I propose that we remove the concept of rows, columns, and all style options from page templates, and handle this with mixins, and that page templates in effect, cease to be 'templates'

Regions would simply be a container for components and have an optional scrollable parameter and an optional className for styling. e.g.

screens:
- name: index
regions:
- components:
- PageNav
- components:
- ImageGallery
- components:
- AudioPlayer
- regions:
- className:
scrollable: true
components:
- AudioList
- ChildNodes
- AudioCaption
- ImageCaption
- BodyText

To maintain the current row/column and size:fixed functionality we'd have a few mixins: column-container, row-container, column, row, size-fixed, that would be applied in the page scss. This gives us the ability to create mixins for other types of layouts (modal overlays, fixed grid layouts, etc). And it will help us handle different orientations more elegantly because regions could easily be styled as rows/columns/whatever in different contexts.

Since page templates would cease to be "templates" we should consider a new name for them. They seem to be more page configurations than templates. Possibly just calling them 'pages' is adequate. Within themes, `/default/templates/` would change to `/default/pages` for consistency.

The `backgroundImage` parameter on screen would be more difficult to get rid of, since this is how we attach background images to a node exported from MAP, and I honestly don't see an easy way to eliminate this dependency.