Skip to content

Commit

Permalink
Changed loading animation in the dashboard
Browse files Browse the repository at this point in the history
  • Loading branch information
tg666 committed Jul 14, 2022
1 parent 7973a3a commit 6b39102
Showing 1 changed file with 8 additions and 8 deletions.
16 changes: 8 additions & 8 deletions src/Web/AdminModule/Presenter/templates/Dashboard.default.latte
Original file line number Diff line number Diff line change
Expand Up @@ -70,12 +70,12 @@
</svg>
</button>
</div>
<div x-bind="collapsePanel" class="mb-8 grid grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 2xl:grid-cols-7 gap-2">
<div x-bind="collapsePanel" :class="{'animate-pulse': STATUS_LOADING() === project.status}" class="mb-8 grid grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 2xl:grid-cols-7 gap-2">

<div :class="{'spinner': STATUS_LOADING() === project.status}" class="px-3 py-5 bg-white shadow rounded-lg overflow-hidden min-h-[140px]">
<div class="text-sm font-medium text-gray-500 truncate">{{_all_consents}}</div>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.allConsents.value">
<div x-show="null !== project.data.allConsents.value">
<div x-text="project.data.allConsents.value" class="mt-2 text-xl font-semibold text-gray-900"></div>

<p x-show="null !== project.data.allConsents.percentageDiff" :class="{'text-green-600': 0 <= project.data.allConsents.percentageDiff, 'text-red-600': 0 > project.data.allConsents.percentageDiff}" class="mt-4 flex items-baseline text-sm font-semibold">
Expand All @@ -96,7 +96,7 @@
<a x-show="project.links.consents" :href="project.links.consents" class="text-indigo-700">{{_unique_consents}}</a>
</div>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.uniqueConsents.value">
<div x-show="null !== project.data.uniqueConsents.value">
<div x-text="project.data.uniqueConsents.value" class="mt-2 text-xl font-semibold text-gray-900"></div>

<p x-show="null !== project.data.uniqueConsents.percentageDiff" :class="{'text-green-600': 0 <= project.data.uniqueConsents.percentageDiff, 'text-red-600': 0 > project.data.uniqueConsents.percentageDiff}" class="mt-4 flex items-baseline text-sm font-semibold">
Expand All @@ -114,7 +114,7 @@
<div :class="{'spinner': STATUS_LOADING() === project.status}" class="px-3 py-5 bg-white shadow rounded-lg overflow-hidden min-h-[140px]">
<div class="text-sm font-medium text-gray-500 truncate">{{_all_positive}}</div>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.allPositive.value">
<div x-show="null !== project.data.allPositive.value">
<div x-text="project.data.allPositive.value + '%'" class="mt-2 text-xl font-semibold text-gray-900"></div>

<p x-show="null !== project.data.allPositive.percentageDiff" :class="{'text-green-600': 0 <= project.data.allPositive.percentageDiff, 'text-red-600': 0 > project.data.allPositive.percentageDiff}" class="mt-4 flex items-baseline text-sm font-semibold">
Expand All @@ -132,7 +132,7 @@
<div :class="{'spinner': STATUS_LOADING() === project.status}" class="px-3 py-5 bg-white shadow rounded-lg overflow-hidden min-h-[140px]">
<div class="text-sm font-medium text-gray-500 truncate">{{_unique_positive}}</div>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.uniquePositive.value">
<div x-show="null !== project.data.uniquePositive.value">
<div x-text="project.data.uniquePositive.value + '%'" class="mt-2 text-xl font-semibold text-gray-900"></div>

<p x-show="null !== project.data.uniquePositive.percentageDiff" :class="{'text-green-600': 0 <= project.data.uniquePositive.percentageDiff, 'text-red-600': 0 > project.data.uniquePositive.percentageDiff}" class="mt-4 flex items-baseline text-sm font-semibold">
Expand All @@ -150,7 +150,7 @@
<div :class="{'spinner': STATUS_LOADING() === project.status}" class="px-3 py-5 bg-white shadow rounded-lg overflow-hidden min-h-[140px]">
<div class="text-sm font-medium text-gray-500 truncate">{{_last_consent}}</div>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.lastConsent.value" class="mt-2 text-lg font-semibold text-gray-900">
<div x-show="null !== project.data.lastConsent.value" class="mt-2 text-lg font-semibold text-gray-900">
<span x-data x-tooltip.interactive.placement.bottom="project.data.lastConsent.formattedValue" x-text="project.data.lastConsent.text"></span>
</div>
</div>
Expand All @@ -159,14 +159,14 @@
<span x-show="!project.links.providers" class="text-sm font-medium text-gray-500 truncate">{{_providers}}</span>
<a x-show="project.links.providers" :href="project.links.providers" class="text-sm font-medium text-indigo-700 truncate">{{_providers}}</a>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.providers.value" x-text="project.data.providers.value" class="mt-2 text-xl font-semibold text-gray-900"></div>
<div x-show="null !== project.data.providers.value" x-text="project.data.providers.value" class="mt-2 text-xl font-semibold text-gray-900"></div>
</div>

<div :class="{'spinner': STATUS_LOADING() === project.status}" class="px-3 py-5 bg-white shadow rounded-lg overflow-hidden min-h-[140px]">
<span x-show="!project.links.cookies" class="text-sm font-medium text-gray-500 truncate">{{_cookies}}</span>
<a x-show="project.links.cookies" :href="project.links.cookies" class="text-sm font-medium text-indigo-700 truncate">{{_cookies}}</a>

<div x-show="STATUS_LOADING() !== project.status && null !== project.data.cookies.commonValue" class="mt-2 text-xl font-semibold text-gray-900">
<div x-show="null !== project.data.cookies.commonValue" class="mt-2 text-xl font-semibold text-gray-900">
<span x-text="project.data.cookies.commonValue"></span>
<span x-show="null !== project.data.cookies.privateValue" x-text="'(' + project.data.cookies.privateValue + ')'"></span>
</div>
Expand Down

0 comments on commit 6b39102

Please sign in to comment.