A tiny css boilerplate
git clone https://github.com/yoshuawuyts/anchor-css
npm install
gulp styles
- Flexbox centric
- Sensible defaults only
- Roles > class selectors
- Built for today's browsers
- <10 kb
There's no such thing as a semantic class, roles are the only way to convey context. If you use roles as selectors you get screen reader support for free. Classes are only used as modifiers or to style non-visible elements (e.g. grids). I have no idea what an ID is.
.
├── utilities // helper classes
│ ├── base
│ ├── colors
│ ├── grid
│ └── media
├── micro // atoms
│ ├── animations
│ ├── buttons
│ ├── forms
│ ├── images
│ ├── navigation
│ ├── progress
│ ├── tables
│ └── typography
└── macro // widgets
├── dialogs
└── feedback
MIT © Yoshua Wuyts