amis-rpc-design/node_modules/antd/lib/descriptions/style/index.js
2023-10-07 19:42:30 +08:00

181 lines
5.2 KiB
JavaScript

"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _style = require("../../style");
var _internal = require("../../theme/internal");
const genBorderedStyle = token => {
const {
componentCls,
labelBg
} = token;
return {
[`&${componentCls}-bordered`]: {
[`> ${componentCls}-view`]: {
border: `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`,
'> table': {
tableLayout: 'auto',
borderCollapse: 'collapse'
},
[`${componentCls}-row`]: {
borderBottom: `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`,
'&:last-child': {
borderBottom: 'none'
},
[`> ${componentCls}-item-label, > ${componentCls}-item-content`]: {
padding: `${token.padding}px ${token.paddingLG}px`,
borderInlineEnd: `${token.lineWidth}px ${token.lineType} ${token.colorSplit}`,
'&:last-child': {
borderInlineEnd: 'none'
}
},
[`> ${componentCls}-item-label`]: {
color: token.colorTextSecondary,
backgroundColor: labelBg,
'&::after': {
display: 'none'
}
}
}
},
[`&${componentCls}-middle`]: {
[`${componentCls}-row`]: {
[`> ${componentCls}-item-label, > ${componentCls}-item-content`]: {
padding: `${token.paddingSM}px ${token.paddingLG}px`
}
}
},
[`&${componentCls}-small`]: {
[`${componentCls}-row`]: {
[`> ${componentCls}-item-label, > ${componentCls}-item-content`]: {
padding: `${token.paddingXS}px ${token.padding}px`
}
}
}
}
};
};
const genDescriptionStyles = token => {
const {
componentCls,
extraColor,
itemPaddingBottom,
colonMarginRight,
colonMarginLeft,
titleMarginBottom
} = token;
return {
[componentCls]: Object.assign(Object.assign(Object.assign({}, (0, _style.resetComponent)(token)), genBorderedStyle(token)), {
[`&-rtl`]: {
direction: 'rtl'
},
[`${componentCls}-header`]: {
display: 'flex',
alignItems: 'center',
marginBottom: titleMarginBottom
},
[`${componentCls}-title`]: Object.assign(Object.assign({}, _style.textEllipsis), {
flex: 'auto',
color: token.colorText,
fontWeight: token.fontWeightStrong,
fontSize: token.fontSizeLG,
lineHeight: token.lineHeightLG
}),
[`${componentCls}-extra`]: {
marginInlineStart: 'auto',
color: extraColor,
fontSize: token.fontSize
},
[`${componentCls}-view`]: {
width: '100%',
borderRadius: token.borderRadiusLG,
table: {
width: '100%',
tableLayout: 'fixed'
}
},
[`${componentCls}-row`]: {
'> th, > td': {
paddingBottom: itemPaddingBottom
},
'&:last-child': {
borderBottom: 'none'
}
},
[`${componentCls}-item-label`]: {
color: token.colorTextTertiary,
fontWeight: 'normal',
fontSize: token.fontSize,
lineHeight: token.lineHeight,
textAlign: `start`,
'&::after': {
content: '":"',
position: 'relative',
top: -0.5,
marginInline: `${colonMarginLeft}px ${colonMarginRight}px`
},
[`&${componentCls}-item-no-colon::after`]: {
content: '""'
}
},
[`${componentCls}-item-no-label`]: {
'&::after': {
margin: 0,
content: '""'
}
},
[`${componentCls}-item-content`]: {
display: 'table-cell',
flex: 1,
color: token.colorText,
fontSize: token.fontSize,
lineHeight: token.lineHeight,
wordBreak: 'break-word',
overflowWrap: 'break-word'
},
[`${componentCls}-item`]: {
paddingBottom: 0,
verticalAlign: 'top',
'&-container': {
display: 'flex',
[`${componentCls}-item-label`]: {
display: 'inline-flex',
alignItems: 'baseline'
},
[`${componentCls}-item-content`]: {
display: 'inline-flex',
alignItems: 'baseline'
}
}
},
'&-middle': {
[`${componentCls}-row`]: {
'> th, > td': {
paddingBottom: token.paddingSM
}
}
},
'&-small': {
[`${componentCls}-row`]: {
'> th, > td': {
paddingBottom: token.paddingXS
}
}
}
})
};
};
// ============================== Export ==============================
var _default = exports.default = (0, _internal.genComponentStyleHook)('Descriptions', token => {
const descriptionToken = (0, _internal.mergeToken)(token, {});
return [genDescriptionStyles(descriptionToken)];
}, token => ({
labelBg: token.colorFillAlter,
titleMarginBottom: token.fontSizeSM * token.lineHeightSM,
itemPaddingBottom: token.padding,
colonMarginRight: token.marginXS,
colonMarginLeft: token.marginXXS / 2,
extraColor: token.colorText
}));