goobs-frontend/dist/theme/typography.d.ts

A comprehensive React-based libary for building modern web applications

import { default as React } from 'react';
export interface TypographyTheme {
    base: {
        margin: string;
        padding: string;
        lineHeight: string | number;
        letterSpacing: string;
        position: string;
        transition: string;
    };
    variants: {
        merrih1: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrih2: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrih3: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrih4: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrih5: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrih6: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merriparagraph: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrihelperfooter: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        merrihelperheader: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelh1: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelh2: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelh3: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelh4: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelh5: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelh6: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelparagraph: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelhelperfooter: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
        cinzelhelperheader: {
            fontSize: string;
            fontWeight: string | number;
            fontFamily: string;
            color: string;
            textShadow?: string;
            animation?: string;
        };
    };
    alignment: {
        left: {
            textAlign: 'left';
        };
        center: {
            textAlign: 'center';
        };
        right: {
            textAlign: 'right';
        };
    };
    gutterBottom: {
        marginBottom: string;
    };
    outline: {
        textStroke: string;
        WebkitTextStroke: string;
    };
}
export interface TypographyStyles {
    theme?: 'light' | 'dark' | 'sacred';
    variant?: 'merrih1' | 'merrih2' | 'merrih3' | 'merrih4' | 'merrih5' | 'merrih6' | 'merriparagraph' | 'merrihelperfooter' | 'merrihelperheader' | 'cinzelh1' | 'cinzelh2' | 'cinzelh3' | 'cinzelh4' | 'cinzelh5' | 'cinzelh6' | 'cinzelparagraph' | 'cinzelhelperfooter' | 'cinzelhelperheader';
    color?: string;
    fontSize?: string;
    fontWeight?: string | number;
    fontFamily?: string;
    fontStyle?: string;
    textShadow?: string;
    textAlign?: 'left' | 'center' | 'right';
    lineHeight?: string | number;
    letterSpacing?: string;
    margin?: string;
    marginTop?: string;
    marginBottom?: string;
    marginLeft?: string;
    marginRight?: string;
    padding?: string;
    paddingTop?: string;
    paddingBottom?: string;
    paddingLeft?: string;
    paddingRight?: string;
    gutterBottom?: boolean;
    outline?: boolean;
    transitionDuration?: string;
    transitionEasing?: string;
    animation?: string;
    animationDelay?: string;
    width?: string;
    maxWidth?: string;
    minWidth?: string;
    height?: string;
    maxHeight?: string;
    minHeight?: string;
    position?: string;
}
export declare const typographyThemes: Record<'light' | 'dark' | 'sacred', TypographyTheme>;
export declare const getTypographyTheme: (styles?: TypographyStyles) => TypographyTheme;
export declare const getTypographyStyles: (styles?: TypographyStyles) => {
    container: React.CSSProperties;
};
//# sourceMappingURL=typography.d.ts.map