updated frontend

This commit is contained in:
Juthatip McDevitt 2024-06-21 17:23:02 -05:00
parent e60c80b41a
commit e2a5b18265
3 changed files with 181 additions and 364 deletions

View file

@ -34,7 +34,7 @@
<?php require('./components/header.php') ?> <?php require('./components/header.php') ?>
</div> </div>
<p class="booking-title">Rooms available</p> <p class="booking-title">Rooms available</p>
<div class="container"> <div class="container-xxl">
<div class="row"> <div class="row">
<div class="col-lg-3 col-md-12 mb-2"> <div class="col-lg-3 col-md-12 mb-2">
<nav class="navbar navbar-expand-lg navbar-light bg-light shadow rounded"> <nav class="navbar navbar-expand-lg navbar-light bg-light shadow rounded">
@ -101,37 +101,66 @@
</nav> </nav>
</div> </div>
<div class="col-lg-9 col-md-12"> <div class="col-lg-9 col-md-12">
<div class="card mb-3 shadow"> <?php
<div class="row g-0 p-2 align-items-center"> $room_res = select("SELECT * FROM `rooms` WHERE `status`=? AND `removed`=?", [1, 0], 'ii');
<div class="col-lg-4 col-md-5 mb-lg-0 mb-3"> while($room_data = mysqli_fetch_assoc($room_res)){
<img src="./images/home3.jpg" class="img-fluid rounded" alt="room"> //get accommodation data from database
</div> $accom_q = mysqli_query($con, "SELECT a.name FROM `accommodation` a INNER JOIN `room_accommodation` raccom ON a.id = raccom.accommodation_id WHERE raccom.room_id = '$room_data[id]'");
<div class="col-lg-6 col-md-5 px-lg-2 px-md-2 px-0"> $accommodation_data = "";
<p class="mb-1" style="font-size: 20px; font-weight: 600;">Standard room</p>
<div class="accommodation"> while($accom_row = mysqli_fetch_assoc($accom_q)){
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p> $accommodation_data .="<span class='badge text-dark mb-1' style='border-radius: 25px; background-color: #F3EEEA;'>$accom_row[name]</span>";
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Air conditioning</span> }
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span> //get additional accommodation data from database
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span> $addi_q = mysqli_query($con, "SELECT a.name FROM `additional_accomm` a INNER JOIN `room_additionalAccom` raddi ON a.id = raddi.additionalAccom_id WHERE raddi.room_id = '$room_data[id]'");
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span> $additionalAccom_data = "";
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span> while($addi_row = mysqli_fetch_assoc($addi_q)){
$additionalAccom_data .="<span class='badge text-dark mb-1 mx-1' style='border-radius: 25px; background-color: #F3EEEA;'>$addi_row[name]</span>";
}
//get cover image
$room_cover = ROOM_IMG_PATH."logo.png";
$cover_q = mysqli_query($con, "SELECT * FROM `room_images` WHERE `room_id`='$room_data[id]' AND `upload`='1'");
if(mysqli_num_rows($cover_q) > 0){
$cover_res = mysqli_fetch_assoc($cover_q);
$room_cover = ROOM_IMG_PATH.$cover_res['image'];
}
//display room (---**accommodation section did not use from database**---)
echo <<< data
<div class="card mb-3 shadow">
<div class="row g-0 p-2 align-items-center">
<div class="col-lg-4 col-md-5 mb-lg-0 mb-3">
<img src="$room_cover" class="img-fluid rounded" alt="room" style="height: 220px; width: 100%; object-fit: cover;">
</div>
<div class="col-lg-7 col-md-6 px-lg-2 px-md-2 px-0">
<p class="mb-1" style="font-size: 20px; font-weight: 600;">$room_data[name]</p>
<div class="accommodation">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Heating and air conditioning</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Mini-fridge</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">...</span>
</div>
<div class="extra-accommodation mt-2 mb-2">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Additional Accommodation</p>
$additionalAccom_data
</div>
</div>
<div class="col-md-1">
<p class="mb-4 text-center mt-lg-0 mt-4" style="font-size: 14px;">$$room_data[price]/night</p>
<a href="#" class="btn-main d-block mb-2" style="font-size: 14px;">Book</a>
</div>
</div>
</div> </div>
<div class="extra-accommodation mt-2 mb-2"> data;
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Additional Accommodation</p> }
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Breakfast</span> ?>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Pools</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Sauna (Steam sauna)</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Massage (Aromatherapy massage)</span>
</div>
</div>
<div class="col-md-2">
<p class="mb-4 text-center mt-lg-0 mt-4">$99 per night</p>
<a href="#" class="btn-main d-block mb-2" style="font-size: 14px;">Book Now</a>
<a href="#" class="btn-minor d-block" style="font-size: 14px;">More Details</a>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View file

@ -104,118 +104,61 @@
<p class="mb-4 text-center" style="font-size: 14px; margin-top: -10px; color: #B0A695;">Comfortably furnished smaller accommodation</p> <p class="mb-4 text-center" style="font-size: 14px; margin-top: -10px; color: #B0A695;">Comfortably furnished smaller accommodation</p>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-3 col-md-6 my-3"> <?php
<div class="card shadow" style="max-width: 400px; margin: auto;"> $room_res = select("SELECT * FROM `rooms` WHERE `status`=? AND `removed`=?", [1, 0], 'ii');
<img src="./images/home3.jpg" class="card-img-top"> while($room_data = mysqli_fetch_assoc($room_res)){
<div class="card-body"> //get accommodation data from database
<h5 class="card-title" style="color: #222831;">Standard rooms</h5> $accom_q = mysqli_query($con, "SELECT a.name FROM `accommodation` a INNER JOIN `room_accommodation` raccom ON a.id = raccom.accommodation_id WHERE raccom.room_id = '$room_data[id]'");
<p class="card-title" style="color: #31363F; font-size: 14px;">From $99 per night</p> $accommodation_data = "";
<div class="accommodation">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Air conditioning</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span>
</div>
<div class="extra-accommodation mt-4 mb-3">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Extra Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Breakfast</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Pools</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Sauna</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Massages</span>
</div>
<div class="d-flex gap-2 items-center justify-content-center mt-4">
<a href="./rooms.php" class="btn-minor d-block" style="font-size: 14px;">More Details</a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 my-3"> while($accom_row = mysqli_fetch_assoc($accom_q)){
<div class="card shadow" style="max-width: 400px; margin: auto;"> $accommodation_data .="<span class='badge text-dark mb-1' style='border-radius: 25px; background-color: #F3EEEA;'>$accom_row[name]</span>";
<img src="./images/home3.jpg" class="card-img-top"> }
<div class="card-body"> //get additional accommodation data from database
<h5 class="card-title" style="color: #222831;">Standard rooms</h5> $addi_q = mysqli_query($con, "SELECT a.name FROM `additional_accomm` a INNER JOIN `room_additionalAccom` raddi ON a.id = raddi.additionalAccom_id WHERE raddi.room_id = '$room_data[id]'");
<p class="card-title" style="color: #31363F; font-size: 14px;">From $99 per night</p> $additionalAccom_data = "";
<div class="accommodation">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p> while($addi_row = mysqli_fetch_assoc($addi_q)){
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Air conditioning</span> $additionalAccom_data .="<span class='badge text-dark mb-1 mx-1' style='border-radius: 25px; background-color: #F3EEEA;'>$addi_row[name]</span>";
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span> }
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span> //get cover image
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span> $room_cover = ROOM_IMG_PATH."logo.png";
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span> $cover_q = mysqli_query($con, "SELECT * FROM `room_images` WHERE `room_id`='$room_data[id]' AND `upload`='1'");
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span>
</div>
<div class="extra-accommodation mt-4 mb-3">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Extra Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Breakfast</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Pools</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wellness & Spa</span>
</div>
<div class="d-flex gap-2 items-center justify-content-center mt-4">
<a href="./rooms.php" class="btn-minor d-block" style="font-size: 14px;">More Details</a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 my-3"> if(mysqli_num_rows($cover_q) > 0){
<div class="card shadow" style="max-width: 400px; margin: auto;"> $cover_res = mysqli_fetch_assoc($cover_q);
<img src="./images/home3.jpg" class="card-img-top"> $room_cover = ROOM_IMG_PATH.$cover_res['image'];
<div class="card-body"> }
<h5 class="card-title" style="color: #222831;">Standard rooms</h5> //display room (---**accommodation section did not use from database**---)
<p class="card-title" style="color: #31363F; font-size: 14px;">From $99 per night</p> echo <<< data
<div class="accommodation"> <div class="col-lg-3 col-md-6 my-3">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p> <div class="card shadow" style="max-width: 400px; margin: auto;">
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Air conditioning</span> <img src="$room_cover" style="height: 250px; object-fit: cover;">
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span> <div class="card-body">
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span> <h5 class="card-title" style="color: #222831;">$room_data[name]</h5>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span> <p class="card-title" style="color: #31363F; font-size: 14px;">$$room_data[price] per night</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span> <div class="accommodation">
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span> <p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Heating and air conditioning</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Mini-fridge</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">...</span>
</div>
<div class="extra-accommodation mt-4 mb-3">$additionalAccom_data</div>
<div class="d-flex gap-2 items-center justify-content-center mt-4">
<a href="./rooms.php" class="btn-minor d-block" style="font-size: 14px;">More Details</a>
</div>
</div>
</div>
</div> </div>
<div class="extra-accommodation mt-4 mb-3"> data;
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Extra Accommodation</p> }
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Breakfast</span> ?>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Pools</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wellness & Spa</span>
</div>
<div class="d-flex gap-2 items-center justify-content-center mt-4">
<a href="./rooms.php" class="btn-minor d-block" style="font-size: 14px;">More Details</a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 my-3">
<div class="card shadow" style="max-width: 400px; margin: auto;">
<img src="./images/home3.jpg" class="card-img-top">
<div class="card-body">
<h5 class="card-title" style="color: #222831;">Standard rooms</h5>
<p class="card-title" style="color: #31363F; font-size: 14px;">From $99 per night</p>
<div class="accommodation">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Air conditioning</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Coffee & tea</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Desk</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Hairdryer</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Television</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wi-Fi</span>
</div>
<div class="extra-accommodation mt-4 mb-3">
<p class="fw-bold" style="color: #31363F; font-size: 14px; margin-bottom: 5px;">Extra Accommodation</p>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Breakfast</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Pools</span>
<span class="badge text-dark mb-1" style="border-radius: 25px; background-color: #F3EEEA;">Wellness & Spa</span>
</div>
<div class="d-flex gap-2 items-center justify-content-center mt-4">
<a href="./rooms.php" class="btn-minor d-block" style="font-size: 14px;">More Details</a>
</div>
</div>
</div>
</div>
<div class="col-lg-12 text-center mt-5 mb-2"> <div class="col-lg-12 text-center mt-5 mb-2">
<a href="./booking.php" class="btn-th">Booking</a> <a href="./booking.php" class="btn-th">Booking</a>

View file

@ -130,236 +130,81 @@
</div> </div>
</div> </div>
<!--Rooms section--> <!--Rooms section-->
<div class="panel" data-color="white"> <?php
<div class="frame"> $data = filteration($_GET);
<div class="frame1"> $room_res = select("SELECT * FROM `rooms` WHERE `status`=? AND `removed`=?", [1, 0], 'ii');
<div class="frame2">I</div> while($room_data = mysqli_fetch_assoc($room_res)){
</div> //get accommodation data from database
<p class="frame-title">Standard room</p> $accom_q = mysqli_query($con, "SELECT a.name FROM `accommodation` a INNER JOIN `room_accommodation` raccom ON a.id = raccom.accommodation_id WHERE raccom.room_id = '$room_data[id]'");
</div> $accommodation_data = "";
<div class="container">
<div class="row"> while($accom_row = mysqli_fetch_assoc($accom_q)){
<div class="col-md-6 d-flex justify-content-center"> $accommodation_data .="<p><i class='bx bx-checkbox-checked'></i>$accom_row[name]</p>";
<div class="swiper mySwiper"> }
<div class="swiper-wrapper"> //get additional accommodation data from database
<div class="swiper-slide"> $addi_q = mysqli_query($con, "SELECT a.name FROM `additional_accomm` a INNER JOIN `room_additionalAccom` raddi ON a.id = raddi.additionalAccom_id WHERE raddi.room_id = '$room_data[id]'");
<img src="./images/home3.jpg" class="about-img"/> $additionalAccom_data = "";
</div>
<div class="swiper-slide"> while($addi_row = mysqli_fetch_assoc($addi_q)){
<img src="./images/home3.jpg" class="about-img"/> $additionalAccom_data .="<p><i class='bx bx-checkbox-checked'></i>$addi_row[name]</p>";
</div> }
<div class="swiper-slide"> //get multiple images
<img src="./images/home3.jpg" class="about-img"/> $room_img = ROOM_IMG_PATH."logo.png";
</div> $img_q = mysqli_query($con, "SELECT * FROM `room_images` WHERE `room_id`='$room_data[id]'");
</div> $room_img_display ="";
<div class="swiper-pagination"></div>
while($img_res = mysqli_fetch_assoc($img_q)){
$room_img_display .="
<div class='swiper-slide $active_class'>
<img src='".ROOM_IMG_PATH.$img_res['image']."' class='about-img'/>
</div> </div>
</div> ";
<div class="col-md-6"> }
<div class="room-detail">
<div class="my-3 mx-2"> //display room
<p class="room-title">Accommodation</p> echo <<< data
<div> <div class="panel" data-color="white" style="margin-bottom: 100px;">
<?php <div class="frame">
$res = selectAll('accommodation'); <div class="frame1">
while($row = mysqli_fetch_assoc($res)){ <div class="frame2"><i class='bx bx-award'></i></div>
echo<<<data
<p><i class='bx bx-checkbox-checked'></i>$row[name]</p>
data;
}
?>
</div>
</div> </div>
<div class="my-3 mx-2"> <p class="frame-title">$room_data[name]</p>
<p class="room-title">Extra Accommodation</p> </div>
<div> <div class="container">
<?php <div class="row">
$res = selectAll('additional_accomm'); <div class="col-md-6 d-flex justify-content-center">
while($row = mysqli_fetch_assoc($res)){ <div class="swiper mySwiper">
echo<<<data <div class="swiper-wrapper">
<p><i class='bx bx-checkbox-checked'></i>$row[name] <span>($row[detail])</span></p> $room_img_display
data; </div>
} <div class="swiper-pagination"></div>
?> </div>
</div>
<div class="col-md-6">
<div class="room-detail">
<div class="my-3 mx-2">
<p class="room-title">Accommodation</p>
<div>$accommodation_data</div>
</div>
<div class="my-3 mx-2">
<p class="room-title">Additional Accommodation</p>
<div>$additionalAccom_data</div>
</div>
<div class="my-3 mx-2">
<p class="room-title">Room Detail</p>
<div style="font-size: 14px;">$room_data[detail]</div>
</div>
<div class="d-flex gap-2 items-center justify-content-center m-4">
<a href="./booking.php" class="btn-main d-block" style="font-size: 14px;">Booking</a>
</div>
</div>
</div> </div>
</div>
<div class="d-flex gap-2 items-center justify-content-center m-4">
<a href="./booking.php" class="btn-main d-block" style="font-size: 14px;">Booking</a>
</div> </div>
</div> </div>
</div> </div>
</div> data;
</div> }
</div> ?>
<div class="panel" data-color="white">
<div class="frame">
<div class="frame1">
<div class="frame2">II</div>
</div>
<p class="frame-title">Deluxe room</p>
</div>
<div class="container">
<div class="row">
<div class="col-md-6 d-flex justify-content-center">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
<div class="col-md-6">
<div class="room-detail">
<div class="my-3 mx-2">
<p class="room-title">Accommodation</p>
<div>
<p><i class='bx bx-checkbox-checked'></i> A king bed size (76" x 80").</p>
<p><i class='bx bx-checkbox-checked'></i> A bathroom with a shower or bathtub, toilet, and sink including toiletries.</p>
<p><i class='bx bx-checkbox-checked'></i> Furniture: A closet, bedside tables, a desk, and chairs.</p>
<p><i class='bx bx-checkbox-checked'></i> Electronic Devices: A television, telephone, mini-fridge, coffee maker, hairdryer.</p>
<p><i class='bx bx-checkbox-checked'></i> Heating and air conditioning</p>
<p><i class='bx bx-checkbox-checked'></i> Wi-Fi and wired internet access</p>
<p><i class='bx bx-checkbox-checked'></i> Housekeeping</p>
</div>
</div>
<div class="my-3 mx-2">
<p class="room-title">Extra Accommodation</p>
<div>
<p><i class='bx bx-checkbox-checked'></i> Breakfast</p>
<p><i class='bx bx-checkbox-checked'></i> Swimming Pools</p>
<p><i class='bx bx-checkbox-checked'></i> Sauna (Steam sauna)</p>
<p><i class='bx bx-checkbox-checked'></i> Massage (Aromatherapy massage)</p>
</div>
</div>
<div class="d-flex gap-2 items-center justify-content-center m-4">
<a href="./booking.php" class="btn-main d-block" style="font-size: 14px;">Booking</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel" data-color="white">
<div class="frame">
<div class="frame1">
<div class="frame2">III</div>
</div>
<p class="frame-title">Double room</p>
</div>
<div class="container">
<div class="row">
<div class="col-md-6 d-flex justify-content-center">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
<div class="col-md-6">
<div class="room-detail">
<div class="my-3 mx-2">
<p class="room-title">Accommodation</p>
<div>
<p><i class='bx bx-checkbox-checked'></i> A king bed size (76" x 80").</p>
<p><i class='bx bx-checkbox-checked'></i> A bathroom with a shower or bathtub, toilet, and sink including toiletries.</p>
<p><i class='bx bx-checkbox-checked'></i> Furniture: A closet, bedside tables, a desk, and chairs.</p>
<p><i class='bx bx-checkbox-checked'></i> Electronic Devices: A television, telephone, mini-fridge, coffee maker, hairdryer.</p>
<p><i class='bx bx-checkbox-checked'></i> Heating and air conditioning</p>
<p><i class='bx bx-checkbox-checked'></i> Wi-Fi and wired internet access</p>
<p><i class='bx bx-checkbox-checked'></i> Housekeeping</p>
</div>
</div>
<div class="my-3 mx-2">
<p class="room-title">Extra Accommodation</p>
<div>
<p><i class='bx bx-checkbox-checked'></i> Breakfast</p>
<p><i class='bx bx-checkbox-checked'></i> Swimming Pools</p>
<p><i class='bx bx-checkbox-checked'></i> Sauna (Steam sauna)</p>
<p><i class='bx bx-checkbox-checked'></i> Massage (Aromatherapy massage)</p>
</div>
</div>
<div class="d-flex gap-2 items-center justify-content-center m-4">
<a href="./booking.php" class="btn-main d-block" style="font-size: 14px;">Booking</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel" data-color="white">
<div class="frame">
<div class="frame1">
<div class="frame2">IV</div>
</div>
<p class="frame-title">Suit room</p>
</div>
<div class="container">
<div class="row">
<div class="col-md-6 d-flex justify-content-center">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
<div class="swiper-slide">
<img src="./images/home3.jpg" class="about-img"/>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
<div class="col-md-6">
<div class="room-detail">
<div class="my-3 mx-2">
<p class="room-title">Accommodation</p>
<div>
<p><i class='bx bx-checkbox-checked'></i> A king bed size (76" x 80").</p>
<p><i class='bx bx-checkbox-checked'></i> A bathroom with a shower or bathtub, toilet, and sink including toiletries.</p>
<p><i class='bx bx-checkbox-checked'></i> Furniture: A closet, bedside tables, a desk, and chairs.</p>
<p><i class='bx bx-checkbox-checked'></i> Electronic Devices: A television, telephone, mini-fridge, coffee maker, hairdryer.</p>
<p><i class='bx bx-checkbox-checked'></i> Heating and air conditioning</p>
<p><i class='bx bx-checkbox-checked'></i> Wi-Fi and wired internet access</p>
<p><i class='bx bx-checkbox-checked'></i> Housekeeping</p>
</div>
</div>
<div class="my-3 mx-2">
<p class="room-title">Extra Accommodation</p>
<div>
<p><i class='bx bx-checkbox-checked'></i> Breakfast</p>
<p><i class='bx bx-checkbox-checked'></i> Swimming Pools</p>
<p><i class='bx bx-checkbox-checked'></i> Sauna (Steam sauna)</p>
<p><i class='bx bx-checkbox-checked'></i> Massage (Aromatherapy massage)</p>
</div>
</div>
<div class="d-flex gap-2 items-center justify-content-center m-4">
<a href="./booking.php" class="btn-main d-block" style="font-size: 14px;">Booking</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!--footer--> <!--footer-->
<?php require('./components/footer.php'); ?> <?php require('./components/footer.php'); ?>