opti: 统一两列布局比例

This commit is contained in:
wenbo.dong 2017-07-27 14:35:27 +08:00
parent 57d4866b9d
commit 9477559b4a
3 changed files with 20 additions and 13 deletions

View File

@ -6,6 +6,7 @@ import LeftMenu from './LeftMenu.js'
import List from './List.js' import List from './List.js'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import Profile from './Profile.js' import Profile from './Profile.js'
import { Row, Col } from 'antd';
@connect() @connect()
class User extends Component { class User extends Component {
@ -25,13 +26,16 @@ class User extends Component {
return ( return (
<div> <div className="g-doc">
<section className="user-box"> <Row gutter={16} className="user-box">
<Col span={6}>
<LeftMenu /> <LeftMenu />
<Route path={this.props.match.path + '/list'} component={List} /> </Col>
<Route path={this.props.match.path + '/profile/:uid'} component={Profile} /> <Col span={18}>
</section> <Route path={this.props.match.path + '/list'} component={List} />
<Route path={this.props.match.path + '/profile/:uid'} component={Profile} />
</Col>
</Row>
</div> </div>
) )
} }

View File

@ -1,5 +1,9 @@
@import '../../styles/mixin.scss'; @import '../../styles/mixin.scss';
.g-doc {
margin: .24rem auto;
}
/* .user-box.css */ /* .user-box.css */
.user-box { .user-box {
@include row-width-limit; @include row-width-limit;
@ -15,7 +19,6 @@
.user-list { .user-list {
width: 216px;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20); box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);
background: #FFF; background: #FFF;
border-radius:5px; border-radius:5px;