Created by: joneff
In a nutshell:
- extract
color-yiq
mixin to a genericcontrast-yiq
function to be used for ensuring contrast; - introduce
$component-*
variables linked to$body-
variables; - link the following to
$body-
vars:- input; rationale: usually have the same background as body;
- table; rationale: transparent background; usually sit against body;
- link the following to
$component-
vars: - card, dropdowns, list groups, modals and popovers; rationale: one might want to change all components at once
- ensured contrast:
- in input, tooltip and progressbar, between text and background
- in table, for adequate hover / active background (with opacity)
- in the rest of the components, for adequate border color (with opacity)
Few notes:
- with the current variable set, the output will not be changed. It's only when one starts to play around;
- while modal and cards have a dedicated color for background, they lack one for color. In terms, it's inherited from the nearest ancestor;