mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-02 20:19:44 +08:00
add headStyle to card component
This commit is contained in:
parent
5dc31a4d2a
commit
a88a320694
@ -23,6 +23,7 @@ A card can be used to display content related to a single subject. The content c
|
||||
| -------- | ----------- | ---- | ------- |
|
||||
| actions | The action list, shows at the bottom of the Card. | Array<ReactNode> | - |
|
||||
| activeTabKey | Current TabPane's key | string | - |
|
||||
| headStyle | Inline style to apply to the card head | object | - |
|
||||
| bodyStyle | Inline style to apply to the card content | object | - |
|
||||
| bordered | Toggles rendering of the border around the card | boolean | `true` |
|
||||
| cover | Card cover | ReactNode | - |
|
||||
|
@ -27,6 +27,7 @@ export interface CardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 't
|
||||
title?: React.ReactNode;
|
||||
extra?: React.ReactNode;
|
||||
bordered?: boolean;
|
||||
headStyle?: React.CSSProperties;
|
||||
bodyStyle?: React.CSSProperties;
|
||||
style?: React.CSSProperties;
|
||||
loading?: boolean;
|
||||
@ -134,7 +135,7 @@ export default class Card extends React.Component<CardProps, CardState> {
|
||||
}
|
||||
render() {
|
||||
const {
|
||||
prefixCls = 'ant-card', className, extra, bodyStyle = {}, noHovering, hoverable, title, loading,
|
||||
prefixCls = 'ant-card', className, extra, headStyle = {}, bodyStyle = {}, noHovering, hoverable, title, loading,
|
||||
bordered = true, type, cover, actions, tabList, children, activeTabKey, defaultActiveTabKey, ...others
|
||||
} = this.props;
|
||||
|
||||
@ -231,7 +232,7 @@ export default class Card extends React.Component<CardProps, CardState> {
|
||||
) : null;
|
||||
if (title || extra || tabs) {
|
||||
head = (
|
||||
<div className={`${prefixCls}-head`}>
|
||||
<div className={`${prefixCls}-head`} style={headStyle}>
|
||||
<div className={`${prefixCls}-head-wrapper`}>
|
||||
{title && <div className={`${prefixCls}-head-title`}>{title}</div>}
|
||||
{extra && <div className={`${prefixCls}-extra`}>{extra}</div>}
|
||||
|
@ -24,6 +24,7 @@ cols: 1
|
||||
| --- | --- | --- | --- |
|
||||
| actions | 卡片操作组,位置在卡片底部 | Array<ReactNode> | - |
|
||||
| activeTabKey | 当前激活页签的 key | string | - |
|
||||
| headStyle | 自定义标题区域样式 | object | - |
|
||||
| bodyStyle | 内容区域自定义样式 | object | - |
|
||||
| bordered | 是否有边框 | boolean | true |
|
||||
| cover | 卡片封面 | ReactNode | - |
|
||||
|
Loading…
Reference in New Issue
Block a user