| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138 |
- "use strict";
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = void 0;
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
- var _internal = require("../../theme/internal");
- var _style = require("../../style");
- // ============================== Shared ==============================
- const genSharedDividerStyle = token => {
- const {
- componentCls,
- sizePaddingEdgeHorizontal,
- colorSplit,
- lineWidth
- } = token;
- return {
- [componentCls]: (0, _extends2.default)((0, _extends2.default)({}, (0, _style.resetComponent)(token)), {
- borderBlockStart: `${lineWidth}px solid ${colorSplit}`,
- // vertical
- '&-vertical': {
- position: 'relative',
- top: '-0.06em',
- display: 'inline-block',
- height: '0.9em',
- margin: `0 ${token.dividerVerticalGutterMargin}px`,
- verticalAlign: 'middle',
- borderTop: 0,
- borderInlineStart: `${lineWidth}px solid ${colorSplit}`
- },
- '&-horizontal': {
- display: 'flex',
- clear: 'both',
- width: '100%',
- minWidth: '100%',
- margin: `${token.dividerHorizontalGutterMargin}px 0`
- },
- [`&-horizontal${componentCls}-with-text`]: {
- display: 'flex',
- alignItems: 'center',
- margin: `${token.dividerHorizontalWithTextGutterMargin}px 0`,
- color: token.colorTextHeading,
- fontWeight: 500,
- fontSize: token.fontSizeLG,
- whiteSpace: 'nowrap',
- textAlign: 'center',
- borderBlockStart: `0 ${colorSplit}`,
- '&::before, &::after': {
- position: 'relative',
- width: '50%',
- borderBlockStart: `${lineWidth}px solid transparent`,
- // Chrome not accept `inherit` in `border-top`
- borderBlockStartColor: 'inherit',
- borderBlockEnd: 0,
- transform: 'translateY(50%)',
- content: "''"
- }
- },
- [`&-horizontal${componentCls}-with-text-left`]: {
- '&::before': {
- width: '5%'
- },
- '&::after': {
- width: '95%'
- }
- },
- [`&-horizontal${componentCls}-with-text-right`]: {
- '&::before': {
- width: '95%'
- },
- '&::after': {
- width: '5%'
- }
- },
- [`${componentCls}-inner-text`]: {
- display: 'inline-block',
- padding: '0 1em'
- },
- '&-dashed': {
- background: 'none',
- borderColor: colorSplit,
- borderStyle: 'dashed',
- borderWidth: `${lineWidth}px 0 0`
- },
- [`&-horizontal${componentCls}-with-text${componentCls}-dashed`]: {
- '&::before, &::after': {
- borderStyle: 'dashed none none'
- }
- },
- [`&-vertical${componentCls}-dashed`]: {
- borderInlineStartWidth: lineWidth,
- borderInlineEnd: 0,
- borderBlockStart: 0,
- borderBlockEnd: 0
- },
- [`&-plain${componentCls}-with-text`]: {
- color: token.colorText,
- fontWeight: 'normal',
- fontSize: token.fontSize
- },
- [`&-horizontal${componentCls}-with-text-left${componentCls}-no-default-orientation-margin-left`]: {
- '&::before': {
- width: 0
- },
- '&::after': {
- width: '100%'
- },
- [`${componentCls}-inner-text`]: {
- paddingInlineStart: sizePaddingEdgeHorizontal
- }
- },
- [`&-horizontal${componentCls}-with-text-right${componentCls}-no-default-orientation-margin-right`]: {
- '&::before': {
- width: '100%'
- },
- '&::after': {
- width: 0
- },
- [`${componentCls}-inner-text`]: {
- paddingInlineEnd: sizePaddingEdgeHorizontal
- }
- }
- })
- };
- };
- // ============================== Export ==============================
- var _default = exports.default = (0, _internal.genComponentStyleHook)('Divider', token => {
- const dividerToken = (0, _internal.mergeToken)(token, {
- dividerVerticalGutterMargin: token.marginXS,
- dividerHorizontalWithTextGutterMargin: token.margin,
- dividerHorizontalGutterMargin: token.marginLG
- });
- return [genSharedDividerStyle(dividerToken)];
- }, {
- sizePaddingEdgeHorizontal: 0
- });
|