mirror of
https://github.com/hanzoai/calendar.git
synced 2026-10-30 14:46:43 +00:00
6b9115dfde
* wip * fix type check * refactor "/settings/my-account/profile" * refactor "settings/my-account/general" * refactor "/settings/my-accouunt/calendars" * refactor "/settings/my-account/appearance" * fix: type-check --------- Co-authored-by: Amit Sharma <[email protected]> Co-authored-by: Amit Sharma <[email protected]>
38 lines
1.5 KiB
TypeScript
38 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import SectionBottomActions from "@calcom/features/settings/SectionBottomActions";
|
|
import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
|
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
|
import { SkeletonButton, SkeletonContainer, SkeletonText } from "@calcom/ui/components/skeleton";
|
|
|
|
export const SkeletonLoader = () => {
|
|
const { t } = useLocale();
|
|
return (
|
|
<SettingsHeader title={t("appearance")} description={t("appearance_description")}>
|
|
<SkeletonContainer>
|
|
<div className="border-subtle mt-6 flex items-center rounded-t-xl border p-6 text-sm">
|
|
<SkeletonText className="h-8 w-1/3" />
|
|
</div>
|
|
<div className="border-subtle space-y-6 border-x px-4 py-6 sm:px-6">
|
|
<div className="[&>*]:bg-emphasis flex w-full items-center justify-center gap-x-2 [&>*]:animate-pulse">
|
|
<div className="h-32 flex-1 rounded-md p-5" />
|
|
<div className="h-32 flex-1 rounded-md p-5" />
|
|
<div className="h-32 flex-1 rounded-md p-5" />
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<SkeletonText className="h-8 w-1/3" />
|
|
<SkeletonText className="h-8 w-1/3" />
|
|
</div>
|
|
|
|
<SkeletonText className="h-8 w-full" />
|
|
</div>
|
|
<div className="rounded-b-lg">
|
|
<SectionBottomActions align="end">
|
|
<SkeletonButton className="mr-6 h-8 w-20 rounded-md p-5" />
|
|
</SectionBottomActions>
|
|
</div>
|
|
</SkeletonContainer>
|
|
</SettingsHeader>
|
|
);
|
|
};
|