"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.body2 = exports.body1 = exports.title4 = exports.title3 = exports.title2 = exports.title1 = exports.headline6 = exports.headline5 = exports.headline4 = exports.headline3 = exports.headline2 = exports.headline1 = exports.typography = void 0;
const react_1 = require("@emotion/react");
const Colors_1 = require("../Colors");
const DEFAULT_TEXT_COLOR = Colors_1.basicColors.gray900;
const DEFAULT_HEADLINE_TEXT_FONT_WEIGHT = 600;
const DEFAULT_TITLE_TEXT_FONT_WEIGHT = 500;
const DEFAULT_BODY_TEXT_FONT_WEIGHT = 400;
exports.typography = {
    h1: (0, react_1.css) `
		font-size: 41px;
		line-height: 56px;
		letter-spacing: -0.8px;
		font-weight: ${DEFAULT_HEADLINE_TEXT_FONT_WEIGHT};
	`,
    h2: (0, react_1.css) `
		font-size: 29px;
		line-height: 38px;
		letter-spacing: -0.4px;
		font-weight: ${DEFAULT_HEADLINE_TEXT_FONT_WEIGHT};
	`,
    h3: (0, react_1.css) `
		font-size: 23px;
		line-height: 32px;
		letter-spacing: -0.3px;
		font-weight: ${DEFAULT_HEADLINE_TEXT_FONT_WEIGHT};
	`,
    h4: (0, react_1.css) `
		font-size: 19px;
		line-height: 26px;
		letter-spacing: -0.3px;
		font-weight: ${DEFAULT_HEADLINE_TEXT_FONT_WEIGHT};
	`,
    h5: (0, react_1.css) `
		font-size: 17px;
		line-height: 24px;
		letter-spacing: -0.3px;
		font-weight: ${DEFAULT_HEADLINE_TEXT_FONT_WEIGHT};
	`,
    h6: (0, react_1.css) `
		font-size: 15px;
		line-height: 22px;
		letter-spacing: -0.2px;
		font-weight: ${DEFAULT_HEADLINE_TEXT_FONT_WEIGHT};
	`,
    title1: (0, react_1.css) `
		font-size: 19px;
		line-height: 26px;
		letter-spacing: -0.3px;
		font-weight: ${DEFAULT_TITLE_TEXT_FONT_WEIGHT};
	`,
    title2: (0, react_1.css) `
		font-size: 17px;
		line-height: 24px;
		letter-spacing: -0.2px;
		font-weight: ${DEFAULT_TITLE_TEXT_FONT_WEIGHT};
	`,
    title3: (0, react_1.css) `
		font-size: 15px;
		line-height: 22px;
		letter-spacing: -0.2px;
		font-weight: ${DEFAULT_TITLE_TEXT_FONT_WEIGHT};
	`,
    title4: (0, react_1.css) `
		font-size: 13px;
		line-height: 18px;
		letter-spacing: -0.2px;
		font-weight: ${DEFAULT_TITLE_TEXT_FONT_WEIGHT};
	`,
    body1: (0, react_1.css) `
		font-size: 15px;
		line-height: 22px;
		letter-spacing: -0.2px;
		font-weight: ${DEFAULT_BODY_TEXT_FONT_WEIGHT};
	`,
    body2: (0, react_1.css) `
		font-size: 13px;
		line-height: 18px;
		letter-spacing: -0.2px;
		font-weight: ${DEFAULT_BODY_TEXT_FONT_WEIGHT};
	`,
};
const headline1 = (args) => (0, react_1.css) `
	${exports.typography.h1};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.headline1 = headline1;
const headline2 = (args) => (0, react_1.css) `
	${exports.typography.h2};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.headline2 = headline2;
const headline3 = (args) => (0, react_1.css) `
	${exports.typography.h3};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.headline3 = headline3;
const headline4 = (args) => (0, react_1.css) `
	${exports.typography.h4};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.headline4 = headline4;
const headline5 = (args) => (0, react_1.css) `
	${exports.typography.h5};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.headline5 = headline5;
const headline6 = (args) => (0, react_1.css) `
	${exports.typography.h6};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.headline6 = headline6;
const title1 = (args) => (0, react_1.css) `
	${exports.typography.title1};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.title1 = title1;
const title2 = (args) => (0, react_1.css) `
	${exports.typography.title2};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.title2 = title2;
const title3 = (args) => (0, react_1.css) `
	${exports.typography.title3};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.title3 = title3;
const title4 = (args) => (0, react_1.css) `
	${exports.typography.title4};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.title4 = title4;
const body1 = (args) => (0, react_1.css) `
	${exports.typography.body1};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.body1 = body1;
const body2 = (args) => (0, react_1.css) `
	${exports.typography.body2};
	margin: 0;
	color: ${(args && args.color) || DEFAULT_TEXT_COLOR};
`;
exports.body2 = body2;
