From 0a4a59f6e66474161d2bfd0cac18cca64dabe722 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sun, 5 Jul 2020 21:48:49 +0200
Subject: [PATCH] - Added pages for register and scoped styles

---
 client/src/assets/scss/_global.scss           |  8 ++++
 .../src/components/global/navbar/navbar.vue   |  3 +-
 client/src/pages/index-page.vue               | 45 ++++++++-----------
 client/src/pages/user/login-page.vue          | 24 +++++++---
 client/src/pages/user/register-page.vue       | 25 +++++++++++
 client/src/routes.js                          |  4 ++
 6 files changed, 75 insertions(+), 34 deletions(-)
 create mode 100644 client/src/pages/user/register-page.vue

diff --git a/client/src/assets/scss/_global.scss b/client/src/assets/scss/_global.scss
index 6c57871..dea2e02 100644
--- a/client/src/assets/scss/_global.scss
+++ b/client/src/assets/scss/_global.scss
@@ -49,4 +49,12 @@ hr {
     border-top-style: solid;
     border-top-width: 1px;
     border-top-color: rgba($black, .25);
+}
+
+// LAYOUTS
+.fullpage {
+    min-height: calc(100vh - 56px);
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
\ No newline at end of file
diff --git a/client/src/components/global/navbar/navbar.vue b/client/src/components/global/navbar/navbar.vue
index 0ad8807..db97f88 100644
--- a/client/src/components/global/navbar/navbar.vue
+++ b/client/src/components/global/navbar/navbar.vue
@@ -11,7 +11,8 @@
                 </li>
             </ul>
             <div class="navbar-nav">
-                <router-link :to="'/connexion'" class="nav-link">Connexion</router-link>
+                <router-link :to="'/inscription'" class="nav-link">S'inscrire</router-link>
+                <router-link :to="'/connexion'" class="nav-link">Se connecter</router-link>
             </div>
         </div>
     </nav>
diff --git a/client/src/pages/index-page.vue b/client/src/pages/index-page.vue
index ee8a352..0100af5 100644
--- a/client/src/pages/index-page.vue
+++ b/client/src/pages/index-page.vue
@@ -1,14 +1,14 @@
 <template>
-  <div class="container-fluid" id="index-container">
-    <section class="fullpage">
-      <div class="px-4">
-        <h1 class="text-dark mb-4 font-display line-height-100 font-weight-900">"C'est magique, ta gueule."</h1>
-        <div class="lead font-display font-weight-bold">— N'importe quel MJ, une fois dans sa vie</div>
-        <hr class="w-50">
-        <div class="lead"><span class="font-display" style="font-weight:700;">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>.</div>
-      </div>
-    </section>
-  </div>
+    <div class="container-fluid">
+        <section class="fullpage">
+            <div class="px-4">
+                <h1 class="title text-dark mb-4 font-display line-height-100">"C'est magique, ta gueule."</h1>
+                <div class="lead font-display font-weight-bold">— N'importe quel MJ, une fois dans sa vie</div>
+                <hr class="w-50">
+                <div class="lead"><span class="font-display" style="font-weight:700;">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>.</div>
+            </div>
+        </section>
+    </div>
 </template>
 
 <script>
@@ -17,21 +17,14 @@ export default {
 }
 </script>
 
-<style lang="scss">
-    .fullpage {
-        min-height: calc(100vh - 56px);
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        h1 {
-            font-size: 5rem;
-        }
-    }
-    @media only screen and (max-width: 600px) {
-        .fullpage {
-            h1 {
-                font-size: 3.5rem;
-            }
-        }
+<style lang="scss" scoped>
+.title {
+    font-size: 5rem;
+    font-weight: 900;
+}
+@media only screen and (max-width: 600px) {
+    .title {
+        font-size: 3.5rem;
     }
+}
 </style>
\ No newline at end of file
diff --git a/client/src/pages/user/login-page.vue b/client/src/pages/user/login-page.vue
index 111a7ba..2f4bb2f 100644
--- a/client/src/pages/user/login-page.vue
+++ b/client/src/pages/user/login-page.vue
@@ -1,15 +1,25 @@
 <template>
-    <div class="container-fluid p-4" id="spell-container">
-        <h1 class="display-3 font-display mb-3">Connexion</h1>
+    <div class="container-fluid">
+        <section class="fullpage">
+            <div class="title font-display mb-3">Connexion</div>
+        </section>
     </div>
 </template>
 
 <script>
-    export default {
-        name: 'login-page',
-    }
+export default {
+    name: 'login-page',
+}
 </script>
 
-<style>
-
+<style lang="scss" scoped>
+.title {
+    font-size: 5rem;
+    font-weight: 700;
+}
+@media only screen and (max-width: 600px) {
+    .title {
+        font-size: 3.5rem;
+    }
+}
 </style>
\ No newline at end of file
diff --git a/client/src/pages/user/register-page.vue b/client/src/pages/user/register-page.vue
new file mode 100644
index 0000000..d254b84
--- /dev/null
+++ b/client/src/pages/user/register-page.vue
@@ -0,0 +1,25 @@
+<template>
+    <div class="container-fluid">
+        <section class="fullpage">
+            <div class="title font-display mb-3">Inscription</div>
+        </section>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'register-page',
+}
+</script>
+
+<style lang="scss" scoped>
+.title {
+    font-size: 5rem;
+    font-weight: 700;
+}
+@media only screen and (max-width: 600px) {
+    .title {
+        font-size: 3.5rem;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/client/src/routes.js b/client/src/routes.js
index d3480a5..b442e0a 100644
--- a/client/src/routes.js
+++ b/client/src/routes.js
@@ -8,6 +8,7 @@ import Schools from "./pages/schools/schools-page"
 import SchoolSingle from "~/pages/schools/single-school-page"
 
 import Login from "~/pages/user/login-page"
+import Register from "~/pages/user/register-page"
 
 // Routes
 const routes = [
@@ -32,6 +33,9 @@ const routes = [
     {
         path: '/connexion', component: Login,
     },
+    {
+        path: '/inscription', component: Register,
+    },
 ];
 
 export default routes;
\ No newline at end of file