Files
web/apps/scandic-web/components/HotelReservation/MyStay/Rooms/MultiRoom/MultiRoomSkeleton.tsx
2025-04-28 12:40:52 +00:00

46 lines
1.6 KiB
TypeScript

import SkeletonShimmer from "@/components/SkeletonShimmer"
import Divider from "@/components/TempDesignSystem/Divider"
import styles from "./multiRoom.module.css"
export default function MultiRoomSkeleton() {
return (
<div className={styles.multiRoom}>
<div className={styles.roomName}>
<SkeletonShimmer width="50%" height="30px" />
</div>
<div className={styles.roomHeader}>
<SkeletonShimmer width="100%" height="23px" />
</div>
<div className={styles.multiRoomCard}>
<div className={styles.imageContainer}>
<SkeletonShimmer width="100%" height="100%" />
</div>
<div className={styles.details}>
<div className={styles.row}>
<SkeletonShimmer width="60px" height="23px" />
<SkeletonShimmer width="110px" height="23px" />
</div>
<div className={styles.row}>
<SkeletonShimmer width="55px" height="23px" />
<SkeletonShimmer width="130px" height="23px" />
</div>
<div className={styles.row}>
<SkeletonShimmer width="75px" height="23px" />
<SkeletonShimmer width="155px" height="23px" />
</div>
<div className={styles.row}>
<SkeletonShimmer width="75px" height="23px" />
<SkeletonShimmer width="65px" height="23px" />
</div>
<Divider color="subtle" />
<div className={styles.row}>
<SkeletonShimmer width="150px" height="30px" />
<SkeletonShimmer width="150px" height="30px" />
</div>
</div>
</div>
</div>
)
}