trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

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

Browse source 
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
Show stats Download patch file Download diff file Expand all files Collapse all files

18
authentik/core/templates/if/admin.html
View file

@ -1,6 +1,7 @@
{% extends "base/skeleton.html" %}
{% load static %}
{% load i18n %}
{% block head %}
<script src="{% static 'dist/AdminInterface.js' %}?v={{ ak_version }}" type="module"></script>
@ -8,5 +9,20 @@
{% block 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="{% trans '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">
{% trans "Loading..." %}
</h1>
</div>
</div>
</section>
</ak-interface-admin>
{% endblock %}

18
authentik/core/templates/if/flow.html
View file

@ -1,6 +1,7 @@
{% extends "base/skeleton.html" %}
{% load static %}
{% load i18n %}
{% block head %}
<script src="{% static 'dist/FlowInterface.js' %}?v={{ ak_version }}" type="module"></script>
@ -8,5 +9,20 @@
{% block 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="{% trans '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">
{% trans "Loading..." %}
</h1>
</div>
</div>
</section>
</ak-flow-executor>
{% endblock %}

15
web/src/interfaces/admin/index.html
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>

15
web/src/interfaces/flow/index.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>