initial page preloader
diff --git a/services/self-service/src/main/resources/webapp/src/app/app.module.ts b/services/self-service/src/main/resources/webapp/src/app/app.module.ts
index a010587..3b3b445 100644
--- a/services/self-service/src/main/resources/webapp/src/app/app.module.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/app.module.ts
@@ -68,8 +68,7 @@
provide: LocationStrategy,
useClass: HashLocationStrategy,
useValue: '/'
- }
- ],
+ }],
bootstrap: [AppComponent]
})
export class AppModule { }
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/app-loading.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/app-loading.scss
index c4783e1..dfaccb2 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/app-loading.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/app-loading.scss
@@ -17,6 +17,65 @@
* under the License.
*/
+body,
+html {
+ height: 100%;
+}
+
+.app-loading {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+}
+
+.app-loading .spinner {
+ height: 200px;
+ width: 200px;
+ animation: rotate 2s linear infinite;
+ transform-origin: center center;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+}
+
+.app-loading .spinner .path {
+ stroke-dasharray: 20, 200;
+ stroke-dashoffset: 0;
+ animation: dash 1.5s ease-in-out infinite;
+ stroke-linecap: round;
+ stroke: #35afd5;
+}
+
+@keyframes rotate {
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes dash {
+ 0% {
+ stroke-dasharray: 1, 200;
+ stroke-dashoffset: 0;
+ }
+
+ 50% {
+ stroke-dasharray: 89, 200;
+ stroke-dashoffset: -35px;
+ }
+
+ 100% {
+ stroke-dasharray: 89, 200;
+ stroke-dashoffset: -124px;
+ }
+}
+
+
.app-loading {
.logo {
width: 100px;
diff --git a/services/self-service/src/main/resources/webapp/src/dictionary/global.dictionary.ts b/services/self-service/src/main/resources/webapp/src/dictionary/global.dictionary.ts
index 437016f..6d0d8ea 100644
--- a/services/self-service/src/main/resources/webapp/src/dictionary/global.dictionary.ts
+++ b/services/self-service/src/main/resources/webapp/src/dictionary/global.dictionary.ts
@@ -19,8 +19,8 @@
// from './{{ aws | gcp | azure }}.dictionary';
-import { NAMING_CONVENTION } from './aws.dictionary';
+import { NAMING_CONVENTION } from './CLOUD_PROVIDER.dictionary';
-export * from './aws.dictionary';
+export * from './CLOUD_PROVIDER.dictionary';
export const DICTIONARY = Object.freeze(NAMING_CONVENTION);
diff --git a/services/self-service/src/main/resources/webapp/src/index.html b/services/self-service/src/main/resources/webapp/src/index.html
index facd7a1..849c5f1 100644
--- a/services/self-service/src/main/resources/webapp/src/index.html
+++ b/services/self-service/src/main/resources/webapp/src/index.html
@@ -94,7 +94,7 @@
<body>
<app-root>
- <!-- <div class="app-loading">
+ <div class="app-loading">
<div class="logo">
<svg version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 140.5 47.1" width="100px" height="100px"
style="enable-background:new 0 0 140.5 47.1;" xml:space="preserve">
@@ -105,8 +105,7 @@
<svg class="spinner" viewBox="25 25 50 50">
<circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="1" stroke-miterlimit="10" />
</svg>
- </div> -->
- Loading...
+ </div>
</app-root>
</body>