--- a/client/src/App.js Tue Oct 09 19:02:17 2018 +0200
+++ b/client/src/App.js Tue Oct 09 19:07:47 2018 +0200
@@ -11,10 +11,10 @@
<Navbar history={this.props.history} />
<div className="container-fluid"></div>
<div className="row">
- <div className="col-lg-6 offset-md-3 text-center mt-5 pt-5">
+ {/* <div className="col-lg-6 offset-md-3 text-center mt-5 pt-5">
<h5 className="font-weight-bold text-center text-lg mt-5">Bienvenue sur</h5>
<h4 className="font-weight-bold text-center text-lg">IRI Notes</h4>
- </div>
+ </div> */}
</div>
</div>
);
--- a/client/src/App.scss Tue Oct 09 19:02:17 2018 +0200
+++ b/client/src/App.scss Tue Oct 09 19:07:47 2018 +0200
@@ -4,10 +4,6 @@
text-decoration-style: dotted;
}
-.ReactModal__Overlay {
- z-index: 1020;
-}
-
a {
cursor: pointer;
}
--- a/client/src/components/CreateSession.js Tue Oct 09 19:02:17 2018 +0200
+++ b/client/src/components/CreateSession.js Tue Oct 09 19:07:47 2018 +0200
@@ -18,7 +18,6 @@
protocolOpen: false,
title: "",
description: ""
- // protocol:null
}
componentWillMount() {
@@ -71,14 +70,14 @@
render() {
return (
- <div>
- <a id="session-button" className="text-center" onClick={this.openSessionModal}>Créer une nouvelle session</a>
+ <div className="container-fluid">
+ <a className="nav-link" onClick={this.openSessionModal}>Nouvelle session</a>
<Modal
- className="Modal__Bootstrap modal-dialog"
+ className="Modal__Bootstrap modal-dialog ml-5 mt-5 fixed-top w-100"
isOpen={this.state.modalIsOpen}
onRequestClose={this.handleModalCloseRequest}
>
- <div className="modal-content bg-primary w-75 mt-5">
+ <div className="modal-content bg-primary w-75">
<div className="modal-body mt-3">
<form onSubmit={ e => { e.preventDefault() } }>
<div className="form-group">
@@ -103,7 +102,7 @@
<label className="col-form-label text-secondary font-weight-bold mt-5 ml-5" onClick={this.toggleProtocol}>Protocole de la prise de note {this.state.protocolOpen?<span className="material-icons protocol-toggle"></span>:<span className="material-icons protocol-toggle"></span>}</label>
<div className={ "collapse" + (this.state.protocolOpen?'in':'')} >
{/* <pre>{JSON.stringify(this.props.currentSession.protocol, null, 2)}</pre> */}
- <pre className="text-secondary">{JSON.stringify(this.getGroupProtocol(), null, 2)}</pre>
+ <pre className=" protocol text-secondary">{JSON.stringify(this.getGroupProtocol(), null, 2)}</pre>
</div>
</div>
<div className="text-center">
--- a/client/src/components/CreateSession.scss Tue Oct 09 19:02:17 2018 +0200
+++ b/client/src/components/CreateSession.scss Tue Oct 09 19:07:47 2018 +0200
@@ -1,13 +1,18 @@
.bg-primary {
- border-radius: 0% 0% 3% 3%;
-}
-
-#session-button {
- font-size: 1.5rem;
- cursor: pointer;
+ border-radius: 3%;
}
.material-icons.protocol-toggle {
font-size: 1rem;
cursor: pointer;
}
+
+.protocol {
+ max-height: 150px;
+ overflow-x: auto;
+ overflow-y: auto;
+}
+
+.new-session-link {
+ font-size: 1.4rem;
+}
--- a/client/src/components/Navbar.js Tue Oct 09 19:02:17 2018 +0200
+++ b/client/src/components/Navbar.js Tue Oct 09 19:07:47 2018 +0200
@@ -148,61 +148,67 @@
render() {
return (
<div>
- <nav className="navbar navbar-expand-lg navbar-light bg-primary sticky-top">
- <div className="container-fluid">
- <div className="navbar-header">
- <a className="navbar-brand" onClick={this.onClickHome} href="/">IRI Notes</a>
- <button className="navbar-toggler mr-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
- <span className="navbar-toggler-icon"></span>
- <span className="icon-bar"></span>
- <span className="icon-bar"></span>
- <span className="icon-bar"></span>
- </button>
- </div>
- <div className="collapse navbar-collapse text-center" id="navbarSupportedContent">
- <ul className="navbar-nav mr-auto">
- <li className="nav-item">
- <a className="nav-link " onClick={this.onClickSessions} href="/sessions">Sessions</a>
+ <nav className="navbar navbar-expand-lg navbar-light bg-primary sticky-top">
+ <div className="container-fluid">
+ <div className="navbar-header">
+ <a className="navbar-brand" /*onClick={this.onClickHome}*/ href="/">IRI Notes</a>
+ <button className="navbar-toggler mr-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+ <span className="navbar-toggler-icon"></span>
+ <span className="icon-bar"></span>
+ <span className="icon-bar"></span>
+ <span className="icon-bar"></span>
+ </button>
+ </div>
+ <div className="collapse navbar-collapse text-center" id="navbarSupportedContent">
+ <ul className="navbar-nav mr-auto">
+ <li className="nav-item text-secondary">
+ <a className="nav-link " onClick={this.onClickSessions} href="/sessions">Sessions</a>
+ {/* <CreateSession
+ history={this.props.history}
+ group={this.props.currentGroup}
+ createSession={this.props.sessionsActions.createSession}
+ /> */}
+ </li>
+ </ul>
+ <ul className="navbar-nav navbar-center">
+ <li className="nav-item text-secondary">
+ {/* <a className="nav-link " onClick={this.onClickSessions} href="/sessions">Sessions</a> */}
+ <CreateSession
+ history={this.props.history}
+ group={this.props.currentGroup}
+ createSession={this.props.sessionsActions.createSession}
+ />
</li>
- </ul>
- <ul className="navbar-nav navbar-center">
- <li className="nav-item text-secondary">
- <CreateSession
- history={this.props.history}
- group={this.props.currentGroup}
- createSession={this.props.sessionsActions.createSession}
- />
- </li>
- </ul>
- <ul className="nav navbar-nav ml-auto">
- <NavbarGroup currentGroup={this.props.currentGroup} groups={this.props.groups} onSelect={this.onGroupSelect}/>
- <SyncButton id='sync-button' isAuthenticated={this.props.isAuthenticated} onSyncClick={this.onSyncClick} isSynchronizing={this.props.isSynchronizing} isSynchronized={this.props.isSynchronized} />
- <Online {...this.props} />
- <NavbarLogin {...this.props} onLogout={this.onClickLogout} />
- </ul>
+ </ul>
+ <ul className="nav navbar-nav ml-auto">
+ <NavbarGroup currentGroup={this.props.currentGroup} groups={this.props.groups} onSelect={this.onGroupSelect}/>
+ <SyncButton id='sync-button' isAuthenticated={this.props.isAuthenticated} onSyncClick={this.onSyncClick} isSynchronizing={this.props.isSynchronizing} isSynchronized={this.props.isSynchronized} />
+ <Online {...this.props} />
+ <NavbarLogin {...this.props} onLogout={this.onClickLogout} />
+ </ul>
+ </div>
+ <Modal
+ className="Modal__Bootstrap modal-dialog modal-dialog-centered"
+ // closeTimeoutMS={150}
+ isOpen={this.state.modalIsOpen}
+ onRequestClose={this.handleModalCloseRequest}
+ >
+ <div id="logout-modal" className="modal-content">
+ <span id="logout-close-modal-button" className="material-icons p-0 text-right" onClick={ this.handleModalCloseRequest }>close</span>
+ <div className="modal-body text-center">
+ <span className="material-icons modal-warning text-info pb-5">warning</span>
+ <p className="modal-text">
+ Certaines sessions n'ont pas encore été sauvegardées.
+ <br />
+ Si vous continuez, elles seront perdues.
+ </p>
+ <button type="button" className="btn btn-info text-secondary font-weight-bold py-1 px-2 mb-3" id="logout-modal-button" onClick={ this.confirmLogout }>Confirmer</button>
+ </div>
</div>
- <Modal
- className="Modal__Bootstrap modal-dialog modal-dialog-centered"
- // closeTimeoutMS={150}
- isOpen={this.state.modalIsOpen}
- onRequestClose={this.handleModalCloseRequest}
- >
- <div id="logout-modal" className="modal-content">
- <span id="logout-close-modal-button" className="material-icons p-0 text-right" onClick={ this.handleModalCloseRequest }>close</span>
- <div className="modal-body text-center">
- <span className="material-icons modal-warning text-info pb-5">warning</span>
- <p className="modal-text">
- Certaines sessions n'ont pas encore été sauvegardées.
- <br />
- Si vous continuez, elles seront perdues.
- </p>
- <button type="button" className="btn btn-info text-secondary font-weight-bold py-1 px-2 mb-3" id="logout-modal-button" onClick={ this.confirmLogout }>Confirmer</button>
- </div>
- </div>
- </Modal>
- </div>
- </nav>
- <OffLineMessage isAuthenticated={this.props.isAuthenticated} />
+ </Modal>
+ </div>
+ </nav>
+ <OffLineMessage isAuthenticated={this.props.isAuthenticated} />
</div>
);
}
--- a/client/src/components/Navbar.scss Tue Oct 09 19:02:17 2018 +0200
+++ b/client/src/components/Navbar.scss Tue Oct 09 19:07:47 2018 +0200
@@ -1,3 +1,7 @@
+.offline-message {
+ font-size: .9rem;
+}
+
.sync-button-synchronizing {
color: lightgreen;
}
@@ -7,11 +11,11 @@
}
.username#navbarDropdown {
- font-size: 24px;
+ font-size: 1.4rem;
}
.nav-link {
- font-size: 20px;
+ font-size: 1.2rem;
}
.dropdown-toggle{
@@ -19,7 +23,7 @@
}
.dropdown-item {
- font-size: 18px;
+ font-size: 1.1rem;
cursor: pointer;
}
@@ -30,11 +34,11 @@
}
.create-group {
- font-size: 14px;
+ font-size: .9rem;
}
.nav-link .dropdown-toggle .username .font-weight-bold {
- font-size: 18px;
+ font-size: 1.1rem;
}
#logout-modal{