瀏覽代碼

Merge branch 'home' of ElliottStansbury/JhipsterGroupProject-Client into home

ElliottStansbury 5 年之前
父節點
當前提交
26aa677eae

+ 192
- 0
src/main/java/rocks/zipcode/io/web/rest/AccountResource.java 查看文件

@@ -0,0 +1,192 @@
1
+package rocks.zipcode.io.web.rest;
2
+
3
+import com.codahale.metrics.annotation.Timed;
4
+
5
+import rocks.zipcode.io.domain.User;
6
+import rocks.zipcode.io.repository.ProfileRepository;
7
+import rocks.zipcode.io.repository.UserRepository;
8
+import rocks.zipcode.io.security.SecurityUtils;
9
+import rocks.zipcode.io.service.MailService;
10
+import rocks.zipcode.io.service.UserService;
11
+import rocks.zipcode.io.service.dto.PasswordChangeDTO;
12
+import rocks.zipcode.io.service.dto.UserDTO;
13
+import rocks.zipcode.io.web.rest.errors.*;
14
+import rocks.zipcode.io.web.rest.vm.KeyAndPasswordVM;
15
+import rocks.zipcode.io.web.rest.vm.ManagedUserVM;
16
+
17
+import org.apache.commons.lang3.StringUtils;
18
+import org.slf4j.Logger;
19
+import org.slf4j.LoggerFactory;
20
+import org.springframework.http.HttpStatus;
21
+import org.springframework.web.bind.annotation.*;
22
+
23
+import javax.servlet.http.HttpServletRequest;
24
+import javax.validation.Valid;
25
+import java.util.*;
26
+
27
+
28
+/**
29
+ * REST controller for managing the current user's account.
30
+ */
31
+@RestController
32
+@RequestMapping("/api")
33
+public class AccountResource {
34
+
35
+    private final Logger log = LoggerFactory.getLogger(AccountResource.class);
36
+
37
+    private final UserRepository userRepository;
38
+
39
+    private final UserService userService;
40
+
41
+    private final MailService mailService;
42
+
43
+    public AccountResource(UserRepository userRepository, UserService userService, MailService mailService) {
44
+
45
+        this.userRepository = userRepository;
46
+        this.userService = userService;
47
+        this.mailService = mailService;
48
+    }
49
+
50
+    /**
51
+     * POST  /register : register the user.
52
+     *
53
+     * @param managedUserVM the managed user View Model
54
+     * @throws InvalidPasswordException 400 (Bad Request) if the password is incorrect
55
+     * @throws EmailAlreadyUsedException 400 (Bad Request) if the email is already used
56
+     * @throws LoginAlreadyUsedException 400 (Bad Request) if the login is already used
57
+     */
58
+    @PostMapping("/register")
59
+    @Timed
60
+    @ResponseStatus(HttpStatus.CREATED)
61
+    public void registerAccount(@Valid @RequestBody ManagedUserVM managedUserVM) {
62
+        if (!checkPasswordLength(managedUserVM.getPassword())) {
63
+            throw new InvalidPasswordException();
64
+        }
65
+        User user = userService.registerUser(managedUserVM, managedUserVM.getPassword());
66
+        mailService.sendActivationEmail(user);
67
+        System.out.println("1");
68
+    }
69
+
70
+    /**
71
+     * GET  /activate : activate the registered user.
72
+     *
73
+     * @param key the activation key
74
+     * @throws RuntimeException 500 (Internal Server Error) if the user couldn't be activated
75
+     */
76
+    @GetMapping("/activate")
77
+    @Timed
78
+    public void activateAccount(@RequestParam(value = "key") String key) {
79
+        Optional<User> user = userService.activateRegistration(key);
80
+        if (!user.isPresent()) {
81
+            throw new InternalServerErrorException("No user was found for this activation key");
82
+        }
83
+    }
84
+
85
+    /**
86
+     * GET  /authenticate : check if the user is authenticated, and return its login.
87
+     *
88
+     * @param request the HTTP request
89
+     * @return the login if the user is authenticated
90
+     */
91
+    @GetMapping("/authenticate")
92
+    @Timed
93
+    public String isAuthenticated(HttpServletRequest request) {
94
+        log.debug("REST request to check if the current user is authenticated");
95
+        System.out.println("3");
96
+        return request.getRemoteUser();
97
+    }
98
+
99
+    /**
100
+     * GET  /account : get the current user.
101
+     *
102
+     * @return the current user
103
+     * @throws RuntimeException 500 (Internal Server Error) if the user couldn't be returned
104
+     */
105
+    @GetMapping("/account")
106
+    @Timed
107
+    public UserDTO getAccount() {
108
+        System.out.println("4");
109
+        return userService.getUserWithAuthorities()
110
+            .map(UserDTO::new)
111
+            .orElseThrow(() -> new InternalServerErrorException("User could not be found"));
112
+    }
113
+
114
+    /**
115
+     * POST  /account : update the current user information.
116
+     *
117
+     * @param userDTO the current user information
118
+     * @throws EmailAlreadyUsedException 400 (Bad Request) if the email is already used
119
+     * @throws RuntimeException 500 (Internal Server Error) if the user login wasn't found
120
+     */
121
+    @PostMapping("/account")
122
+    @Timed
123
+    public void saveAccount(@Valid @RequestBody UserDTO userDTO) {
124
+        final String userLogin = SecurityUtils.getCurrentUserLogin().orElseThrow(() -> new InternalServerErrorException("Current user login not found"));
125
+        Optional<User> existingUser = userRepository.findOneByEmailIgnoreCase(userDTO.getEmail());
126
+        if (existingUser.isPresent() && (!existingUser.get().getLogin().equalsIgnoreCase(userLogin))) {
127
+            throw new EmailAlreadyUsedException();
128
+        }
129
+        Optional<User> user = userRepository.findOneByLogin(userLogin);
130
+        if (!user.isPresent()) {
131
+            throw new InternalServerErrorException("User could not be found");
132
+        }
133
+        userService.updateUser(userDTO.getFirstName(), userDTO.getLastName(), userDTO.getEmail(), userDTO.getLangKey(), userDTO.getImageUrl());
134
+    }
135
+
136
+    /**
137
+     * POST  /account/change-password : changes the current user's password
138
+     *
139
+     * @param passwordChangeDto current and new password
140
+     * @throws InvalidPasswordException 400 (Bad Request) if the new password is incorrect
141
+     */
142
+    @PostMapping(path = "/account/change-password")
143
+    @Timed
144
+    public void changePassword(@RequestBody PasswordChangeDTO passwordChangeDto) {
145
+        if (!checkPasswordLength(passwordChangeDto.getNewPassword())) {
146
+            throw new InvalidPasswordException();
147
+        }
148
+        userService.changePassword(passwordChangeDto.getCurrentPassword(), passwordChangeDto.getNewPassword());
149
+    }
150
+
151
+    /**
152
+     * POST   /account/reset-password/init : Send an email to reset the password of the user
153
+     *
154
+     * @param mail the mail of the user
155
+     * @throws EmailNotFoundException 400 (Bad Request) if the email address is not registered
156
+     */
157
+    @PostMapping(path = "/account/reset-password/init")
158
+    @Timed
159
+    public void requestPasswordReset(@RequestBody String mail) {
160
+       mailService.sendPasswordResetMail(
161
+           userService.requestPasswordReset(mail)
162
+               .orElseThrow(EmailNotFoundException::new)
163
+       );
164
+    }
165
+
166
+    /**
167
+     * POST   /account/reset-password/finish : Finish to reset the password of the user
168
+     *
169
+     * @param keyAndPassword the generated key and the new password
170
+     * @throws InvalidPasswordException 400 (Bad Request) if the password is incorrect
171
+     * @throws RuntimeException 500 (Internal Server Error) if the password could not be reset
172
+     */
173
+    @PostMapping(path = "/account/reset-password/finish")
174
+    @Timed
175
+    public void finishPasswordReset(@RequestBody KeyAndPasswordVM keyAndPassword) {
176
+        if (!checkPasswordLength(keyAndPassword.getNewPassword())) {
177
+            throw new InvalidPasswordException();
178
+        }
179
+        Optional<User> user =
180
+            userService.completePasswordReset(keyAndPassword.getNewPassword(), keyAndPassword.getKey());
181
+
182
+        if (!user.isPresent()) {
183
+            throw new InternalServerErrorException("No user was found for this reset key");
184
+        }
185
+    }
186
+
187
+    private static boolean checkPasswordLength(String password) {
188
+        return !StringUtils.isEmpty(password) &&
189
+            password.length() >= ManagedUserVM.PASSWORD_MIN_LENGTH &&
190
+            password.length() <= ManagedUserVM.PASSWORD_MAX_LENGTH;
191
+    }
192
+}

+ 7
- 8
src/main/webapp/app/home/home.component.html 查看文件

@@ -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 查看文件

@@ -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 查看文件

@@ -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 查看文件

@@ -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 查看文件

@@ -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 查看文件

@@ -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
 }

二進制
src/main/webapp/content/images/faceofbooks1.jpg 查看文件


二進制
src/main/webapp/content/images/faceofbooks1.png 查看文件


+ 10
- 3
src/main/webapp/index.html 查看文件

@@ -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>