hamed/nobat724_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(loading): enhance loading components with responsive design and improved skeletons

Browse Source
This commit is contained in:
hamed
2026-06-21 11:49:30 +03:30
parent 06a877a725
commit 704a514542
6 changed files with 87 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/doctor/[slug]/loading.js
+19 -9
View File
@@ -1,17 +1,27 @@
import { Skeleton } from "@mui/material";
import CircularLoading from "@/app/component/loading/Circular";
import CustomLoading from "@/app/component/loading/Custom";
import TextLoading from "@/app/component/loading/Text";
export default function Loading() {
return (
<div className="p-4 flex flex-col gap-6" dir="rtl">
<div className="flex flex-col lg:flex-row items-center gap-4">
<Skeleton variant="circular" width={164} height={164} />
<div className="flex flex-col gap-3 w-full">
<Skeleton variant="rounded" width={200} height={24} />
<Skeleton variant="rounded" width={160} height={20} />
<Skeleton variant="rounded" width={120} height={20} />
<div className="padding-responsive pt-[95px] sm:pt-[120px]">
<div className="flex flex-col lg:flex-row items-center justify-start gap-[8px] lg:gap-[32px]">
<CircularLoading
loading
width={100}
height={100}
className="w-[40px] sm:w-[81px] md:w-[123px] lg:w-[164px] h-[40px] sm:h-[81px] md:h-[123px] lg:h-[164px]"
/>
<div className="flex flex-col items-center lg:items-start gap-[8px] lg:gap-[16px]">
<TextLoading loading width={90} height={20} />
<TextLoading loading width={100} height={20} />
<div className="flex items-center justify-start gap-11">
<TextLoading loading width={60} height={20} />
<TextLoading loading width={120} height={20} />
</div>
<CustomLoading loading width={160} height={25} />
</div>
</div>
<Skeleton variant="rounded" height={300} className="!rounded-lg" />
</div>
);
}