code-colors-react/lib/style.js

Code syntax highlighting React component

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.css = exports.palette = void 0;
const nano_theme_1 = require("nano-theme");
exports.palette = {
    mono1: "hsl(230, 8%, 24%)",
    mono2: "hsl(230, 6%, 44%)",
    mono3: "hsl(230, 4%, 64%)",
    col1: "#2795EE",
    col2: "hsl(221, 87%, 60%)",
    col3: "#a626a4",
    // hue4: 'hsl(119, 34%, 47%)',
    // hue4: theme.color.color[6],
    col4: "#718C00",
    col5: "hsl(5, 74%, 59%)",
    // hue5: theme.color.color[6],
    col6: "hsl(35, 99%, 36%)",
    negative: nano_theme_1.theme.color.sem.negative[2],
    // positive: theme.color.sem.positive[1],
    positive: "#718C00",
};
const backgroundPadding = {
    d: "inline-block",
    bdrad: ".4em",
    mar: "-.1em",
    pad: ".1em",
};
const css = ({ mono1, mono2 = mono1, mono3 = mono2, col1 = mono1, col2 = mono2, col3 = mono3, col4 = mono1, col5 = mono2, col6 = mono3, negative = col5, positive = col4, string: str = col4, keyword = col3, builtin = col4, "class-name": className = col5, function: func = col2, boolean = col2, number = col6, float = number, char = col4, symbol = col5, regex = col4, operator = col1, variable = col2, constant = col6, property = mono1, punctuation = mono1, important = col5, tag = col5, "attr-name": attrName = mono3, "attr-value": attrValue = col4, atrule = col3, selector = col1, nil = mono3, undef = mono3, } = exports.palette) => {
    const lightBg = "rgba(127,127,127,.1)";
    const lighterBg = "rgba(127,127,127,.04)";
    return {
        col: mono1,
        ".token": {
            "&.comment,&.prolog,&.cdata": {
                col: mono3,
            },
            "&.doctype": {
                col: mono1,
                fw: "bold",
            },
            "&.entity": {
                col: mono1,
                cur: "help",
            },
            "&.keyword": {
                col: keyword,
                "&[text=null],&[text=nil]": {
                    col: nil,
                },
                "&[text=undefined]": {
                    col: undef,
                },
            },
            "&.builtin": {
                col: builtin,
            },
            "&.class-name": {
                col: className,
            },
            "&.important": {
                col: important,
            },
            "&.function": {
                col: func,
            },
            "&.boolean": {
                col: boolean,
            },
            "&.number": Object.assign(Object.assign({}, backgroundPadding), { col: number, '&[text*="."]': {
                    col: float,
                } }),
            "&.string": {
                col: str,
            },
            "&.char": {
                col: char,
            },
            "&.symbol": {
                col: symbol,
            },
            "&.regex": {
                col: regex,
            },
            "&.url.string": {
                td: "underline",
                textUnderlineOffset: "3px",
            },
            "&.operator": {
                col: operator,
            },
            "&.variable": {
                col: variable,
            },
            "&.constant": {
                col: constant,
            },
            "&.property": {
                col: property,
            },
            "&.punctuation": {
                col: punctuation,
                '&[text="."]': {
                    col: mono3,
                },
            },
            "&.tag": {
                col: tag,
            },
            "&.attr-name": {
                col: attrName,
            },
            "&.attr-value": {
                col: attrValue,
            },
            "&.atrule,&.rule": {
                col: atrule,
            },
            "&.atrule": Object.assign(Object.assign({}, backgroundPadding), { bg: lighterBg }),
            "&.selector": {
                col: selector,
            },
            "&.coord": {
                col: mono3,
            },
            "&.inserted": {
                col: positive,
                "&.prefix": Object.assign(Object.assign({}, backgroundPadding), { bg: lighterBg }),
            },
            "&.deleted": {
                col: negative,
                "&.prefix": Object.assign(Object.assign({}, backgroundPadding), { bg: lighterBg }),
            },
            "&.content": {
                color: col2,
            },
            "&.code-snippet": {
                color: col4,
            },
            "&.bold": {
                fw: "bold",
            },
            "&.italic": {
                fs: "italic",
            },
            "&.namespace": {
                op: 0.8,
            },
        },
        ".language-json": {
            ".token": {
                "&.property": {
                    fw: "bold",
                },
            },
        },
        ".language-css": {
            ".token": {
                "&.property": {
                    col: mono3,
                },
            },
        },
    };
};
exports.css = css;