Skip to content

Commit 92c3d7b

Browse files
NipunSGeeTHNipunSGeeTH
committed
refactor: remove unused "ABOUT" menu item and clean up layout structure
1 parent f3051dc commit 92c3d7b

2 files changed

Lines changed: 40 additions & 167 deletions

File tree

‎resources/views/components/layout.blade.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
<x-mary-menu-item title="ACCOMMODATION" link="#Accomodation" class="header-nav-item text-gray-700 text-sm font-normal hover:text-gray-900 transition-colors" />
2323
<x-mary-menu-item title="LOCATION" link="#location" class="header-nav-item text-gray-700 text-sm font-normal hover:text-gray-900 transition-colors" />
2424
<x-mary-menu-item title="EXPERIENCES" link="#Experiences" class="header-nav-item text-gray-700 text-sm font-normal hover:text-gray-900 transition-colors" />
25-
<x-mary-menu-item title="ABOUT" link="#about" class="header-nav-item text-gray-700 text-sm font-normal hover:text-gray-900 transition-colors" />
25+
2626
</div>
2727

2828
<!-- Right Side: Check Availability Button -->

‎resources/views/homepage.blade.php‎

Lines changed: 39 additions & 166 deletions
Original file line numberDiff line numberDiff line change
@@ -10,95 +10,9 @@
1010
<div class="absolute inset-0 bg-black/40"></div>
1111

1212
<!-- Content wrapper -->
13-
<div class="relative z-10 flex flex-col min-h-screen pl-16 pr-8">
13+
<div class="relative z-10 flex flex-col min-h-screen ">
1414

15-
<!-- Booking Form (bottom) -->
16-
<div class="flex justify-center w-full mt-auto ">
17-
<div class="bg-orange-50 py-6 px-8 rounded-t-2xl inline-block">
18-
<div class="flex flex-wrap items-center gap-6">
1915

20-
<!-- Check In -->
21-
<div class="flex items-center gap-3 p-4 rounded-lg min-w-[200px]">
22-
<div class="w-6 h-6">
23-
<img src="./icons/calander.png" alt="Calendar Icon" class="w-6 h-6" />
24-
</div>
25-
<div class="flex-1">
26-
<x-mary-input label="Check In" type="date" name="check_in" id="check_in"
27-
class="w-full text-black text-base bg-transparent border-none outline-none cursor-pointer"
28-
value="2025-09-14" />
29-
</div>
30-
</div>
31-
32-
<!-- Check Out -->
33-
<div class="flex items-center gap-3 p-4 rounded-lg min-w-[200px]">
34-
<div class="w-6 h-6">
35-
<img src="./icons/calander.png" alt="Calendar Icon" class="w-6 h-6" />
36-
</div>
37-
<div class="flex-1">
38-
<x-mary-input label="Check Out" type="date" name="check_out" id="check_out"
39-
class="w-full text-black text-base bg-transparent border-none outline-none cursor-pointer"
40-
value="2025-09-17" />
41-
</div>
42-
</div>
43-
44-
<!-- No of adults -->
45-
<div class="flex items-center gap-3 p-4 rounded-lg min-w-[200px]" x-data="{ adults: 3 }">
46-
<div class="w-6 h-6 bg-teal-500 rounded"></div>
47-
<div class="flex-1">
48-
<div class="flex items-center gap-2">
49-
<x-mary-input label="No of Adults" type="number" name="adults" id="adults"
50-
min="1" max="20"
51-
class="w-16 text-center text-black text-base bg-transparent border-none outline-none"
52-
x-model="adults" readonly>
53-
<x-slot:prepend>
54-
<x-mary-button icon="o-minus"
55-
class="p-1 w-8 h-8 bg-gray-200 hover:bg-gray-300 text-gray-700"
56-
x-on:click="adults = Math.max(1, adults - 1)" />
57-
</x-slot:prepend>
58-
<x-slot:append>
59-
<x-mary-button icon="o-plus"
60-
class="p-1 w-8 h-8 bg-gray-200 hover:bg-gray-300 text-gray-700"
61-
x-on:click="adults = Math.min(20, adults + 1)" />
62-
</x-slot:append>
63-
</x-mary-input>
64-
65-
</div>
66-
</div>
67-
</div>
68-
69-
<!-- No of children -->
70-
<div class="flex items-center gap-3 p-4 rounded-lg min-w-[200px]" x-data="{ children: 1 }">
71-
<div class="w-6 h-6 bg-teal-500 rounded"></div>
72-
<div class="flex-1">
73-
<div class="flex items-center gap-2">
74-
<x-mary-input label="No of Children" type="number" name="children" id="children"
75-
min="0" max="20"
76-
class="w-16 text-center text-black text-base bg-transparent border-none outline-none"
77-
x-model="children" readonly>
78-
<x-slot:prepend>
79-
<x-mary-button icon="o-minus"
80-
class="p-1 w-8 h-8 bg-gray-200 hover:bg-gray-300 text-gray-700"
81-
x-on:click="children = Math.max(0, children - 1)" />
82-
</x-slot:prepend>
83-
<x-slot:append>
84-
<x-mary-button icon="o-plus"
85-
class="p-1 w-8 h-8 bg-gray-200 hover:bg-gray-300 text-gray-700"
86-
x-on:click="children = Math.min(20, children + 1)" />
87-
</x-slot:append>
88-
</x-mary-input>
89-
</div>
90-
</div>
91-
</div>
92-
93-
<!-- Check Now Button -->
94-
<button
95-
class="bg-[#72B6B9] hover:bg-[#5A8E91] text-white px-8 py-4 rounded-lg font-bold transition-colors">
96-
CHECK NOW
97-
</button>
98-
99-
</div>
100-
</div>
101-
</div>
10216

10317
</div>
10418
</section>
@@ -138,96 +52,55 @@ class="bg-[#72B6B9] hover:bg-[#5A8E91] text-white px-8 py-4 rounded-lg font-bold
13852
</div>
13953
</section> --}}
14054

141-
<section class="py-16 min-h-screen bg-[#FAF6F0] bg-cover bg-center bg-fixed flex flex-col justify-end" style="background-image: url('/images/home.png');">
142-
<div class="max-w-screen-xl mx-auto px-4 text-center pb-6">
143-
<!-- Section Title -->
144-
{{-- <h2 class="text-sm font-medium text-gray-400 tracking-widest mb-6">
145-
EXPLORE LOCATION
146-
</h2>
147-
<div class="w-30 h-0.5 bg-[#0e0903] mx-auto mb-12"></div> --}}
148-
149-
<!-- Locations Grid -->
150-
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
151-
152-
<!-- Coconut Tree Hill -->
153-
<div class="relative group overflow-hidden rounded-lg cursor-pointer">
154-
<img src="/images/location/Rectangle9.png" alt="Coconut Tree Hill"
155-
class="w-full h-80 object-cover transition-transform duration-500 group-hover:scale-105">
156-
<div
157-
class="absolute inset-0 bg-black/30 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-500">
158-
<span class="text-white text-lg font-semibold flex items-center gap-2">
159-
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
160-
<path
161-
d="M12 2C10.343 2 9 3.343 9 5c0 1.656 1.343 3 3 3s3-1.344 3-3c0-1.657-1.343-3-3-3zM5 9v2h14V9H5zm-2 4v2h18v-2H3zm0 4v2h18v-2H3z" />
162-
</svg>
163-
Coconut Tree Hill
164-
</span>
165-
</div>
166-
</div>
167-
168-
<!-- Mirissa Beach -->
169-
<div class="relative group overflow-hidden rounded-lg cursor-pointer">
170-
<img src="/images/location/Rectangle10.png" alt="Mirissa Beach"
171-
class="w-full h-80 object-cover transition-transform duration-500 group-hover:scale-105">
172-
<div
173-
class="absolute inset-0 bg-black/50 flex flex-col justify-center items-center opacity-0 group-hover:opacity-100 transition-opacity duration-500 p-4 text-center">
174-
<h3 class="text-white text-xl font-semibold mb-2">Mirissa Beach</h3>
175-
<p class="text-white text-sm">A hidden cove away from the crowds, perfect for swimming,
176-
sunbathing, and catching the most peaceful sunsets.</p>
177-
</div>
178-
</div>
55+
<section class="py-16 min-h-screen bg-[#FAF6F0] bg-cover bg-center bg-fixed flex flex-col justify-end"
56+
style="background-image: url('/images/home.png');">
17957

180-
<!-- Parrot Rock -->
181-
<div class="relative group overflow-hidden rounded-lg cursor-pointer">
182-
<img src="/images/location/Rectangle11.png" alt="Parrot Rock"
183-
class="w-full h-80 object-cover transition-transform duration-500 group-hover:scale-105">
184-
<div
185-
class="absolute inset-0 bg-black/30 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-500">
186-
<span class="text-white text-lg font-semibold flex items-center gap-2">
187-
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
188-
<path
189-
d="M12 2C10.343 2 9 3.343 9 5c0 1.656 1.343 3 3 3s3-1.344 3-3c0-1.657-1.343-3-3-3zM5 9v2h14V9H5zm-2 4v2h18v-2H3zm0 4v2h18v-2H3z" />
190-
</svg>
191-
Parrot Rock
192-
</span>
193-
</div>
194-
</div>
195-
196-
</div>
58+
<div class="max-w-screen-2xl justify-center text-center pb-6">
59+
<!-- Locations Grid -->
60+
19761
</div>
198-
</section>
62+
</div>
63+
</section>
19964

200-
<section class="bg-[#FAF6F0] py-16">
201-
<div class="max-w-screen-xl mx-auto px-4">
202-
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-12 text-center">
65+
<section class="bg-[#FAF6F0] py-16">
66+
<div class="max-w-screen-2xl mx-auto px-0">
67+
<div class="flex flex-col md:flex-row text-center items-center justify-between">
20368

20469
<!-- Item 1 -->
205-
<div class="flex flex-col items-center">
70+
71+
<div class="flex flex-col items-center w-fit">
20672
<img src="images/icons/image16.png" alt="Airport Icon" class="h-12 w-12 mb-2 object-contain">
20773
<div class="w-8 h-0.5 bg-gray-800 mb-2"></div>
20874
<p class="text-sm text-gray-700">2.5 hours from <br> the airport</p>
20975
</div>
210-
76+
21177
<!-- Item 2 -->
212-
<div class="flex flex-col items-center">
78+
<div class="flex flex-col items-center w-fit">
21379
<img src="images/icons/image17.png" alt="highwayIcon" class="h-12 w-12 mb-2 object-contain">
21480
<div class="w-8 h-0.5 bg-gray-800 mb-2"></div>
81+
21582
<p class="text-sm text-gray-700">Minutes away from the <br> Southern Expressway</p>
21683
</div>
21784

21885
<!-- Item 3 -->
219-
<div class="flex flex-col items-center">
86+
<div class="flex flex-col items-center w-fit">
22087
<img src="images/icons/image18.png" alt="mobile Icon" class="h-12 w-12 mb-2 object-contain">
22188
<div class="w-8 h-0.5 bg-gray-800 mb-2"></div>
22289
<p class="text-sm text-gray-700">24/7 available <br> Tuk-tuks and taxis</p>
22390
</div>
22491

225-
<!-- Item 4 -->
226-
<div class="flex flex-col items-center">
227-
<img src="images/icons/image19.png" alt="walk Icon" class="h-12 w-12 mb-2 object-contain">
228-
<div class="w-8 h-0.5 bg-gray-800 mb-2"></div>
229-
<p class="text-sm text-gray-700">Walk to most <br> Mirissa highlights</p>
230-
</div>
92+
<!-- Item 4 -->
93+
94+
<div class="flex flex-col items-center w-fit"> <!-- keeps icon, divider, text centered -->
95+
<img src="images/icons/image19.png" alt="walk Icon" class="h-12 w-12 mb-2 object-contain">
96+
<div class="w-8 h-0.5 bg-gray-800 mb-2"></div>
97+
<p class="text-sm text-gray-700 text-center">
98+
Walk to most <br> Mirissa highlights
99+
</p>
100+
</div>
101+
102+
103+
231104

232105
</div>
233106
</div>
@@ -245,9 +118,9 @@ class="absolute inset-0 bg-black/30 flex items-center justify-center opacity-0 g
245118

246119

247120
<!-- room section -->
248-
<section id="rooms" class="pb-10 bg-[#FAF6F0]">
249-
<div class="flex justify-center w-full">
250-
<div class="inline-block px-8 max-w-7xl w-full">
121+
<section id="rooms" class="pb-20 bg-[#FAF6F0]">
122+
<div class="flex justify-center w-full ">
123+
<div class="inline-block px-8 max-w-screen-2xl w-full">
251124
<div class="flex flex-col lg:flex-row items-stretch">
252125

253126
<!-- Left Image -->
@@ -297,7 +170,7 @@ class="text-sm lg:text-base font-normal font-['NATS'] text-black tracking-[0.2em
297170

298171

299172
<!-- Rooms Section -->
300-
<section x-data="{ tab: 'single' }" class=" ">
173+
<section x-data="{ tab: 'single' }" class=" max-width-2xl">
301174
<div class="flex justify-center gap-80 border-b border-stone-300 mb-12 bg-[#F5DFC6] py-10">
302175
<button @click="tab = 'single'"
303176
:class="tab === 'single' ? 'text-stone-900 font-bold border-b-2 border-stone-900 pb-2' : 'text-stone-500 pb-2'"
@@ -324,7 +197,7 @@ class="uppercase tracking-wide transition">
324197
</button>
325198
</div>
326199
</div>
327-
<div class="max-w-screen-xl mx-auto px-8">
200+
<div class="max-w-screen-2xl mx-auto px-8">
328201

329202
<!-- Tabs -->
330203

@@ -422,7 +295,7 @@ class="w-full h-[400px] object-cover rounded-3xl shadow-lg">
422295
</ul>
423296
<p class="mt-4 text-stone-600 leading-relaxed">
424297
Spacious and welcoming, our Family Rooms are designed to keep everyone comfortable, with
425-
quick access to Mirissa’s top attractions.
298+
quick access to Mirissa's top attractions.
426299
</p>
427300
<div class="mt-6">
428301
<a href="#" class="uppercase text-stone-700">Book Now</a>
@@ -436,7 +309,7 @@ class="w-full h-[400px] object-cover rounded-3xl shadow-lg">
436309
</section>
437310

438311
<section class="bg-[#FAF6F0] py-16">
439-
<div class="max-w-screen-xl mx-auto px-4 text-center">
312+
<div class="max-w-screen-2xl mx-auto px-4 text-center">
440313
<h2 class="text-3xl md:text-4xl font-display text-gray-800 mb-10">
441314
Gallery
442315
</h2>
@@ -531,7 +404,7 @@ class="w-full h-auto object-cover" />
531404

532405

533406
<section class="bg-[#FAF6F0] py-26" id= "Experiences">
534-
<div class="max-w-screen-xl mx-auto px-4 text-center">
407+
<div class="max-w-screen-2xl mx-auto px-4 text-center">
535408
<h2 class="text-3xl md:text-4xl font-display text-gray-800 mb-10">
536409
Experiences
537410
</h2>
@@ -546,8 +419,8 @@ class="w-full h-auto object-cover" />
546419

547420

548421

549-
<div class="w-full bg-orange-50 px-56 py-20">
550-
<div class="max-w-7xl mx-auto">
422+
<div class=" bg-orange-50 px-36 py-20">
423+
<div class="max-w-screen-2xl mx-auto">
551424
<div class="grid grid-cols-3 gap-6">
552425
@foreach (config('experiences') as $slug => $experience)
553426
<a href="{{ route('experience', $slug) }}"

0 commit comments

Comments
 (0)