123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109 |
- "use strict";
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = void 0;
- var _cssinjs = require("@ant-design/cssinjs");
- var _ = require(".");
- var _style = require("../../style");
- var _internal = require("../../theme/internal");
- // Style as confirm component
- // ============================= Confirm ==============================
- const genModalConfirmStyle = token => {
- const {
- componentCls,
- titleFontSize,
- titleLineHeight,
- modalConfirmIconSize,
- fontSize,
- lineHeight,
- modalTitleHeight,
- fontHeight,
- confirmBodyPadding
- } = token;
- const confirmComponentCls = `${componentCls}-confirm`;
- return {
- [confirmComponentCls]: {
- '&-rtl': {
- direction: 'rtl'
- },
- [`${token.antCls}-modal-header`]: {
- display: 'none'
- },
- [`${confirmComponentCls}-body-wrapper`]: Object.assign({}, (0, _style.clearFix)()),
- [`&${componentCls} ${componentCls}-body`]: {
- padding: confirmBodyPadding
- },
- // ====================== Body ======================
- [`${confirmComponentCls}-body`]: {
- display: 'flex',
- flexWrap: 'nowrap',
- alignItems: 'start',
- [`> ${token.iconCls}`]: {
- flex: 'none',
- fontSize: modalConfirmIconSize,
- marginInlineEnd: token.confirmIconMarginInlineEnd,
- marginTop: token.calc(token.calc(fontHeight).sub(modalConfirmIconSize).equal()).div(2).equal()
- },
- [`&-has-title > ${token.iconCls}`]: {
- marginTop: token.calc(token.calc(modalTitleHeight).sub(modalConfirmIconSize).equal()).div(2).equal()
- }
- },
- [`${confirmComponentCls}-paragraph`]: {
- display: 'flex',
- flexDirection: 'column',
- flex: 'auto',
- rowGap: token.marginXS,
- // https://github.com/ant-design/ant-design/issues/51912
- maxWidth: `calc(100% - ${(0, _cssinjs.unit)(token.marginSM)})`
- },
- // https://github.com/ant-design/ant-design/issues/48159
- [`${token.iconCls} + ${confirmComponentCls}-paragraph`]: {
- maxWidth: `calc(100% - ${(0, _cssinjs.unit)(token.calc(token.modalConfirmIconSize).add(token.marginSM).equal())})`
- },
- [`${confirmComponentCls}-title`]: {
- color: token.colorTextHeading,
- fontWeight: token.fontWeightStrong,
- fontSize: titleFontSize,
- lineHeight: titleLineHeight
- },
- [`${confirmComponentCls}-content`]: {
- color: token.colorText,
- fontSize,
- lineHeight
- },
- // ===================== Footer =====================
- [`${confirmComponentCls}-btns`]: {
- textAlign: 'end',
- marginTop: token.confirmBtnsMarginTop,
- [`${token.antCls}-btn + ${token.antCls}-btn`]: {
- marginBottom: 0,
- marginInlineStart: token.marginXS
- }
- }
- },
- [`${confirmComponentCls}-error ${confirmComponentCls}-body > ${token.iconCls}`]: {
- color: token.colorError
- },
- [`${confirmComponentCls}-warning ${confirmComponentCls}-body > ${token.iconCls},
- ${confirmComponentCls}-confirm ${confirmComponentCls}-body > ${token.iconCls}`]: {
- color: token.colorWarning
- },
- [`${confirmComponentCls}-info ${confirmComponentCls}-body > ${token.iconCls}`]: {
- color: token.colorInfo
- },
- [`${confirmComponentCls}-success ${confirmComponentCls}-body > ${token.iconCls}`]: {
- color: token.colorSuccess
- }
- };
- };
- // ============================== Export ==============================
- var _default = exports.default = (0, _internal.genSubStyleComponent)(['Modal', 'confirm'], token => {
- const modalToken = (0, _.prepareToken)(token);
- return genModalConfirmStyle(modalToken);
- }, _.prepareComponentToken, {
- // confirm is weak than modal since no conflict here
- order: -1000
- });
|