@reusable-ui/typos/dist/configs/kbds.js

Texts, paragraphs, fonts and more.

// cssfn:
import { 
// reads/writes css variables configuration:
cssConfig, } from '@cssfn/core'; // writes css in javascript
// reusable-ui configs:
import { 
// configs:
colors, } from '@reusable-ui/colors'; // a color management system
// internals:
import { 
// configs:
marks, } from './marks.js';
import { 
// configs:
codes, } from './codes.js';
// configs:
export const [kbds, kbdValues, cssKbdConfig] = cssConfig(() => {
    return {
        // backgrounds:
        backg: colors.grayDark,
        // foregrounds:
        foreg: colors.white,
        // borders:
        border: marks.border,
        borderRadius: marks.borderRadius,
        // spacings:
        paddingInline: '0.4em',
        paddingBlock: '0.2em',
        // typos:
        fontSize: codes.fontSize,
        fontFamily: codes.fontFamily,
        fontWeight: codes.fontWeight,
        fontStyle: codes.fontStyle,
        textDecoration: codes.textDecoration,
        lineHeight: codes.lineHeight,
        overflowWrap: codes.overflowWrap,
    };
}, { prefix: 'kbd' });
export { kbds as default };