= 6 rokov pred
rodič
commit
dcd00a0775

+ 0 - 1
public/index.html

@@ -7,7 +7,6 @@
     <meta name="theme-color" content="#000000">
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
     <!-- Fonts -->
-    <link href="https://fonts.googleapis.com/css?family=Cormorant+Infant|Open+Sans+Condensed:300|Poiret+One" rel="stylesheet">
     <title>React App</title>
   </head>
   <body>

+ 8 - 0
src/components/footer/index.js

@@ -0,0 +1,8 @@
+import React from 'react';
+
+export default props => (
+    <div className="footer">
+        <p className="footer__us">ТОП-фирма "SuperTestServise"</p>
+        <p className="footer__copyright">&copy; "SuperTestServise", 2018</p>
+    </div>
+)

+ 29 - 0
src/components/homePage/index.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import * as routes from './../../constants/routes'
+
+export default props => (
+    <div className="home-page">
+        <div className="home-page__about">
+            <h1 className="description__header">
+                We are the powerfull servise providing you the ability to create and manage
+                your own tests, in any categories, choosing your own marking methods.
+            </h1>
+            <hr className="description__divider" />
+            <p className="description__main">
+                You can <span className="description__inline--pretty">share</span>
+                {" "}your test with anybody you'd like: no matter your friend or college or even subordinates
+                can easily pass them, get marks and <span className="description__inline--pretty">share</span> them!
+            </p>
+        </div>
+        <div className="home-page__links-container">
+            <Link to={routes.SIGN_IN} class="home-page__links home-page__links--sign-in">
+                Sign in
+            </Link>
+            <Link to={routes.SIGN_UP} class="home-page__links home-page__links--sign-up">
+                Sign up
+            </Link>
+            {/* rgb(221,221,221) */}
+        </div>
+    </div>
+)

+ 1 - 2
src/containers/header/index.js

@@ -13,7 +13,7 @@ import { auth } from '../../firebase_config'
 class Header extends Component {
     
     render() {
-        const { isFetching, error, user } = this.props.auth;
+        const { isFetching, error, user, fbValue } = this.props.auth;
         const { signInRequest } = this.props; 
 
         return (
@@ -35,7 +35,6 @@ class Header extends Component {
                             </nav>
                         )
                 }
-
                 <div className="header__input_s">
                     <input />
                     <button type="submit">Click</button>

+ 6 - 0
src/reducers/auth/signIn/index.js

@@ -3,6 +3,12 @@ import initialState from './../../initialState';
 
 export default function signIn(state = initialState.signIn, {type, payload: user, error}) {
     switch (type) {
+        case 'TEST_FB_REQUEST': {
+            return {
+                ...state,
+                fbValue: user.payload
+            }
+        }
         case types.SIGN_IN_REQUEST: {
             return {
                 ...state,

+ 2 - 1
src/reducers/initialState/index.js

@@ -1,7 +1,8 @@
 export default {
     signIn: {
         isFetching: false,
-        user: null
+        user: null,
+        fbValue: []
     },
     signUp: {},
 }

+ 8 - 2
src/router.js

@@ -1,15 +1,21 @@
 import React from "react";
 import { Switch, Route } from "react-router-dom";
-import AuthPage from './containers/AuthPage'
-import Header from "./containers/header"
+// import AuthPage from './containers/AuthPage'
+import homePage from './components/homePage'
+
 import * as routes from './constants/routes'
+
+import Header from "./containers/Header"
 import signInPage from './components/auth/signInPage'
+import Footer from './components/footer'
 
 export default () => (
 	<div className="container">
 		<Header />
 		<Switch>
+            <Route path={routes.LANDING} exact component={homePage} />
 			<Route path={routes.SIGN_IN} exact component={signInPage} />
 		</Switch>
+        <Footer />
 	</div>
 );

+ 12 - 2
src/state/index.js

@@ -5,17 +5,27 @@ import createSagaMiddleware from "redux-saga";
 import combinedReducers from './../reducers';
 import initialState from './../reducers/initialState'
 import saga from './../saga'
-import { auth } from './../firebase_config'
+import { auth, database } from './../firebase_config'
 import { userIsNotSignedIn, userIsSignedIn } from './../actions/auth/signIn'
+import { actionChannel } from 'redux-saga/effects';
 
 const sagaMiddleware = createSagaMiddleware();
 
-const store = createStore(
+const store = createStore(  
     combinedReducers,
     initialState,
     applyMiddleware(sagaMiddleware, logger)
 );
 
+const action = payload =>({
+    type: 'TEST_FB_REQUEST',
+    payload
+})
+
+const usersRef = database.ref('/users')
+
+usersRef.on('child_added' , snapshot => store.dispatch(action(snapshot.val())))
+
 export default store;
 
 sagaMiddleware.run(saga);

+ 11 - 4
src/styles/base/_base.scss

@@ -2,13 +2,20 @@ body {
     margin: 0;
 }
 
-a:hover {
-	text-decoration: none;
-}
-a {
+a, a:hover {
     text-decoration: none;
+    color: black;
 }
 
+// h1, p {
+//     margin: 0
+// }
+
+// ul {
+//     list-style-type: none;
+//     padding: 0;
+// }
+
 body {
     margin: 0;
     padding: 0;

+ 3 - 0
src/styles/base/_typography.scss

@@ -0,0 +1,3 @@
+@import url("https://fonts.googleapis.com/css?family=Cormorant+Infant");
+@import url("https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300");
+@import url("https://fonts.googleapis.com/css?family=Poiret+One");

+ 15 - 0
src/styles/components/_footer.scss

@@ -0,0 +1,15 @@
+.footer {
+    text-align: center;
+    background: lightgray;
+
+    padding: 15px;
+    font-family: 'Cormorant Infant', serif;
+    font-weight: bold;
+    outline: 1px solid grey;
+    &__us {
+        font-size: 18px;
+    }
+    &__copyright {
+        font-size: 14px;
+    }
+}

+ 73 - 0
src/styles/components/_homePage.scss

@@ -0,0 +1,73 @@
+.home-page {
+    background-image: url('https://structureofintellect.files.wordpress.com/2017/09/bubble-test.jpg');
+    background-attachment: fixed;
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-position: center center;
+    // height: 85vh;
+    padding-top: 11.5vh;
+    padding-bottom: 9vh;
+    font-family: 'Cormorant Infant', serif;
+    &__about,
+    &__links-container, {
+        margin: auto;
+        background: rgba(211,211,211, .9);
+        box-shadow: 0 0 10px grey;
+    }
+    &__about {
+        width: 65%;
+        text-align: center;
+        padding: 25px 40px;
+        .description {
+            &__inline {
+                &--pretty {
+                    color: seagreen;
+                    text-transform: uppercase;
+                    font-weight: bold;
+                }
+            }
+            &__divider {
+                width: 60%;
+            }
+            &__main {
+                font-size: 20px;
+            }
+        }
+    }
+    &__links-container {
+        margin-top: 45px;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        width: 25%;
+        padding: 9vh;
+    }
+    // not correct spelling -> have to ask && change
+    &__links {
+        border: none;
+        box-shadow: 0 0 10px grey;
+        background: rgba(232,230, 230, 0.9);
+        padding: 3vh 0;
+        margin: 5px;
+        text-transform: uppercase;
+        font-family: 'Cormorant Infant', serif;
+        font-weight: bold;
+        font-size: 16px;
+        text-align: center;
+        width: 20vh;
+            @media screen and (max-width: 1125px) {
+                width: 100%;
+            }
+        transition: all 0.6s ease-in-out;
+    }
+    &__links:hover {
+        transform: rotate(360deg);
+    }
+
+    &__links--sign-in, {
+        color: orangered;
+    }
+    &__links--sign-up {
+        color: green;
+    }
+}

+ 0 - 1
src/styles/components/_signInPage.scss

@@ -2,7 +2,6 @@
     height: 83.5vh;
     &-form {
         font-size: 18px;
-        // font-family: 'Open Sans Condensed', sans-serif;
         font-family: 'Poiret One', cursive;
         position: relative;
         left: 50%;

+ 5 - 1
src/styles/index.scss

@@ -1,6 +1,10 @@
 @import "abstracts/variables";
 
+@import "base/base";
+@import "base/typography";
+
 @import "components/header";
 @import "components/signInPage";
+@import "components/footer";
+@import "components/homePage";
 
-@import "base/base";