refactor card extra style

This commit is contained in:
afc163 2017-08-15 22:34:48 +08:00
parent 5443e79329
commit f46112d385
2 changed files with 8 additions and 15 deletions

View File

@ -108,16 +108,11 @@ export default class Card extends Component<CardProps, {}> {
}
let head;
if (!title) {
head = null;
} else {
head = typeof title === 'string' ? (
if (title || extra) {
head = (
<div className={`${prefixCls}-head`}>
<h3 className={`${prefixCls}-head-title`}>{title}</h3>
</div>
) : (
<div className={`${prefixCls}-head`}>
<div className={`${prefixCls}-head-title`}>{title}</div>
{title ? <div className={`${prefixCls}-head-title`}>{title}</div> : null}
{extra ? <div className={`${prefixCls}-extra`}>{extra}</div> : null}
</div>
);
}
@ -125,7 +120,6 @@ export default class Card extends Component<CardProps, {}> {
return (
<div {...others} className={classString} ref={this.saveRef}>
{head}
{extra ? <div className={`${prefixCls}-extra`}>{extra}</div> : null}
<div className={`${prefixCls}-body`} style={bodyStyle}>{children}</div>
</div>
);

View File

@ -28,23 +28,22 @@
border-bottom: @border-width-base @border-style-base @border-color-split;
padding: 0 @card-padding-base;
border-radius: @border-radius-sm @border-radius-sm 0 0;
.clearfix;
&-title {
font-size: @font-size-lg;
display: inline-block;
text-overflow: ellipsis;
width: 100%;
max-width: 100%;
overflow: hidden;
white-space: nowrap;
color: @card-head-color;
font-weight: 500;
float: left;
}
}
&-extra {
position: absolute;
right: @card-padding-base;
top: 14px;
float: right;
}
&-body {