opti: 个人信息页样式微调

This commit is contained in:
wenbo.dong 2017-07-27 19:08:40 +08:00
parent 526d5bdab3
commit 296faec3be
3 changed files with 31 additions and 38 deletions

View File

@ -103,7 +103,7 @@ class LeftMenu extends Component {
</div>
</Col>
</Row>
<Menu mode='inline' defaultSelectedKeys={[location.hash]}>
<Menu mode='inline' defaultSelectedKeys={[location.hash]} className="user-nav">
{content}
</Menu>
</div>

View File

@ -138,8 +138,8 @@ class Profile extends Component {
userNameEditHtml = <div>
<Input value={_userinfo.username} name="username" onChange={this.changeUserinfo} placeholder="用户名" />
<ButtonGroup className="edit-buttons" >
<Button className="edit-button" onClick={() => { this.handleEdit('usernameEdit', false) }} >Cancel</Button>
<Button className="edit-button" onClick={ () => { this.updateUserinfo('username')} } type="primary">OK</Button>
<Button className="edit-button" onClick={() => { this.handleEdit('usernameEdit', false) }} >取消</Button>
<Button className="edit-button" onClick={ () => { this.updateUserinfo('username')} } type="primary">确定</Button>
</ButtonGroup>
</div>
}
@ -154,8 +154,8 @@ class Profile extends Component {
emailEditHtml = <div>
<Input placeholder="Email" value={_userinfo.email} name="email" onChange={this.changeUserinfo} />
<ButtonGroup className="edit-buttons" >
<Button className="edit-button" onClick={() => { this.handleEdit('emailEdit', false) }} >Cancel</Button>
<Button className="edit-button" type="primary" onClick={ () => { this.updateUserinfo('email')} }>OK</Button>
<Button className="edit-button" onClick={() => { this.handleEdit('emailEdit', false) }} >取消</Button>
<Button className="edit-button" type="primary" onClick={ () => { this.updateUserinfo('email')} }>确定</Button>
</ButtonGroup>
</div>
}
@ -182,8 +182,8 @@ class Profile extends Component {
<Input placeholder="新的密码" type="password" name="password" id="password" />
<Input placeholder="确认密码" type="password" name="verify_pass" id="verify_pass" />
<ButtonGroup className="edit-buttons" >
<Button className="edit-button" onClick={() => { this.handleEdit('secureEdit', false) }}>Cancel</Button>
<Button className="edit-button" onClick={this.updatePassword} type="primary">OK</Button>
<Button className="edit-button" onClick={() => { this.handleEdit('secureEdit', false) }}>取消</Button>
<Button className="edit-button" onClick={this.updatePassword} type="primary">确定</Button>
</ButtonGroup>
</div>
}

View File

@ -22,7 +22,7 @@
.user-list {
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);
background: #FFF;
border-radius:5px;
border-radius:4px;
margin-top: 15px;
.search{
padding: 5px;
@ -34,13 +34,13 @@
}
}
.user-name{
padding: 24px 10px;
padding: .24rem;
// text-align: center;
background-color: #34495e;
color: white;
font-size: 16px;
border-top-left-radius:5px;
border-top-right-radius: 5px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
span{
margin-right: 5px;
}
@ -51,8 +51,7 @@
.user-table {
-webkit-box-flex: 1;
padding: 24px;
margin-left: 15px;
border-radius:5px;
border-radius: 4px;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);
background: #FFF;
margin-top: 15px;
@ -69,19 +68,18 @@
.user-profile {
-webkit-box-flex: 1;
margin-top: 15px;
margin-left: 15px;
padding: 24px;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);
background: #FFF;
border-radius:5px;
border-radius: .04rem;
.user-item {
min-height:35px;
line-height:35px;
margin: 5px;
margin-left: 0px;
margin-bottom:10px;
margin-bottom: 16px;
border-bottom: 1px solid #f1f3f6;
padding-bottom: 10px;
padding-bottom: 16px;
#old_password,#password,#verify_pass{
margin-top: 20px;
}
@ -91,15 +89,15 @@
.ant-col-12{
.ant-input{
width: 60%;
margin-right: 24px;
margin-right: 16px;
}
}
.ant-col-4{
color: rgba(0,0,0,0.85);
padding: 0px 10px;
padding: 0px 16px;
text-indent: .7em;
// background-color: #f1f3f6;
border-left: 5px solid #f1f3f6;
border-left: 4px solid #f1f3f6;
margin-right: 30px;
}
.text{
@ -110,16 +108,11 @@
color: #657289;
cursor: pointer
}
// .edit-buttons{
// margin:10px;
// }
// .edit-button{
// margin: 5px;
// }
}
}
.user-nav {
border-bottom-left-radius: .04rem;
border-bottom-right-radius: .04rem;
}
}