fix: calender setting skeleton (#20317)

This commit is contained in:
Anik Dhabal Babu
2025-03-23 08:23:28 +00:00
committed by GitHub
parent 42807481c1
commit 01c16ad150
2 changed files with 17 additions and 17 deletions
@@ -278,19 +278,19 @@ const destinationCalendarComponents = {
<div className="border-subtle space-y-6 rounded-lg border p-6">
<div className="flex flex-col space-y-4 lg:flex-row lg:space-x-4 lg:space-y-0">
<div className="flex w-full flex-col">
<div className="h-4 w-32 animate-pulse rounded-md bg-gray-200" />
<div className="mt-2 h-10 w-full animate-pulse rounded-md bg-gray-200" />
<div className="mt-2 h-4 w-48 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-4 w-32 animate-pulse rounded-md" />
<div className="bg-emphasis mt-2 h-10 w-full animate-pulse rounded-md" />
<div className="bg-emphasis mt-2 h-4 w-48 animate-pulse rounded-md" />
</div>
<div className="w-full">
<div className="h-4 w-32 animate-pulse rounded-md bg-gray-200" />
<div className="mt-2 h-10 w-full animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-4 w-32 animate-pulse rounded-md" />
<div className="bg-emphasis mt-2 h-10 w-full animate-pulse rounded-md" />
</div>
</div>
<div className="space-y-2">
<div className="h-6 w-64 animate-pulse rounded-md bg-gray-200" />
<div className="h-10 w-full animate-pulse rounded-md bg-gray-200" />
<div className="h-4 w-48 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-6 w-64 animate-pulse rounded-md" />
<div className="bg-emphasis h-10 w-full animate-pulse rounded-md" />
<div className="bg-emphasis h-4 w-48 animate-pulse rounded-md" />
</div>
</div>
);
@@ -199,28 +199,28 @@ export const SelectedCalendarsSettingsWebWrapperSkeleton = () => {
<div className="border-subtle border-b p-6">
<div className="flex items-center justify-between">
<div>
<div className="h-4 w-32 animate-pulse rounded-md bg-gray-200" />
<div className="mt-2 h-4 w-48 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-4 w-32 animate-pulse rounded-md" />
<div className="bg-emphasis mt-2 h-4 w-48 animate-pulse rounded-md" />
</div>
<div className="h-8 w-32 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-8 w-32 animate-pulse rounded-md" />
</div>
</div>
<div className="p-6 pt-2">
<div className="border-subtle mt-4 rounded-lg border p-4">
<div className="flex items-center">
<div className="h-10 w-10 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-10 w-10 animate-pulse rounded-md" />
<div className="ml-4 space-y-2">
<div className="h-4 w-32 animate-pulse rounded-md bg-gray-200" />
<div className="h-4 w-48 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-4 w-32 animate-pulse rounded-md" />
<div className="bg-emphasis h-4 w-48 animate-pulse rounded-md" />
</div>
</div>
<div className="border-subtle mt-4 space-y-4 border-t pt-4">
<div className="h-4 w-64 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-4 w-64 animate-pulse rounded-md" />
<div className="space-y-2">
{[1, 2, 3].map((i) => (
<div key={i} className="flex items-center justify-between">
<div className="h-4 w-48 animate-pulse rounded-md bg-gray-200" />
<div className="h-6 w-10 animate-pulse rounded-md bg-gray-200" />
<div className="bg-emphasis h-4 w-48 animate-pulse rounded-md" />
<div className="bg-emphasis h-6 w-10 animate-pulse rounded-md" />
</div>
))}
</div>