Skip to content

Commit

Permalink
(RE-SETUP_PROJECT) : add perform project update
Browse files Browse the repository at this point in the history
  • Loading branch information
Olili2017 committed Aug 12, 2020
1 parent 3d64ae7 commit f903acc
Show file tree
Hide file tree
Showing 13 changed files with 499 additions and 66 deletions.
37 changes: 37 additions & 0 deletions client/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 3 additions & 2 deletions client/package.json
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
{
"name": "olili2017.github.io",
"version": "0.1.0",
"name": "olili2017.github.io.landlord-client",
"version": "1.0.0",
"private": true,
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.25",
"@fortawesome/free-brands-svg-icons": "^5.11.2",
"@fortawesome/free-solid-svg-icons": "^5.11.2",
"@fortawesome/react-fontawesome": "^0.1.7",
"@material-ui/core": "^4.6.1",
"axios": "^0.19.0",
"bootstrap": "^4.3.1",
"react": "^16.12.0",
"react-bootstrap": "^1.0.0-beta.15",
Expand Down
39 changes: 25 additions & 14 deletions client/src/App.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from 'react';
import React, { useState } from 'react';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'
import Home from './components/Home'
import LandlordHome from './components/landlord/'
Expand All @@ -8,23 +8,34 @@ import TenantHome from './components/tenant/'
import TenantSignin from './components/tenant/signin.js'
import TenantRegister from './components/tenant/register'
import NotFound from './components/NotFound'
import AuthContext from './components/utils/auth'
import PrivateRoute from './components/utils/auth/privateRoute';

function App () {

const [authTokens, setAuthTokens] = useState();

const setTokens = (data) => {
localStorage.setItem("tokens", JSON.stringify(data));
setAuthTokens(data);
}

return (
<Router>
<Switch>
<Route path="/" exact component={Home} />
<Route path="/tenant" exact component={TenantHome} />
<Route path="/landlord" exact component={LandlordHome} />
<Route path="/landlord/property/:id" exact component={LandlordHome} />
<Route path="/login/landlord" exact component={LandlordSignin} />
<Route path="/login/tenant" exact component={TenantSignin} />
<Route path="/register/landlord" exact component={LandlordRegister} />
<Route path="/register/tenant" exact component={TenantRegister} />
<Route path="/*" component={NotFound} />
</Switch>
</Router>
<AuthContext.Provider value={{ authTokens, setAuthTokens: setTokens }}>
<Router>
<Switch>
<Route path="/" exact component={Home} />
<PrivateRoute path="/tenant" exact component={TenantHome} />
<PrivateRoute path="/landlord" exact component={LandlordHome} />
<PrivateRoute path="/landlord/property/:id" exact component={LandlordHome} />
<Route path="/login/landlord" exact component={LandlordSignin} />
<Route path="/login/tenant" exact component={TenantSignin} />
<Route path="/register/landlord" exact component={LandlordRegister} />
<Route path="/register/tenant" exact component={TenantRegister} />
<PrivateRoute path="/*" component={NotFound} />
</Switch>
</Router>
</AuthContext.Provider>
);
}
export default App;
77 changes: 77 additions & 0 deletions client/src/components/landlord/css/checkbox.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
/* @import "compass/css3"; */

input[type="checkbox"].toggle {
opacity: 0;
position: absolute;
left: -99999px;
}

input[type="checkbox"].toggle + label {
height: 30px;
line-height: 30px;
font-weight: bolder;
/* background-color: #ccc; */
padding: 0px 16px;
border-radius: 16px;
display: inline-block;
position: relative;
cursor: pointer;
transition: all .25s ease-in;
/* box-shadow: inset 0px 0px 2px rgba(0,0,0, .5); */

background-color: #021324;
box-shadow: inset 0px 0px 10px black;

}

input[type="checkbox"].toggle + label::before, input[type="checkbox"].toggle + label:hover::before {
content: ' ';
position: absolute;
top: 2px;
left: 2px;
width: 46px;
height: 26px;
background: #fff;
z-index: 2;
transition: all .25s ease-in;
border-radius: 14px;
}


.off, .on {
color: #fff;
width: 40px;
}

.off {
margin-left: 46px;
display:inline-block;
}

.on {
display: none;
}

.toggle:checked + label .off {
display: none;
}
.toggle:checked + label .on {
margin-right: 46px;
display:inline-block;
}
.toggle:checked + label, .toggle:focus:checked + label {
background-color: #021324;
box-shadow: inset 0px 0px 10px black;
/* background-color: #67a5ec; */
}


.toggle:checked + label:before, .toggle:checked + label:hover:before {

background-position: 0 0;
top: 2px;
left: 100%;
margin-left: 70px;
/* margin-left: 48px; */

}
121 changes: 121 additions & 0 deletions client/src/components/landlord/css/register.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
.register{
background: #02203c;
/* background: linear-gradient(90deg, rgba(2,32,60,1) 0%, rgba(12,62,108,1) 33%, rgba(0,255,8,1) 100%); */
/* background: -webkit-linear-gradient(left, #3931af, #00c6ff); */
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
}
.register-left{
text-align: center;
color: #fff;
margin-top: 4%;
}
button.btn-round, a.btn-round {
border: none;
border-radius: 1.5rem;
padding: 2%!important;
width: calc(60%)!important;
background: #f8f9fa;
font-weight: bold;
color: #383d41!important;
margin-top: 3%;
margin-bottom: 3%;
cursor: pointer;
}
button.btn-round:hover, a.btn-round:hover {
background-color: #f8f9fa;
border: 1px solid #fff;
color: #383d41;
animation: .5s buttonHover forwards !important;
}
button.btn-round:active, a.btn-round:active {
background: #f8f9fa;
animation: .5s buttonHover reverse forwards;
}

@keyframes buttonHover {
0% {
transform: translateY(0);
}
100% {
transform: translateY(-4px);
box-shadow: 0px 4px black;
}
}
.register-right{
margin: 5% 0px;
min-height: 400px;
padding-left: 3em;
padding-right: 3em;
padding-bottom: 3em;
/* background: rgba(255,255,255,.3); */
border: 1px solid #fff;
border-top-left-radius: 10% 50%;
border-bottom-left-radius: 10% 50%;
}
.register-left img{
margin-top: 15%;
margin-bottom: 5%;
width: 25%;
-webkit-animation: mover 2s infinite alternate;
animation: mover 1s infinite alternate;
}
@-webkit-keyframes mover {
0% { transform: translateY(0); }
100% { transform: translateY(-20px); }
}
@keyframes mover {
0% { transform: translateY(0); }
100% { transform: translateY(-20px); }
}
.register-left p{
font-weight: lighter;
padding: 12%;
/* margin-top: -9%; */
}
.btnRegister{
float: right;
margin-top: 10%;
border: none;
border-radius: 1.5rem;
padding: 2%;
background: #0062cc;
color: #fff;
font-weight: 600;
width: 50%;
cursor: pointer;
}
.register .nav-tabs{
margin-top: 3%;
border: none;
background: #0062cc;
border-radius: 1.5rem;
width: 28%;
float: right;
}
.register .nav-tabs .nav-link{
padding: 2%;
height: 34px;
font-weight: 600;
color: #fff;
border-top-right-radius: 1.5rem;
border-bottom-right-radius: 1.5rem;
}
.register .nav-tabs .nav-link:hover{
border: none;
}
.register .nav-tabs .nav-link.active{
width: 100px;
color: #0062cc;
border: 2px solid #0062cc;
border-top-left-radius: 1.5rem;
border-bottom-left-radius: 1.5rem;
}
.register-heading{
text-align: center;
margin-top: 1.5em;
color: #fff;
margin-bottom: 1em;
}
36 changes: 36 additions & 0 deletions client/src/components/landlord/css/signin.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
.signin {
background: #02203c;
background-image:
linear-gradient(122deg,hsla(0,0%,100%,.08) 40%,transparent 40%),
linear-gradient(118deg,hsla(0,0%,100%,.08) 38%,transparent 38%);
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
}

.signin > div > div {
margin: 10% auto;
}

.signin input {
width: 70%;
border-radius: 0px;
background-color: hsla(0,0%,100%,.03);
background-size: 20px;
background-position-y: center;
background-position: 4px;
background-repeat: no-repeat;
padding-left: 30px;
}

.signin input[type="password"] {
background-image: url('./../../password.png');
}

.signin input[type="button"] {
background-color: #056bca;
border: 0px;
text-transform: uppercase;
color: #eaeaea;
}
Loading

0 comments on commit f903acc

Please sign in to comment.