Files
web/components/HotelReservation/HotelCard/HotelCardSkeleton.tsx
2024-12-10 13:40:55 +01:00

35 lines
1.0 KiB
TypeScript

import SkeletonShimmer from "@/components/SkeletonShimmer"
import styles from "./HotelCardSkeleton.module.css"
export function HotelCardSkeleton() {
return (
<article className={styles.card}>
{/* image container */}
<div className={styles.imageContainer}>
<SkeletonShimmer width={"100%"} height="100%" />
</div>
<div className={styles.content}>
<SkeletonShimmer height={"65px"} />
<div className={styles.text}>
<SkeletonShimmer height={"20px"} />
<SkeletonShimmer height={"20px"} />
<SkeletonShimmer height={"20px"} />
<SkeletonShimmer height={"20px"} />
</div>
<SkeletonShimmer height={"56px"} />
<SkeletonShimmer height={"52px"} width={"150px"} />
</div>
<div className={styles.priceVariants}>
{/* price variants */}
{Array.from({ length: 2 }).map((_, index) => (
<SkeletonShimmer key={index} height={"100px"} />
))}
<SkeletonShimmer height={"40px"} />
</div>
</article>
)
}