el-react-ui/lib/themes/core.d.ts

Energylink React UI components

import { Colors } from '@/themes/colors/types';
export declare const normalize: import("styled-components").FlattenSimpleInterpolation;
export declare const fonts: {
    base: string;
    monospace: string;
};
export declare const fontSizes: number[];
export declare const borders: import("styled-system").TLengthStyledSystem[];
export declare const radii: import("styled-system").TLengthStyledSystem[];
export declare const space: number[];
export declare const breakpoints: string[];
export declare const fontWeights: number[];
export declare const lineHeights: {
    solid: number;
    title: number;
    copy: number;
};
export declare const shadows: {
    small: string;
    large: string;
};
export declare const letterSpacings: {
    normal: string;
    tracked: string;
    tight: string;
    mega: string;
};
export declare const buildTheme: (colors: Colors) => {
    breakpoints: string[];
    colors: Colors;
    space: number[];
    fontSizes: number[];
    fonts: {
        base: string;
        monospace: string;
    };
    fontWeights: number[];
    lineHeights: {
        solid: number;
        title: number;
        copy: number;
    };
    letterSpacings: {
        normal: string;
        tracked: string;
        tight: string;
        mega: string;
    };
    shadows: {
        small: string;
        large: string;
    };
    borders: import("styled-system").TLengthStyledSystem[];
    radii: import("styled-system").TLengthStyledSystem[];
    inputs: {
        base: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '::placeholder': {
                color: string;
            };
            '&:hover, &:active': {
                opacity: number;
                borderColor: string | string[];
            };
        };
        primary: {
            border: string;
            background: string | string[];
            color: string | string[];
            borderColor: string | string[];
            '::placeholder': {
                color: string | string[];
            };
            '&:hover, &:active': {
                opacity: number;
                borderColor: string;
            };
        };
        warning: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '::placeholder': {
                color: string;
            };
            '&:hover, &:active': {
                opacity: number;
                borderColor: string;
            };
        };
        danger: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '::placeholder': {
                color: string;
            };
            '&:hover, &:active': {
                opacity: number;
                borderColor: string;
            };
        };
        success: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '::placeholder': {
                color: string;
            };
            '&:hover, &:active': {
                opacity: number;
                borderColor: string;
            };
        };
    };
    buttons: {
        primary: {
            border: string;
            background: string | string[];
            color: string | string[];
            '&:hover, &:active': {
                opacity: number;
                background: string;
            };
        };
        success: {
            border: string;
            background: string;
            color: string | string[];
            '&:hover, &:active': {
                opacity: number;
                background: string;
            };
        };
        warning: {
            border: string;
            background: string;
            color: string | string[];
            '&:hover, &:active': {
                opacity: number;
                background: string;
            };
        };
        danger: {
            border: string;
            background: string;
            color: string | string[];
            '&:hover, &:active': {
                opacity: number;
                background: string;
            };
        };
        outlinedPrimary: {
            border: string;
            background: string | string[];
            color: string | string[];
            borderColor: string | string[];
            '&:hover, &:active': {
                opacity: number;
                color: string;
                borderColor: string;
            };
        };
        outlinedSuccess: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '&:hover, &:active': {
                opacity: number;
                color: string;
                borderColor: string;
            };
        };
        outlinedWarning: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '&:hover, &:active': {
                opacity: number;
                color: string;
                borderColor: string;
            };
        };
        outlinedDanger: {
            border: string;
            background: string | string[];
            color: string;
            borderColor: string;
            '&:hover, &:active': {
                opacity: number;
                color: string;
                borderColor: string;
            };
        };
    };
    Link: {
        cursor: string;
        textDecoration: string;
        '&:hover': {
            textDecoration: string;
        };
    };
    Input: {
        '&:disabled': {
            color: string;
            borderColor: string;
            '::placeholder': {
                color: string;
            };
            '&:hover': {
                '::placeholder': {
                    color: string;
                };
            };
        };
    };
};