mirror of https://gitlab.com/ecentrics/concordia
Apostolos Fanakis
6 years ago
10 changed files with 4616 additions and 18 deletions
@ -0,0 +1,186 @@ |
|||||
|
/* PAGE */ |
||||
|
|
||||
|
html, body { |
||||
|
margin: 0; |
||||
|
display: block; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
strong { |
||||
|
font-weight: bold !important; |
||||
|
} |
||||
|
|
||||
|
#root { |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.App { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
margin: 0px; |
||||
|
display: flex; |
||||
|
flex-flow: column nowrap; |
||||
|
align-items: flex-start; |
||||
|
} |
||||
|
|
||||
|
.page-container { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
margin: 71px 0px 0px; |
||||
|
} |
||||
|
|
||||
|
.left-side-panel { |
||||
|
margin-top: 71px; |
||||
|
position: fixed; |
||||
|
width: 20%; |
||||
|
height: calc(100% - 71px); |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.main-panel { |
||||
|
width: 60%; |
||||
|
height: 100%; |
||||
|
margin: 0px 20%; |
||||
|
} |
||||
|
|
||||
|
.right-side-panel { |
||||
|
margin-top: 71px; |
||||
|
position: fixed; |
||||
|
width: 20%; |
||||
|
height: calc(100% - 71px); |
||||
|
top: 0; |
||||
|
right: 0; |
||||
|
} |
||||
|
|
||||
|
.sidebar-message { |
||||
|
margin: 0px 5px 12px 12px; |
||||
|
padding: 0px; |
||||
|
} |
||||
|
|
||||
|
.view-container { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
margin: 0px auto; |
||||
|
} |
||||
|
|
||||
|
/* MISC */ |
||||
|
|
||||
|
.navBarText { |
||||
|
height: 61px; |
||||
|
width: 1192px; |
||||
|
position: absolute; |
||||
|
left: calc(50% - 596px); |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.navBarText span { |
||||
|
color: #00b5ad; |
||||
|
height: 61px; |
||||
|
line-height: 61px; |
||||
|
vertical-align: middle; |
||||
|
font-size: 1.5em; |
||||
|
} |
||||
|
|
||||
|
.form-textarea-required { |
||||
|
color: rgb(159, 58, 56) !important; |
||||
|
outline-color: rgb(159, 58, 56) !important; |
||||
|
border-color: rgb(224, 180, 180) !important; |
||||
|
background-color: rgb(255, 246, 246) !important; |
||||
|
} |
||||
|
|
||||
|
.card { |
||||
|
width: 100% !important; |
||||
|
} |
||||
|
|
||||
|
.bottom-overlay-pad { |
||||
|
background: rgba(255, 255, 255, 0.85); |
||||
|
z-index: 10; |
||||
|
position: fixed; |
||||
|
bottom: 0px; |
||||
|
height: 62px; |
||||
|
width: 60%; |
||||
|
margin: 0px; |
||||
|
padding: 0px; |
||||
|
} |
||||
|
|
||||
|
.action-button { |
||||
|
z-index: 11; |
||||
|
position: fixed; |
||||
|
bottom: 10px; |
||||
|
left: calc(50% - 24px); |
||||
|
} |
||||
|
|
||||
|
.grey-text { |
||||
|
color: grey; |
||||
|
} |
||||
|
|
||||
|
.inline { |
||||
|
display: inline-block; |
||||
|
} |
||||
|
|
||||
|
.no-margin { |
||||
|
margin: 0px; |
||||
|
} |
||||
|
|
||||
|
hr { |
||||
|
color: #0c1a2b; |
||||
|
margin: 0px; |
||||
|
} |
||||
|
|
||||
|
*:focus { |
||||
|
outline:none !important |
||||
|
} |
||||
|
|
||||
|
a { |
||||
|
color:inherit; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
.center-in-parent { |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.vertical-center-in-parent { |
||||
|
vertical-align: middle; |
||||
|
height: 100%; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
|
||||
|
.vertical-center-children { |
||||
|
height: 100%; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
|
||||
|
#overlay { |
||||
|
position: fixed; |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
background-color: rgba(0,0,0,0.5); |
||||
|
z-index: 2; |
||||
|
} |
||||
|
|
||||
|
#overlay-content{ |
||||
|
position: absolute; |
||||
|
text-align: center; |
||||
|
top: 50%; |
||||
|
left: 50%; |
||||
|
color: white; |
||||
|
transform: translate(-50%,-50%); |
||||
|
-ms-transform: translate(-50%,-50%); |
||||
|
} |
||||
|
|
||||
|
.fill { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
@ -0,0 +1,30 @@ |
|||||
|
/* TOPICS LIST SCREEN */ |
||||
|
|
||||
|
.topics-list { |
||||
|
padding: 0px 2px; |
||||
|
margin-bottom: 75px; |
||||
|
} |
||||
|
|
||||
|
.topics-list a { |
||||
|
color: black !important; |
||||
|
text-decoration: none !important; |
||||
|
} |
||||
|
|
||||
|
.topics-list a:hover { |
||||
|
color: black !important; |
||||
|
text-decoration: none !important; |
||||
|
} |
||||
|
|
||||
|
.topic-subject { |
||||
|
margin: 0px 0px 5px; |
||||
|
} |
||||
|
|
||||
|
.topic-meta { |
||||
|
margin: 5px 0px 0px; |
||||
|
} |
||||
|
|
||||
|
.topic-date { |
||||
|
margin-bottom: 0px; |
||||
|
font-size: 0.77vw !important; |
||||
|
text-align: right; |
||||
|
} |
@ -0,0 +1,5 @@ |
|||||
|
/* PROFILE SCREEN */ |
||||
|
|
||||
|
.profile-tab { |
||||
|
width: 100%; |
||||
|
} |
@ -0,0 +1,12 @@ |
|||||
|
/* SIGN UP SCREEN */ |
||||
|
|
||||
|
.sign-up-container { |
||||
|
height: 100%; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
|
||||
|
.sign-up-container>div { |
||||
|
margin: auto; |
||||
|
} |
@ -0,0 +1,6 @@ |
|||||
|
/* START TOPIC SCREEN */ |
||||
|
|
||||
|
.topic-form { |
||||
|
width: 100%; |
||||
|
margin: 20px 0px; |
||||
|
} |
@ -0,0 +1,51 @@ |
|||||
|
/* POSTS LIST SCREEN */ |
||||
|
|
||||
|
.posts-list-spacer { |
||||
|
margin-bottom: 85px; |
||||
|
height: 0px; |
||||
|
} |
||||
|
|
||||
|
.post { |
||||
|
width: 100%; |
||||
|
background-color: #FFFFFF; |
||||
|
margin: 20px 0px; |
||||
|
padding: 0px; |
||||
|
} |
||||
|
|
||||
|
.post-meta { |
||||
|
float: right; |
||||
|
margin-right: 11.25px; |
||||
|
} |
||||
|
|
||||
|
.user-avatar { |
||||
|
width: 52px; |
||||
|
height: 52px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.user-avatar a { |
||||
|
color: inherit !important; |
||||
|
text-decoration: none !important; |
||||
|
} |
||||
|
|
||||
|
.stretch-space-between { |
||||
|
display: flex; |
||||
|
flex-flow: row nowrap; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
|
||||
|
.user-info { |
||||
|
background-color: #FFFFFF; |
||||
|
margin: 12px auto; |
||||
|
padding: 7px; |
||||
|
} |
||||
|
|
||||
|
.post-content a{ |
||||
|
margin-top: 10px; |
||||
|
color: #039be5; |
||||
|
} |
||||
|
|
||||
|
.post-form { |
||||
|
width: 100%; |
||||
|
margin: 20px 0px; |
||||
|
} |
File diff suppressed because one or more lines are too long
@ -0,0 +1,44 @@ |
|||||
|
import React, { Component } from 'react'; |
||||
|
|
||||
|
import NavBarContainer from './NavBarContainer'; |
||||
|
/*import TransactionsMonitorContainer from '../../containers/TransactionsMonitorContainer';*/ |
||||
|
|
||||
|
// Styles
|
||||
|
import '../assets/fonts/fontawesome-free-5.7.2/all.js'; |
||||
|
import '../assets/css/App.css'; |
||||
|
import '../assets/css/sign-up-container.css'; |
||||
|
|
||||
|
import '../assets/css/board-container.css'; |
||||
|
import '../assets/css/start-topic-container.css'; |
||||
|
import '../assets/css/topic-container.css'; |
||||
|
import '../assets/css/profile-container.css'; |
||||
|
|
||||
|
class CoreLayout extends Component { |
||||
|
render() { |
||||
|
return ( |
||||
|
<div className="App"> |
||||
|
<NavBarContainer/> |
||||
|
{/*<div className="progress-bar-container" |
||||
|
style={{display: this.props.isProgressBarVisible ? "block" : "none"}}> |
||||
|
<div className="progress"> |
||||
|
<div className="indeterminate"></div> |
||||
|
</div> |
||||
|
</div>*/} |
||||
|
<div className="page-container"> |
||||
|
<aside className="left-side-panel"> |
||||
|
</aside> |
||||
|
<div className="main-panel"> |
||||
|
<div className="view-container"> |
||||
|
{this.props.children} |
||||
|
</div> |
||||
|
</div> |
||||
|
<aside className="right-side-panel"> |
||||
|
TransactionsMonitorContainer |
||||
|
</aside> |
||||
|
</div> |
||||
|
</div> |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
export default CoreLayout |
Loading…
Reference in new issue