Browse Source

Merge branch 'registration' of jonathan-hinds/JhipsterGroupProject-Client into register

jonathan-hinds 5 years ago
parent
commit
98872dd715

+ 4
- 4
src/main/webapp/app/FaeBoo/Profile-head/profile-head.component.html View File

@@ -3,19 +3,19 @@
3 3
     <div class = "friend-cont">
4 4
 
5 5
         <div class="friend-pic friend4" id = "friend7">
6
-            <img class ="friend-photo friend4" src = "../../../content/images/defaultphoto.png">
6
+            <img class ="friend-photo friend4" src = "../../../content/images/faceofbooks3.jpg">
7 7
         </div>
8 8
 
9 9
         <div class="friend-pic friend3" id = "friend5">
10
-            <img class ="friend-photo friend3" src = "../../../content/images/defaultphoto.png">
10
+            <img class ="friend-photo friend3" src = "../../../content/images/faceofbooks4.jpg">
11 11
         </div>
12 12
 
13 13
         <div class="friend-pic friend2" id = "friend3">
14
-            <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
14
+            <img class ="friend-photo" src = "../../../content/images/faceofbooks2.jpg">
15 15
         </div>
16 16
 
17 17
         <div class="friend-pic friend1" id = "friend1">
18
-            <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
18
+            <img class ="friend-photo" src = "../../../content/images/faceofbooks1.png">
19 19
         </div>
20 20
 
21 21
         <div class = "profile-pic">

+ 7
- 8
src/main/webapp/app/home/home.component.html View File

@@ -4,8 +4,8 @@
4 4
     </div>
5 5
     <div class="col-md-9">
6 6
 
7
-        <h1 class="display-1" jhiTranslate="home.title">Welcome to Elliott!</h1>
8
-        <p class="lead" jhiTranslate="home.subtitle">This is your homepage</p>
7
+        <h1 class="display-1" jhiTranslate="home.title">Welcome to Faeboo!</h1>
8
+        <h2 class="lead" jhiTranslate="home.subtitle">This is your homepage</h2>
9 9
 
10 10
         <div [ngSwitch]="isAuthenticated()">
11 11
             <div class="alert alert-success" *ngSwitchCase="true">
@@ -13,9 +13,11 @@
13 13
                     translateValues="{username: '{{account.login}}'}"> You are logged in as user "{{account.login}}". </span>
14 14
             </div>
15 15
 
16
+            <br>
16 17
             <div class="alert alert-warning" *ngSwitchCase="false">
17
-                <span jhiTranslate="global.messages.info.authenticated.prefix">If you want to </span>
18
-                <a class="alert-link" (click)="login()" jhiTranslate="global.messages.info.authenticated.link">sign in</a><span jhiTranslate="global.messages.info.authenticated.suffix">, you can try the default accounts:<br/>- Administrator (login="admin" and password="admin") <br/>- User (login="user" and password="user").</span>
18
+
19
+                <span>You can sign in by clicking</span>
20
+                <a class="alert-link" (click)="login()" >sign in</a>
19 21
             </div>
20 22
             <div class="alert alert-warning" *ngSwitchCase="false">
21 23
                 <span jhiTranslate="global.messages.info.register.noaccount">You don't have an account yet?</span>&nbsp;
@@ -23,13 +25,10 @@
23 25
             </div>
24 26
         </div>
25 27
 
26
-        <p jhiTranslate="home.question">
27
-            If you have any question on JHipster:
28
-        </p>
28
+
29 29
 
30 30
 
31 31
         <p>
32
-            <span jhiTranslate="home.like">If you like JHipster, don't forget to give us a star on</span> <a href="https://github.com/jhipster/generator-jhipster" target="_blank" rel="noopener" jhiTranslate="home.github">GitHub</a>!
33 32
         </p>
34 33
     </div>
35 34
 </div>

+ 2
- 2
src/main/webapp/app/home/home.scss View File

@@ -6,7 +6,7 @@ Main page styles
6 6
     display: inline-block;
7 7
     width: 347px;
8 8
     height: 497px;
9
-    background: url('../../content/images/faceofbooks1.jpg') no-repeat center top;
9
+    background: url('../../content/images/faceofbooks1.png') no-repeat center top;
10 10
     background-size: contain;
11 11
 }
12 12
 
@@ -17,7 +17,7 @@ Main page styles
17 17
     only screen and (min-resolution: 192dpi),
18 18
     only screen and (min-resolution: 2dppx) {
19 19
     .hipster {
20
-        background: url('../../content/images/faceofbooks1.jpg') no-repeat center top;
20
+        background: url('../../content/images/faceofbooks1.png') no-repeat center top;
21 21
         background-size: contain;
22 22
     }
23 23
 }

+ 1
- 3
src/main/webapp/app/layouts/footer/footer.component.html View File

@@ -1,3 +1 @@
1
-<div class="footer">
2
-    <p jhiTranslate="footer">This is your footer</p>
3
-</div>
1
+

+ 0
- 1
src/main/webapp/app/layouts/main/main.component.html View File

@@ -1,4 +1,3 @@
1
-<jhi-page-ribbon></jhi-page-ribbon>
2 1
 <div>
3 2
     <router-outlet name="navbar"></router-outlet>
4 3
 </div>

+ 1
- 2
src/main/webapp/app/layouts/navbar/navbar.component.html View File

@@ -5,8 +5,7 @@
5 5
         </a>
6 6
         <a class="navbar-brand logo float-left" routerLink="/" (click)="collapseNavbar()">
7 7
             <span class="logo-img"></span>
8
-            <span jhiTranslate="global.title" class="navbar-title">FaeBoo</span> <span class="navbar-version">{{version}}</span>
9
-        </a>
8
+            <span jhiTranslate="global.title" class="navbar-title">FaeBoo</span>
10 9
     </div>
11 10
     <div class="navbar-collapse collapse" id="navbarResponsive" [ngbCollapse]="isNavbarCollapsed" [ngSwitch]="isAuthenticated()">
12 11
         <ul class="navbar-nav ml-auto">

+ 225
- 145
src/main/webapp/content/css/loading.css View File

@@ -1,155 +1,235 @@
1
-@keyframes lds-pacman-1 {
2
-    0% {
3
-        -webkit-transform: rotate(0deg);
4
-        transform: rotate(0deg);
5
-    }
6
-    50% {
7
-        -webkit-transform: rotate(-45deg);
8
-        transform: rotate(-45deg);
9
-    }
10
-    100% {
11
-        -webkit-transform: rotate(0deg);
12
-        transform: rotate(0deg);
13
-    }
1
+/*@keyframes lds-pacman-1 {*/
2
+/*0% {*/
3
+/*-webkit-transform: rotate(0deg);*/
4
+/*transform: rotate(0deg);*/
5
+/*}*/
6
+/*50% {*/
7
+/*-webkit-transform: rotate(-45deg);*/
8
+/*transform: rotate(-45deg);*/
9
+/*}*/
10
+/*100% {*/
11
+/*-webkit-transform: rotate(0deg);*/
12
+/*transform: rotate(0deg);*/
13
+/*}*/
14
+/*}*/
15
+/*@-webkit-keyframes lds-pacman-1 {*/
16
+/*0% {*/
17
+/*-webkit-transform: rotate(0deg);*/
18
+/*transform: rotate(0deg);*/
19
+/*}*/
20
+/*50% {*/
21
+/*-webkit-transform: rotate(-45deg);*/
22
+/*transform: rotate(-45deg);*/
23
+/*}*/
24
+/*100% {*/
25
+/*-webkit-transform: rotate(0deg);*/
26
+/*transform: rotate(0deg);*/
27
+/*}*/
28
+/*}*/
29
+/*@keyframes lds-pacman-2 {*/
30
+/*0% {*/
31
+/*-webkit-transform: rotate(180deg);*/
32
+/*transform: rotate(180deg);*/
33
+/*}*/
34
+/*50% {*/
35
+/*-webkit-transform: rotate(225deg);*/
36
+/*transform: rotate(225deg);*/
37
+/*}*/
38
+/*100% {*/
39
+/*-webkit-transform: rotate(180deg);*/
40
+/*transform: rotate(180deg);*/
41
+/*}*/
42
+/*}*/
43
+/*@-webkit-keyframes lds-pacman-2 {*/
44
+/*0% {*/
45
+/*-webkit-transform: rotate(180deg);*/
46
+/*transform: rotate(180deg);*/
47
+/*}*/
48
+/*50% {*/
49
+/*-webkit-transform: rotate(225deg);*/
50
+/*transform: rotate(225deg);*/
51
+/*}*/
52
+/*100% {*/
53
+/*-webkit-transform: rotate(180deg);*/
54
+/*transform: rotate(180deg);*/
55
+/*}*/
56
+/*}*/
57
+/*@keyframes lds-pacman-3 {*/
58
+/*0% {*/
59
+/*-webkit-transform: translate(190px, 0);*/
60
+/*transform: translate(190px, 0);*/
61
+/*opacity: 0;*/
62
+/*}*/
63
+/*20% {*/
64
+/*opacity: 1;*/
65
+/*}*/
66
+/*100% {*/
67
+/*-webkit-transform: translate(70px, 0);*/
68
+/*transform: translate(70px, 0);*/
69
+/*opacity: 1;*/
70
+/*}*/
71
+/*}*/
72
+/*@-webkit-keyframes lds-pacman-3 {*/
73
+/*0% {*/
74
+/*-webkit-transform: translate(190px, 0);*/
75
+/*transform: translate(190px, 0);*/
76
+/*opacity: 0;*/
77
+/*}*/
78
+/*20% {*/
79
+/*opacity: 1;*/
80
+/*}*/
81
+/*100% {*/
82
+/*-webkit-transform: translate(70px, 0);*/
83
+/*transform: translate(70px, 0);*/
84
+/*opacity: 1;*/
85
+/*}*/
86
+/*}*/
87
+
88
+/*.app-loading {*/
89
+/*font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
90
+/*position: relative;*/
91
+/*display: flex;*/
92
+/*flex-direction: column;*/
93
+/*align-items: center;*/
94
+/*justify-content: center;*/
95
+/*top: 10em;*/
96
+/*}*/
97
+/*.app-loading p {*/
98
+/*display: block;*/
99
+/*font-size: 1.17em;*/
100
+/*margin-inline-start: 0px;*/
101
+/*margin-inline-end: 0px;*/
102
+/*font-weight: normal;*/
103
+/*}*/
104
+
105
+/*.app-loading .lds-pacman {*/
106
+/*position: relative;*/
107
+/*margin: auto;*/
108
+/*}*/
109
+/*.app-loading .lds-pacman > div:nth-child(2) div {*/
110
+/*position: absolute;*/
111
+/*top: 40px;*/
112
+/*left: 40px;*/
113
+/*width: 120px;*/
114
+/*height: 60px;*/
115
+/*border-radius: 120px 120px 0 0;*/
116
+/*background: #bbcedd;*/
117
+/*-webkit-animation: lds-pacman-1 1s linear infinite;*/
118
+/*animation: lds-pacman-1 1s linear infinite;*/
119
+/*-webkit-transform-origin: 60px 60px;*/
120
+/*transform-origin: 60px 60px;*/
121
+/*}*/
122
+/*.app-loading .lds-pacman > div:nth-child(2) div:nth-child(2) {*/
123
+/*-webkit-animation: lds-pacman-2 1s linear infinite;*/
124
+/*animation: lds-pacman-2 1s linear infinite;*/
125
+/*}*/
126
+/*.app-loading .lds-pacman > div:nth-child(1) div {*/
127
+/*position: absolute;*/
128
+/*top: 92px;*/
129
+/*left: -8px;*/
130
+/*width: 24px;*/
131
+/*height: 24px;*/
132
+/*border-radius: 50%;*/
133
+/*background-image: url('../images/hipster192.png');*/
134
+/*background-size: contain;*/
135
+/*-webkit-animation: lds-pacman-3 1s linear infinite;*/
136
+/*animation: lds-pacman-3 1.5s linear infinite;*/
137
+/*}*/
138
+/*.app-loading .lds-pacman > div:nth-child(1) div:nth-child(1) {*/
139
+/*-webkit-animation-delay: -0.67s;*/
140
+/*animation-delay: -1s;*/
141
+/*}*/
142
+/*.app-loading .lds-pacman > div:nth-child(1) div:nth-child(2) {*/
143
+/*-webkit-animation-delay: -0.33s;*/
144
+/*animation-delay: -0.5s;*/
145
+/*}*/
146
+/*.app-loading .lds-pacman > div:nth-child(1) div:nth-child(3) {*/
147
+/*-webkit-animation-delay: 0s;*/
148
+/*animation-delay: 0s;*/
149
+/*}*/
150
+/*.app-loading .lds-pacman {*/
151
+/*width: 200px !important;*/
152
+/*height: 200px !important;*/
153
+/*-webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px);*/
154
+/*transform: translate(-100px, -100px) scale(1) translate(100px, 100px);*/
155
+/*}*/
156
+.sk-cube-grid {
157
+    position: absolute;
158
+    top: calc(100vh - 50% - 40px / 2);
159
+    left: calc(100vw - 50% - 40px / 2);
160
+    border-radius: 50%;
161
+    width: 40px;
162
+    height: 40px;
163
+    margin: auto;
14 164
 }
15
-@-webkit-keyframes lds-pacman-1 {
16
-    0% {
17
-        -webkit-transform: rotate(0deg);
18
-        transform: rotate(0deg);
19
-    }
20
-    50% {
21
-        -webkit-transform: rotate(-45deg);
22
-        transform: rotate(-45deg);
23
-    }
24
-    100% {
25
-        -webkit-transform: rotate(0deg);
26
-        transform: rotate(0deg);
27
-    }
165
+
166
+.sk-cube-grid .sk-cube {
167
+    width: 33%;
168
+    height: 33%;
169
+    background-color: #333;
170
+    float: left;
171
+    -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
172
+    animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
173
+}
174
+.sk-cube-grid .sk-cube1 {
175
+    -webkit-animation-delay: 0.2s;
176
+    animation-delay: 0.2s;
177
+}
178
+.sk-cube-grid .sk-cube2 {
179
+    -webkit-animation-delay: 0.3s;
180
+    animation-delay: 0.3s;
181
+}
182
+.sk-cube-grid .sk-cube3 {
183
+    -webkit-animation-delay: 0.4s;
184
+    animation-delay: 0.4s;
185
+}
186
+.sk-cube-grid .sk-cube4 {
187
+    -webkit-animation-delay: 0.1s;
188
+    animation-delay: 0.1s;
189
+}
190
+.sk-cube-grid .sk-cube5 {
191
+    -webkit-animation-delay: 0.2s;
192
+    animation-delay: 0.2s;
193
+}
194
+.sk-cube-grid .sk-cube6 {
195
+    -webkit-animation-delay: 0.3s;
196
+    animation-delay: 0.3s;
197
+}
198
+.sk-cube-grid .sk-cube7 {
199
+    -webkit-animation-delay: 0s;
200
+    animation-delay: 0s;
28 201
 }
29
-@keyframes lds-pacman-2 {
30
-    0% {
31
-        -webkit-transform: rotate(180deg);
32
-        transform: rotate(180deg);
33
-    }
34
-    50% {
35
-        -webkit-transform: rotate(225deg);
36
-        transform: rotate(225deg);
37
-    }
38
-    100% {
39
-        -webkit-transform: rotate(180deg);
40
-        transform: rotate(180deg);
41
-    }
202
+.sk-cube-grid .sk-cube8 {
203
+    -webkit-animation-delay: 0.1s;
204
+    animation-delay: 0.1s;
42 205
 }
43
-@-webkit-keyframes lds-pacman-2 {
44
-    0% {
45
-        -webkit-transform: rotate(180deg);
46
-        transform: rotate(180deg);
47
-    }
48
-    50% {
49
-        -webkit-transform: rotate(225deg);
50
-        transform: rotate(225deg);
51
-    }
52
-    100% {
53
-        -webkit-transform: rotate(180deg);
54
-        transform: rotate(180deg);
55
-    }
206
+.sk-cube-grid .sk-cube9 {
207
+    -webkit-animation-delay: 0.2s;
208
+    animation-delay: 0.2s;
56 209
 }
57
-@keyframes lds-pacman-3 {
58
-    0% {
59
-        -webkit-transform: translate(190px, 0);
60
-        transform: translate(190px, 0);
61
-        opacity: 0;
62
-    }
63
-    20% {
64
-        opacity: 1;
65
-    }
210
+
211
+@-webkit-keyframes sk-cubeGridScaleDelay {
212
+    0%,
213
+    70%,
66 214
     100% {
67
-        -webkit-transform: translate(70px, 0);
68
-        transform: translate(70px, 0);
69
-        opacity: 1;
70
-    }
71
-}
72
-@-webkit-keyframes lds-pacman-3 {
73
-    0% {
74
-        -webkit-transform: translate(190px, 0);
75
-        transform: translate(190px, 0);
76
-        opacity: 0;
215
+        -webkit-transform: scale3D(1, 1, 1);
216
+        transform: scale3D(1, 1, 1);
77 217
     }
78
-    20% {
79
-        opacity: 1;
80
-    }
81
-    100% {
82
-        -webkit-transform: translate(70px, 0);
83
-        transform: translate(70px, 0);
84
-        opacity: 1;
218
+    35% {
219
+        -webkit-transform: scale3D(0, 0, 1);
220
+        transform: scale3D(0, 0, 1);
85 221
     }
86 222
 }
87 223
 
88
-.app-loading {
89
-    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
90
-    position: relative;
91
-    display: flex;
92
-    flex-direction: column;
93
-    align-items: center;
94
-    justify-content: center;
95
-    top: 10em;
96
-}
97
-.app-loading p {
98
-    display: block;
99
-    font-size: 1.17em;
100
-    margin-inline-start: 0px;
101
-    margin-inline-end: 0px;
102
-    font-weight: normal;
103
-}
104
-
105
-.app-loading .lds-pacman {
106
-    position: relative;
107
-    margin: auto;
108
-}
109
-.app-loading .lds-pacman > div:nth-child(2) div {
110
-    position: absolute;
111
-    top: 40px;
112
-    left: 40px;
113
-    width: 120px;
114
-    height: 60px;
115
-    border-radius: 120px 120px 0 0;
116
-    background: #bbcedd;
117
-    -webkit-animation: lds-pacman-1 1s linear infinite;
118
-    animation: lds-pacman-1 1s linear infinite;
119
-    -webkit-transform-origin: 60px 60px;
120
-    transform-origin: 60px 60px;
121
-}
122
-.app-loading .lds-pacman > div:nth-child(2) div:nth-child(2) {
123
-    -webkit-animation: lds-pacman-2 1s linear infinite;
124
-    animation: lds-pacman-2 1s linear infinite;
125
-}
126
-.app-loading .lds-pacman > div:nth-child(1) div {
127
-    position: absolute;
128
-    top: 92px;
129
-    left: -8px;
130
-    width: 24px;
131
-    height: 24px;
132
-    border-radius: 50%;
133
-    background-image: url('../images/hipster192.png');
134
-    background-size: contain;
135
-    -webkit-animation: lds-pacman-3 1s linear infinite;
136
-    animation: lds-pacman-3 1.5s linear infinite;
137
-}
138
-.app-loading .lds-pacman > div:nth-child(1) div:nth-child(1) {
139
-    -webkit-animation-delay: -0.67s;
140
-    animation-delay: -1s;
141
-}
142
-.app-loading .lds-pacman > div:nth-child(1) div:nth-child(2) {
143
-    -webkit-animation-delay: -0.33s;
144
-    animation-delay: -0.5s;
145
-}
146
-.app-loading .lds-pacman > div:nth-child(1) div:nth-child(3) {
147
-    -webkit-animation-delay: 0s;
148
-    animation-delay: 0s;
149
-}
150
-.app-loading .lds-pacman {
151
-    width: 200px !important;
152
-    height: 200px !important;
153
-    -webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
154
-    transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
224
+@keyframes sk-cubeGridScaleDelay {
225
+    0%,
226
+    70%,
227
+    100% {
228
+        -webkit-transform: scale3D(1, 1, 1);
229
+        transform: scale3D(1, 1, 1);
230
+    }
231
+    35% {
232
+        -webkit-transform: scale3D(0, 0, 1);
233
+        transform: scale3D(0, 0, 1);
234
+    }
155 235
 }

BIN
src/main/webapp/content/images/faceofbooks1.jpg View File


BIN
src/main/webapp/content/images/faceofbooks1.png View File


+ 10
- 3
src/main/webapp/index.html View File

@@ -21,9 +21,16 @@
21 21
     <jhi-main>
22 22
         <div class="app-loading">
23 23
             <div class="lds-css ng-scope">
24
-                <div class="lds-pacman">
25
-                    <div><div></div><div></div><div></div></div>
26
-                    <div><div></div><div></div><div></div></div>
24
+                <div class="sk-cube-grid">
25
+                    <div class="sk-cube sk-cube1"></div>
26
+                    <div class="sk-cube sk-cube2"></div>
27
+                    <div class="sk-cube sk-cube3"></div>
28
+                    <div class="sk-cube sk-cube4"></div>
29
+                    <div class="sk-cube sk-cube5"></div>
30
+                    <div class="sk-cube sk-cube6"></div>
31
+                    <div class="sk-cube sk-cube7"></div>
32
+                    <div class="sk-cube sk-cube8"></div>
33
+                    <div class="sk-cube sk-cube9"></div>
27 34
                 </div>
28 35
             </div>
29 36
         </div>