Enhance the CSS authoring guidelines

[xak]

https://github.com/SAP/techne/tree/v2.0/src https://github.com/SAP/techne/tree/v2.0/src/styles

Road Runner Rules: The road runner cannot harm the coyote, except by going ‘beep beep’

Highlights

• The lowest specificity possible is always desired.
• A CSS class should have a single purpose and styles applied should come from a single source, i.e., modifications to a component class should be in the component CSS to spread across multiple files.
• A layout never imposes padding or element styles on its children. It is only concerned with their horizontal or vertical alignment and spacing.
• Themes and other data attributes never force changes in appearance; they are always a context that layouts, components, and elements can subscribe to.
• A component always touches all four sides of its parent container. No element will have top or left margins, and all last children (right or bottom) will have their margins cleared.
• The component itself never has backgrounds, widths, floats, padding, or margins. Component styles only target the elements inside.
• Every element has a single, unique, component-scoped class. All styles are applied directly to that selector, modified only by contexts and themes.
• Elements never use top margins. The first element touches the top of its component.
• JavaScript is never bound to any element class. Functionality is “opted in” via is- classes or ARIA attributes.

[joseegm]

Low prio