make right panel larger, align items

develop
Morisse 6 years ago
parent 54363c58b6
commit fb51021c18
  1. 37
      src/CollapsableRightPanel.js
  2. 2
      src/User.css

@ -1,5 +1,5 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import {Collapse,Panel,Label,Button,Well,FormControl,FormGroup,ControlLabel,Form} from 'react-bootstrap'; import {Collapse,Panel,Label,Button,Well,FormControl,FormGroup,ControlLabel,Form,Table} from 'react-bootstrap';
export default class CollapsableRightPanel extends Component { export default class CollapsableRightPanel extends Component {
@ -27,28 +27,31 @@ export default class CollapsableRightPanel extends Component {
<Panel.Heading> <Panel.Heading>
<Panel.Title componentClass='h3'>User : {this.props.data['userId']}</Panel.Title> <Panel.Title componentClass='h3'>User : {this.props.data['userId']}</Panel.Title>
</Panel.Heading> </Panel.Heading>
<div className='pannelContainer'> <div className='pannelContainer'>
<Well> <Well>
<div> <Table>
<span className='labelText'>Creation:</span> <tbody>
{this.props.data['creationTs']} <tr>
</div> <td className='labelText'>Creation:</td>
<div> <td>{this.props.data['creationTs']}</td>
<span className='labelText'>Last Connection:</span> </tr>
{this.props.data['creationTs']} <tr>
</div> <td className='labelText'>Last Connection:</td>
<Form inline className='email'> <td>{this.props.data['creationTs']}</td>
<FormGroup controlId="formInlineEmail" className='email'> </tr>
<ControlLabel>Email :</ControlLabel>{' '} <tr>
<FormControl type="email" placeholder={this.props.data['email']} /> <td><ControlLabel>Email :</ControlLabel>{' '}</td>
</FormGroup>{' '} <td> <input type="email" placeholder={this.props.data['email']} readOnly/></td>
</Form> </tr>
</tbody>
</Table>
</Well> </Well>
{upgradePartner} {upgradePartner}
<Button bsStyle='primary'>Reset Password</Button> <Button bsStyle='primary'>Reset Password</Button>
</div> </div>
</Panel> </Panel>
</div> </div>
</Collapse> </Collapse>

@ -10,7 +10,7 @@
position: fixed; position: fixed;
top: 0px; top: 0px;
right: 0px; right: 0px;
width: 19vw; width: 30vw;
} }
.checkboxInfo{ .checkboxInfo{

Loading…
Cancel
Save