refactor: update product images and titles in index.html, remove obsolete image files, and add new product cards for enhanced catalog presentation
|
Before Width: | Height: | Size: 8.7 KiB |
|
Before Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 40 KiB |
|
Before Width: | Height: | Size: 33 KiB |
|
Before Width: | Height: | Size: 12 KiB |
BIN
assets/images/products/covers/conference_chairs.jpg
Normal file
|
After Width: | Height: | Size: 376 KiB |
BIN
assets/images/products/covers/executive_desks.jpg
Normal file
|
After Width: | Height: | Size: 1.5 MiB |
BIN
assets/images/products/covers/screens.jpg
Normal file
|
After Width: | Height: | Size: 361 KiB |
BIN
assets/images/products/covers/soft_seating.jpg
Normal file
|
After Width: | Height: | Size: 217 KiB |
BIN
assets/images/products/covers/training_tables.jpg
Normal file
|
After Width: | Height: | Size: 584 KiB |
BIN
assets/images/products/covers/visitors_chair.jpg
Normal file
|
After Width: | Height: | Size: 322 KiB |
260
index.html
|
|
@ -625,8 +625,8 @@
|
|||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/lounge_chair.jpg"
|
||||
alt="Lounge Chairs"
|
||||
src="assets/images/products/covers/training_tables.jpg"
|
||||
alt="Training Tables"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -636,7 +636,7 @@
|
|||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Lounge Chairs
|
||||
Training Tables
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -649,8 +649,8 @@
|
|||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/office_chair.jpg"
|
||||
alt="Office Chairs"
|
||||
src="assets/images/products/covers/screens.jpg"
|
||||
alt="Screens"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -660,7 +660,7 @@
|
|||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Office Chairs
|
||||
Screens
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -673,8 +673,8 @@
|
|||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/conference_rooms.jpg"
|
||||
alt="Conference Room"
|
||||
src="assets/images/products/covers/executive_desks.jpg"
|
||||
alt="Executive Desks"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -684,7 +684,7 @@
|
|||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Conference Room
|
||||
Executive Desks
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -697,7 +697,175 @@
|
|||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/storage.jpg"
|
||||
src="assets/images/products/covers/conference_chairs.jpg"
|
||||
alt="Conference Chairs"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Conference Chairs
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 5: Kitchen -->
|
||||
<a href="product-catalog.html?category=workspace" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/visitors_chair.jpg"
|
||||
alt="Visitors Chair"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Visitors Chair
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 6: Chairs -->
|
||||
<a href="product-catalog.html?category=seating" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/soft_seating.jpg"
|
||||
alt="Soft seating"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Soft seating
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 7: Pods -->
|
||||
<a href="product-catalog.html?category=seating" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/barstools.jpg"
|
||||
alt="Barstools"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Barstools
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 8: Potty -->
|
||||
<a href="product-catalog.html?category=workspace" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/work_station.jpg"
|
||||
alt="Work Station"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Work Station
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 9: Executive Task Chair -->
|
||||
<a href="product-catalog.html?category=seating" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/executive_task_chair.jpg"
|
||||
alt="Executive Task Chair"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Executive Task Chair
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 10: Storage -->
|
||||
<a href="product-catalog.html?category=tables" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/canteen_chairs.jpg"
|
||||
alt="Canteen Chairs"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Canteen Chairs
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 11: Storage -->
|
||||
<a href="product-catalog.html?category=seating" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/storage.jpg"
|
||||
alt="Storage"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
|
|
@ -714,15 +882,15 @@
|
|||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 5: Kitchen -->
|
||||
<!-- Product Card 12: Executive Desks -->
|
||||
<a href="product-catalog.html?category=workspace" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/kitchen.jpg"
|
||||
alt="Kitchen"
|
||||
src="assets/images/products/covers/training_chairs.jpg"
|
||||
alt="Training Chairs"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -732,21 +900,21 @@
|
|||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Kitchen
|
||||
Training Chairs
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 6: Chairs -->
|
||||
<!-- Product Card 13: Task Chairs -->
|
||||
<a href="product-catalog.html?category=seating" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/chairs.jpg"
|
||||
alt="Chairs"
|
||||
src="assets/images/products/covers/task_chairs.jpg"
|
||||
alt="Task Chairs"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -756,45 +924,21 @@
|
|||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Chairs
|
||||
Task Chairs
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 7: Pods -->
|
||||
<a href="product-catalog.html?category=seating" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/pods.jpg"
|
||||
alt="Pods"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Pods
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 8: Potty -->
|
||||
<!-- Product Card 14: Work Station -->
|
||||
<a href="product-catalog.html?category=workspace" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/potty.jpg"
|
||||
alt="Potty"
|
||||
src="assets/images/products/covers/meeting_tables.jpg"
|
||||
alt="Meeting Tables"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -804,7 +948,31 @@
|
|||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Potty
|
||||
Meeting Tables
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Product Card 15: Occasional Tables -->
|
||||
<a href="product-catalog.html?category=tables" class="block">
|
||||
<div
|
||||
class="product-card bg-light-bg rounded-lg overflow-hidden h-[29vh]"
|
||||
>
|
||||
<div class="product-card-image h-[22vh] bg-gray-200">
|
||||
<img
|
||||
src="assets/images/products/covers/occasional_tables.jpg"
|
||||
alt="Occasional Tables"
|
||||
class="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="p-4 h-[6vh] flex flex-col justify-center items-center"
|
||||
>
|
||||
<h3
|
||||
class="product-card-title font-poppins font-semibold text-xl text-gray-800 text-center"
|
||||
>
|
||||
Occasional Tables
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||