feat: added app name & version to splash/loading screen

Endebert · Sep 22, 2018 · 778e529 · 778e529
1 parent 5868abb
commit 778e529
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/src/Loading.vue b/src/Loading.vue
@@ -3,6 +3,9 @@
     <div style="flex: 0 1 auto; align-self: auto">
       <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 48 48"><defs><linearGradient x1="9.89" y1="5.26" x2="78.8" y2="83.42" gradientUnits="userSpaceOnUse" id="a"><stop offset="0" stop-opacity=".3"></stop><stop offset="1" stop-opacity="0"></stop></linearGradient></defs><g fill="none" fill-rule="none" stroke-width="none" stroke-miterlimit="10" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode:normal"><path d="M2 24a22 22 0 1 1 44 0 22 22 0 0 1-44 0z" fill="#484848" fill-rule="nonzero"></path><path d="M26.46 42.74l1.77-2.67L24 35.84l-7.06-9.4h2.36l-2.36-2.36v-2.35h2.36l-2.36-2.35 4.7-7.06H24l-6.06-6.06c.6-.2 1.21-.38 1.83-.52l1.88 1.87L24 5.26l2.35 2.35 1.88-1.87c.62.14 1.23.32 1.83.52l15.86 15.86a22 22 0 0 1-16.8 23.28zM12.24 28.78L28.9 45.45a22.07 22.07 0 0 1-10.24-.1L10.9 37.6 9.9 33.49l4.7 4.7z" fill="url(#a)" fill-rule="nonzero"></path><path d="M26.46 42.74l9.3-13.96-2.35 9.41 4.7-4.7-1.02 4.1a18.77 18.77 0 0 1-10.63 5.15zM10.9 37.6L9.9 33.49l4.7 4.7-2.35-9.4 9.3 13.95c-4.1-.54-7.8-2.4-10.63-5.14zm6.03-11.17h14.12L24 35.84zm0-4.7h14.12v2.35H16.94zm9.41-9.41l4.7 7.06h-14.1l4.7-7.06zm-6.58-6.58l1.88 1.87L24 5.26l2.35 2.35 1.88-1.87c.62.14 1.23.32 1.83.52l-3.7 3.7h-4.71l-3.7-3.7c.59-.2 1.2-.38 1.82-.52z"></path><path d="M26.46 42.74l9.3-13.96-2.35 9.41 4.7-4.7-1.02 4.1a18.77 18.77 0 0 1-10.63 5.15zM10.9 37.6L9.9 33.49l4.7 4.7-2.35-9.4 9.3 13.95c-4.1-.54-7.8-2.4-10.63-5.14zm6.03-11.17h14.12L24 35.84zm0-4.7h14.12v2.35H16.94zm9.41-9.41l4.7 7.06h-14.1l4.7-7.06zm-6.58-6.58l1.88 1.87L24 5.26l2.35 2.35 1.88-1.87c.62.14 1.23.32 1.83.52l-3.7 3.7h-4.71l-3.7-3.7c.59-.2 1.2-.38 1.82-.52z" fill="#fff" fill-rule="evenodd"></path><path d="M2 24a22 22 0 1 1 44 0 22 22 0 0 1-44 0z"></path><path d="M2 2h44v22H2z"></path><path d="M2 24V2h44v22z"></path><path d="M2 24V2h44v22z"></path><path d="M2 24V2h44v22z"></path><path d="M2 24V2h44v22z"></path></g></svg>
     </div>
+    <div class="title">SquadMC</div>
+    <div class="title version">{{appVersion}}</div>
+    <br>
     <div style="flex: 0 1 auto; align-self: auto">
       <div class="spinner">
         <div class="bounce1"></div>
@@ -14,16 +17,33 @@
 </template>
 
 <script>
+import { version as pkgVersion } from "../package.json";
+
 /**
  * This is a simple Loading page that is to be displayed until the actual content has been loaded.
  * See App.vue for more details.
  */
 export default {
   name: "Loading",
+  data() {
+    return {
+      appVersion: `v${pkgVersion}`,
+    };
+  },
 };
 </script>
 
 <style scoped>
+  .title {
+    font-family: sans-serif;
+    font-size: xx-large;
+    color: white;
+    text-align: center;
+  }
+  .title.version {
+    color: #9E9E9E;
+  }
+
   /*hide scrollbar*/
   body {
     overflow-y: hidden;