mirror of https://github.com/openedx/paragon.git
57 lines
1.3 KiB
JavaScript
57 lines
1.3 KiB
JavaScript
/**
|
|
* Implements bg-variant mixin from bootstrap. Creates utility classes for background colors based on theme color.
|
|
*/
|
|
function bgVariant(token) {
|
|
const { attributes: { type, item }, name, actions } = token;
|
|
const parent = `.bg-${type}${item === 'base' ? '' : `-${item}`}`;
|
|
return `${parent} {
|
|
background-color: ${`var(--${name})`} !important;
|
|
}
|
|
|
|
a${parent}:hover,
|
|
a${parent}:focus,
|
|
button${parent}:hover,
|
|
button${parent}:focus {
|
|
background-color: ${actions.default} !important;
|
|
}
|
|
|
|
`;
|
|
}
|
|
|
|
/**
|
|
* Implements text-emphasis-variant mixin from bootstrap. Creates utility classes for text colors based on theme color.
|
|
*/
|
|
function textEmphasisVariant(token) {
|
|
const { attributes: { type, item }, name, actions } = token;
|
|
const parent = `.text-${type}${item === 'base' ? '' : `-${item}`}`;
|
|
return `${parent} {
|
|
color: ${`var(--${name})`} !important;
|
|
}
|
|
|
|
a${parent}:hover,
|
|
a${parent}:focus {
|
|
color: ${actions.default} !important;
|
|
}
|
|
|
|
`;
|
|
}
|
|
|
|
/**
|
|
* Creates utility class for border color.
|
|
*/
|
|
function borderColor(token) {
|
|
const { attributes: { type, item }, name } = token;
|
|
const className = `.border-${type}${item === 'base' ? '' : `-${item}`}`;
|
|
return `${className} {
|
|
border-color: ${`var(--${name})`} !important;
|
|
}
|
|
|
|
`;
|
|
}
|
|
|
|
module.exports = {
|
|
bgVariant,
|
|
textEmphasisVariant,
|
|
borderColor,
|
|
};
|