--- a/client/src/components/SessionList.js Mon Oct 08 03:24:47 2018 +0200
+++ b/client/src/components/SessionList.js Mon Oct 08 03:30:54 2018 +0200
@@ -52,6 +52,17 @@
})
}
+ showSessionsNumber = () => {
+ if (this.props.sessions.size === 1)
+ return (
+ <span>{this.props.sessions.size} session</span>
+ );
+ return (
+ <span>{this.props.sessions.size} sessions</span>
+ )
+
+ }
+
deleteSession = () => {
const { sessionToDelete } = this.state;
@@ -66,16 +77,19 @@
render() {
return (
<div>
- <Navbar history={this.props.history} />
+ <Navbar history={this.props.history} group={this.props.currentGroup} />
<div className="container-fluid">
- <div className="row mt-5 pt-5">
+ <div className="session-count fixed-top bg-secondary font-weight-bold text-danger pl-4 pb-3 mb-3 mt-5 pt-3">
+ {this.showSessionsNumber()}
+ </div>
+ <div className="row mt-4 justify-content-end">
{this.props.sessions.map((session) =>
- <div className="col-lg-4" id="session">
- <div className="col-md-auto m-4 p-4 session" key={session.get('_id')}>
+ <div className="session col-lg-5" key={session.get('_id')}>
+ <div className="col-md-auto m-2 p-2">
<a className="sessions" onClick={() => this.props.history.push('/sessions/' + session.get('_id'))}>
<span className="session-title text-primary">{session.title || 'Session sans titre'}<br /></span>
<span className="session-date text-muted">{moment(session.get('date')).format('DD/MM/YYYY')}<br /></span>
- <span className="session-description text-dark">{session.description}<br /></span>
+ <span className="session-description">{session.description}<br /></span>
</a>
<button type="button" id="delete" className="btn btn-link float-left" onClick={ this.onClickDelete.bind(this, session) }>
<span className="material-icons delete text-dark">delete</span>
@@ -86,16 +100,16 @@
</div>
</div>
<Modal
- className="Modal__Bootstrap modal-dialog mt-5 pt-5 justify-content-lg-center"
+ className="Modal__Bootstrap modal-dialog modal-dialog-centered w-25"
// closeTimeoutMS={150}
isOpen={this.state.modalIsOpen}
onRequestClose={this.handleModalCloseRequest}
>
<div id="delete-session-modal" className="modal-content">
- <span id="delete-session-close-modal-button" className="material-icons p-0 text-right" onClick={ this.handleModalCloseRequest }>close</span>
+ <span id="delete-session-close-modal-button" className="material-icons text-right" onClick={ this.handleModalCloseRequest }>close</span>
<div className="modal-body text-center">
- <span className="modal-text">Êtes-vous sûr(e) de vouloir supprimer cette session ?</span>
- <button type="button" className="btn btn-primary text-secondary font-weight-bold py-1 px-2 mt-3" id="delete-session-modal-button" onClick={ this.deleteSession }>Confirmer</button>
+ <span className="modal-text">Supprimer cette session ?</span>
+ <button type="button" className="btn btn-info text-secondary font-weight-bold py-1 px-2 ml-3" id="delete-session-modal-button" onClick={ this.deleteSession }>Supprimer</button>
</div>
</div>
</Modal>