Commit 664e9289 authored by niko's avatar niko Committed by GitHub

update style (#21)

parent 268a4ef3
import React from 'react';
import { Popover } from 'antd';
import { Tooltip } from 'antd';
import styles from './index.less';
const MiniProgress = ({ target, color, strokeWidth, percent }) => (
<div className={styles.miniProgress}>
<Popover title={null} content={`目标值: ${target}%`}>
<Tooltip title={`目标值: ${target}%`}>
<div
className={styles.target}
style={{ left: (target ? `${target}%` : null) }}
......@@ -13,7 +13,7 @@ const MiniProgress = ({ target, color, strokeWidth, percent }) => (
<span style={{ backgroundColor: (color || null) }} />
<span style={{ backgroundColor: (color || null) }} />
</div>
</Popover>
</Tooltip>
<div className={styles.progressWrap}>
<div
className={styles.progress}
......
......@@ -12,7 +12,7 @@
}
.ant-form-item-label label {
color: @text-color;
margin-right: 16px;
margin-right: 0;
}
}
.label {
......
......@@ -123,6 +123,7 @@ class TagSelect extends PureComponent {
return (
<div className={cls} style={style}>
<div>
<CheckableTag
checked={checkedAll}
key="tag-select-__all__"
......@@ -144,6 +145,7 @@ class TagSelect extends PureComponent {
</a>
)
}
</div>
{
expandNode && (
<div className={expand ? styles.expand : styles.fold}>
......
......@@ -5,6 +5,12 @@
user-select: none;
margin-left: -8px;
position: relative;
:global {
.ant-tag {
padding: 0 8px;
margin-right: 24px;
}
}
.expand {
transition: all 0.32s ease;
overflow: hidden;
......@@ -18,6 +24,9 @@
position: absolute;
top: 0;
right: 0;
i {
font-size: 12px;
}
}
}
.expandTag {
......
......@@ -193,7 +193,7 @@ class BasicLayout extends React.PureComponent {
>
<div className={styles.logo}>
<Link to="/">
<img src="https://gw.alipayobjects.com/zos/rmsportal/osjtaBtmmQzWRvMbcKeb.svg" alt="logo" />
<img src="https://gw.alipayobjects.com/zos/rmsportal/iwWyPinUoseUxIAeElSx.svg" alt="logo" />
<h1>Ant Design Pro</h1>
</Link>
</div>
......@@ -204,7 +204,7 @@ class BasicLayout extends React.PureComponent {
onOpenChange={this.handleOpenChange}
selectedKeys={this.getCurrentMenuSelectedKeys()}
style={{ margin: '24px 0', width: '100%' }}
inlineIndent={32}
inlineIndent={24}
>
{this.getNavMenuItems(this.menus)}
</Menu>
......
@import "~antd/lib/style/themes/default.less";
.header {
padding: 0 16px 0 0;
padding: 0 12px 0 0;
background: #fff;
box-shadow: 0 1px 4px rgba(0, 21, 41, .12);
position: relative;
......@@ -24,7 +24,7 @@
color: #fff;
display: inline-block;
vertical-align: middle;
font-size: 22px;
font-size: 18px;
margin-left: 12px;
font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
margin-top: -2px;
......@@ -43,7 +43,7 @@
line-height: 64px;
cursor: pointer;
transition: all .3s;
padding: 0 28px;
padding: 0 24px;
&:hover {
background: rgba(0, 0, 0, .04);
}
......@@ -103,5 +103,5 @@
min-height: 100vh;
box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
position: relative;
z-index: 1;
z-index: 10;
}
......@@ -62,8 +62,8 @@ export default class CardList extends PureComponent {
dataSource={['', ...list]}
renderItem={item => (item ? (
<List.Item key={item.id}>
<Link to="/list/card-list">
<Card hoverable actions={[<a>操作一</a>, <a>操作二</a>]}>
<Link to="/list/card-list">
<Card.Meta
avatar={<Avatar size="large" src={item.avatar} />}
title={item.title}
......@@ -73,8 +73,8 @@ export default class CardList extends PureComponent {
</p>
)}
/>
</Card>
</Link>
</Card>
</List.Item>
) : (
<List.Item>
......
......@@ -24,7 +24,7 @@
border-color: @border-color-base;
color: @text-color-secondary;
width: 100%;
height: 178px;
height: 185px;
}
.cardDescription {
......
......@@ -153,7 +153,7 @@ export default class CoverCardList extends PureComponent {
onTabChange={this.handleTabChange}
>
<div className={styles.coverCardList}>
<Card bordered={false}>
<Card bordered={false} bodyStyle={{ padding: 24 }}>
<Form layout="inline">
<StandardFormRow title="所属类目" block>
<FormItem>
......
......@@ -151,7 +151,7 @@ export default class FilterCardList extends PureComponent {
onTabChange={this.handleTabChange}
>
<div className={styles.filterCardList}>
<Card bordered={false}>
<Card bordered={false} bodyStyle={{ padding: 24 }}>
<Form layout="inline">
<StandardFormRow title="所属类目" block>
<FormItem>
......@@ -221,6 +221,8 @@ export default class FilterCardList extends PureComponent {
renderItem={item => (
<List.Item key={item.id}>
<Card
hoverable
bodyStyle={{ paddingBottom: 16 }}
actions={[
<Tooltip title="下载"><Icon type="download" /></Tooltip>,
<Tooltip title="编辑"><Icon type="edit" /></Tooltip>,
......
......@@ -7,10 +7,14 @@
.ant-card-meta-content {
margin-top: 0;
}
// disabled white space
.ant-card-meta-avatar {
font-size: 0;
}
}
.cardInfo {
.clearfix();
margin-top: 12px;
margin-top: 16px;
margin-left: 40px;
& > div {
position: relative;
......@@ -18,7 +22,7 @@
float: left;
width: 50%;
p {
color: @text-color;
color: @text-color-secondary;
line-height: 32px;
font-size: 24px;
}
......
......@@ -183,7 +183,7 @@ export default class SearchList extends Component {
onTabChange={this.handleTabChange}
>
<div>
<Card bordered={false}>
<Card bordered={false} bodyStyle={{ padding: 24 }}>
<Form layout="inline">
<StandardFormRow title="所属类目" block>
<FormItem>
......
// https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less
module.exports = {
// 'primary-color': '#10e99b',
'card-actions-background': '#f7f9fa',
};
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