added animated logo for starting up

This commit is contained in:
Paul Wilde 2023-02-14 15:50:44 +00:00
parent 351e4e3e14
commit 6f82189a42
3 changed files with 37 additions and 22 deletions

View file

@ -10,6 +10,7 @@
"dependencies": { "dependencies": {
"@mdi/font": "5.9.55", "@mdi/font": "5.9.55",
"@vuepic/vue-datepicker": "^3.6.4", "@vuepic/vue-datepicker": "^3.6.4",
"animate.css": "^4.1.1",
"axios": "^1.2.2", "axios": "^1.2.2",
"core-js": "^3.8.3", "core-js": "^3.8.3",
"moment": "^2.29.4", "moment": "^2.29.4",

View file

@ -1,10 +1,19 @@
<template> <template>
<div :class="{ loader: true, fadeout: !isLoading }"> <div :class="{ loader: true, fadeout: !isLoading }">
Loading ... <div class="animate__animated animate__rubberBand animate__infinite animate__slow">
<v-img style="border-radius:5%" height="128" src="/images/cmc-logo.png" /><br/>
</div>
<br/>
<v-progress-circular
color="deep-orange"
indeterminate
></v-progress-circular>
Starting ...
</div> </div>
</template> </template>
<script> <script>
import 'animate.css';
export default { export default {
name: "LoadingScreen", name: "LoadingScreen",
props: ["isLoading"] props: ["isLoading"]

View file

@ -1925,6 +1925,11 @@ ajv@^8.0.0, ajv@^8.0.1, ajv@^8.8.0:
require-from-string "^2.0.2" require-from-string "^2.0.2"
uri-js "^4.2.2" uri-js "^4.2.2"
animate.css@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/animate.css/-/animate.css-4.1.1.tgz#614ec5a81131d7e4dc362a58143f7406abd68075"
integrity sha512-+mRmCTv6SbCmtYJCN4faJMNFVNN5EuCTTprDTAo7YzIGji2KADmakjVA3+8mVDkZ2Bf09vayB35lSQIex2+QaQ==
ansi-colors@^4.1.1: ansi-colors@^4.1.1:
version "4.1.3" version "4.1.3"
resolved "https://registry.npmmirror.com/ansi-colors/-/ansi-colors-4.1.3.tgz#37611340eb2243e70cc604cad35d63270d48781b" resolved "https://registry.npmmirror.com/ansi-colors/-/ansi-colors-4.1.3.tgz#37611340eb2243e70cc604cad35d63270d48781b"