if/*: show loading animation before full JS is loaded

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer
2021-04-04 16:10:08 +02:00
parent 8cae1f2ab5
commit 9517c890b5
4 changed files with 62 additions and 4 deletions

View File

@ -13,6 +13,19 @@
</head>
<body>
<ak-message-container></ak-message-container>
<ak-interface-admin></ak-interface-admin>
<ak-interface-admin>
<section class="pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
<div class="pf-c-empty-state" style="height: 100vh;">
<div class="pf-c-empty-state__content">
<span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="Loading...">
<span class="pf-c-spinner__clipper"></span>
<span class="pf-c-spinner__lead-ball"></span>
<span class="pf-c-spinner__tail-ball"></span>
</span>
<h1 class="pf-c-title pf-m-lg">Loading...</h1>
</div>
</div>
</section>
</ak-interface-admin>
</body>
</html>

View File

@ -13,6 +13,19 @@
</head>
<body>
<ak-message-container></ak-message-container>
<ak-flow-executor></ak-flow-executor>
<ak-flow-executor>
<section class="pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
<div class="pf-c-empty-state" style="height: 100vh;">
<div class="pf-c-empty-state__content">
<span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="Loading...">
<span class="pf-c-spinner__clipper"></span>
<span class="pf-c-spinner__lead-ball"></span>
<span class="pf-c-spinner__tail-ball"></span>
</span>
<h1 class="pf-c-title pf-m-lg">Loading...</h1>
</div>
</div>
</section>
</ak-flow-executor>
</body>
</html>