Commit 393682d9 authored by ddcat1115's avatar ddcat1115

update card style

parent 99ae700f
......@@ -63,7 +63,7 @@ export default class CardList extends PureComponent {
dataSource={['', ...list]}
renderItem={item => (item ? (
<List.Item key={item.id}>
<Card actions={[<a>操作一</a>, <a>操作二</a>]}>
<Card className={styles.card} actions={[<a>操作一</a>, <a>操作二</a>]}>
<Link to="/list/card-list">
<Card.Meta
avatar={<img alt="" className={styles.cardAvatar} src={item.avatar} />}
......
......@@ -3,9 +3,15 @@
.cardList {
margin-bottom: -24px;
.card {
:global {
.ant-card-meta-content {
margin-top: 0;
.ant-card-meta-title {
margin-bottom: 12px;
}
.ant-card-actions {
background: #f7f9fa;
}
}
}
}
......@@ -24,7 +30,7 @@
border-color: @border-color-base;
color: @text-color-secondary;
width: 100%;
height: 185px;
height: 188px;
}
.cardAvatar {
......@@ -35,7 +41,6 @@
.cardDescription {
.textOverflowMulti();
color: @text-color;
}
.pageHeaderContent {
......
......@@ -77,6 +77,7 @@ export default class CoverCardList extends PureComponent {
renderItem={item => (
<List.Item>
<Card
className={styles.card}
hoverable
cover={<img alt={item.title} src={item.cover} />}
>
......
......@@ -3,23 +3,35 @@
.coverCardList {
margin-bottom: -24px;
.card {
:global {
.ant-card-meta-title {
margin-bottom: 4px;
}
.ant-card-meta-title > a {
color: @heading-color;
}
.ant-card:hover .ant-card-meta-title > a {
color: @primary-color;
}
.ant-card-meta-description {
color: @text-color-secondary;
height: 44px;
line-height: 22px;
overflow: hidden;
}
}
&:hover {
:global {
.ant-card-meta-title > a {
color: @primary-color;
}
}
}
}
.cardItemContent {
display: flex;
margin-top: 12px;
margin-top: 16px;
margin-bottom: -4px;
line-height: 20px;
height: 20px;
& > span {
......
......@@ -224,7 +224,7 @@ export default class FilterCardList extends PureComponent {
<List.Item key={item.id}>
<Card
hoverable
bodyStyle={{ paddingBottom: 16 }}
bodyStyle={{ paddingBottom: 20 }}
actions={[
<Tooltip title="下载"><Icon type="download" /></Tooltip>,
<Tooltip title="编辑"><Icon type="edit" /></Tooltip>,
......
......@@ -11,6 +11,9 @@
.ant-card-meta-avatar {
font-size: 0;
}
.ant-card-actions {
background: #f7f9fa;
}
}
.cardInfo {
.clearfix();
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment