"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.BadgeContent = exports.Badge = exports.Dot = void 0;
const styled_1 = __importDefault(require("@emotion/styled"));
const react_1 = require("@emotion/react");
const core_1 = require("../../../core");
const NoticationBgColor = core_1.basicColors.red400;
const ContentHeight = '16px';
const CommonStyle = (0, react_1.css) `
	background-color: ${NoticationBgColor};
`;
exports.Dot = styled_1.default.div `
	${CommonStyle};

	width: 5px;
	height: 5px;
	border-radius: 50%;
`;
exports.Badge = styled_1.default.div `
	${CommonStyle};

	height: ${ContentHeight};
	padding: 0 5px;
	border-radius: 8px;

	display: flex;
	align-items: center;
	justify-content: center;
`;
exports.BadgeContent = styled_1.default.div `
	line-height: initial;

	font-size: 11px;
	font-weight: 500;
	color: ${core_1.basicColors.white};
	letter-spacing: -0.2px;
`;
