scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 20:18:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Adds background color for skelton loader in dark mode (#9211)

Browse Source
This commit is contained in:
Sivin Varghese
2024-04-09 08:58:56 +05:30
committed by GitHub
parent 78724f7459
commit 12c5739287
2 changed files with 18 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAMetricCard.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="flex flex-col gap-2 items-start justify-center min-w-[10rem]">
<span
class="inline-flex items-center gap-1 text-sm text-slate-700 dark:text-slate-200 font-medium"
class="inline-flex items-center gap-1 text-sm font-medium text-slate-700 dark:text-slate-200"
>
{{ label }}
<fluent-icon
@@ -9,12 +9,12 @@
size="14"
icon="information"
type="outline"
class="flex-shrink-0 text-sm font-normal flex sm:font-medium text-slate-500 dark:text-slate-500"
class="flex flex-shrink-0 text-sm font-normal sm:font-medium text-slate-500 dark:text-slate-500"
/>
</span>
<div
v-if="isLoading"
class="w-12 h-6 mb-0.5 rounded-md bg-slate-50 animate-pulse"
class="w-12 h-6 mb-0.5 rounded-md bg-slate-50 dark:bg-slate-800 animate-pulse"
/>
<span v-else class="text-2xl font-medium text-slate-900 dark:text-slate-25">

20
app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItemLoading.vue
View File

@@ -4,14 +4,22 @@ import BaseSettingsListItem from '../../components/BaseSettingsListItem.vue';
<template>
<base-settings-list-item class="opacity-50">
<template #title>
<div class="w-24 h-[26px] rounded-md bg-slate-50 animate-pulse" />
<div
class="w-24 h-[26px] rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
/>
</template>
<template #description>
<div class="w-64 h-4 mb-0.5 rounded-md bg-slate-50 animate-pulse" />
<div class="w-48 h-4 rounded-md bg-slate-50 animate-pulse" />
<div
class="w-64 h-4 mb-0.5 rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
/>
<div
class="w-48 h-4 rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
/>
</template>
<template #label>
<div class="w-32 h-[26px] bg-slate-50 animate-pulse rounded-md" />
<div
class="w-32 h-[26px] bg-slate-50 dark:bg-slate-700 animate-pulse rounded-md"
/>
</template>
<template #rightSection>
<div
@@ -22,7 +30,9 @@ import BaseSettingsListItem from '../../components/BaseSettingsListItem.vue';
:key="ii"
class="flex justify-end w-1/3 h-full px-4"
>
<div class="w-32 h-full rounded-md bg-slate-50 animate-pulse" />
<div
class="w-32 h-full rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
/>
</div>
</div>
</template>