tweak-tools/dist/components/Tweak/StyledRoot.js

Tweak your React projects until awesomeness

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.StyledRoot = void 0;
const styles_1 = require("../../styles");
const StyledUI_1 = require("../UI/StyledUI");
exports.StyledRoot = (0, styles_1.styled)('div', {
    /* position */
    position: 'relative',
    fontFamily: '$mono',
    fontSize: '$root',
    color: '$rootText',
    backgroundColor: '$elevation1',
    variants: {
        fill: {
            false: {
                position: 'fixed',
                top: '10px',
                right: '10px',
                zIndex: 1000,
                width: '$rootWidth',
            },
            true: {
                position: 'relative',
                width: '100%',
            },
        },
        flat: {
            false: {
                borderRadius: '$lg',
                boxShadow: '$level1',
            },
        },
        oneLineLabels: {
            true: {
                [`${StyledUI_1.StyledInputRow}`]: {
                    gridTemplateColumns: 'auto',
                    gridAutoColumns: 'minmax(max-content, 1fr)',
                    gridAutoRows: 'minmax($sizes$rowHeight), auto)',
                    rowGap: 0,
                    columnGap: 0,
                    marginTop: '$rowGap',
                },
            },
        },
        hideTitleBar: {
            true: { $$titleBarHeight: '0px' },
            false: { $$titleBarHeight: '$sizes$titleBarHeight' },
        },
    },
    '&,*,*:after,*:before': {
        boxSizing: 'border-box',
    },
    '*::selection': {
        backgroundColor: '$accent2',
    },
});