![]() Adding the `button` mixin into `input[type="submit"] caused conflicts with the other button classes (`.button-primary`) due to specificity. The button classes should be used on all buttons instead. This also updates which button on the Manage Pledge form is the "primary" action, since it's easy to skip the Update button when it's not primary. |
||
---|---|---|
.. | ||
base | ||
components | ||
generic | ||
objects | ||
settings | ||
tools | ||
utilities | ||
README.md | ||
style-editor.scss | ||
style.scss |
CSS Structure
This loosely follows ITCSS.
01 Settings
Typography, colors, any spacing variables, etc should be set here.
02 Tools
This contains any mixins. We inherit the following libraries:
- breakpoint
- kube
- modular-scale
03 Generic
Any generic styles. Used for normalize & reset styles. We inherit:
- kube
- normalize
04 Base (aka Elements)
Styles for plain html elements. We inherit the base theme's styling here.
05 Objects
These are pieces of UI. These should be self-contained (or nested so that they are self-contained). Blocks should be defined here.
06 Components
This section puts together the base and objects to create pages. Page-specific styles are defined here.
07 Utilities
The is-*
/has-*
classes, these custom classes override previous styles. For example, has-background
would be
defined here. This is where block styles should live.
Editor Styles
Editor styles will use a custom import of a subset of the above folders, TBD?