Update website templates and improve rental product display
This commit is contained in:
Alaguraj0361
parent
6b61000f4f
commit
d4a8113c79
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -14,107 +14,83 @@
|
||||
<xpath expr="//div[@id='wrap']" position="replace">
|
||||
<div id="wrap" class="oe_structure oe_empty tailwind-wrapper bg-cream" style="background-color: #fcf6e9;">
|
||||
<main class="flex-1">
|
||||
<section class="mx-auto max-w-6xl px-6 py-20 md:py-28">
|
||||
<p class="mb-4 text-xs uppercase tracking-[0.4em] text-gold">Services</p>
|
||||
<h1 class="font-serif text-5xl text-navy md:text-6xl">Vastu Consultation Packages</h1>
|
||||
<p class="mt-6 max-w-2xl text-muted-foreground">Each session is personalised. If you're unsure which package suits you, start by booking and we'll find the right fit together.</p>
|
||||
<div class="mt-16 grid gap-6 md:grid-cols-2">
|
||||
<div class="group flex flex-col rounded-xl border border-border/60 bg-card p-8 transition-shadow hover:shadow-lg">
|
||||
<p class="text-xs uppercase tracking-[0.25em] text-gold">For the spaces you live in</p>
|
||||
<h2 class="mt-3 font-serif text-2xl text-navy">Home Vastu Consultation</h2>
|
||||
<p class="mt-3 text-sm leading-relaxed text-muted-foreground">A complete energetic review of your home - entrance, bedrooms, kitchen, and living areas - with a written report of practical, room-by-room recommendations.</p>
|
||||
<div class="mt-6 flex flex-wrap gap-x-5 gap-y-2 text-xs text-muted-foreground">
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clock h-3.5 w-3.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg> 90 minutes + report</span>
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin h-3.5 w-3.5" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"></path><circle cx="12" cy="10" r="3"></circle></svg> Online or in person</span>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.45), transparent);"></div>
|
||||
<div class="mt-6 flex items-end justify-between">
|
||||
<span class="font-serif text-2xl text-navy">$ on request</span>
|
||||
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book</a>
|
||||
<section class="mx-auto max-w-6xl px-6 py-12">
|
||||
<p class="mb-4 text-xs uppercase tracking-[0.4em] text-gold">Rental Collection</p>
|
||||
<h1 class="font-serif text-5xl text-navy md:text-6xl mb-6">Our Event Rental Products</h1>
|
||||
<p class="mt-2 max-w-2xl text-muted-foreground mb-12">Browse our premium collection of event rental items to elevate your special occasion.</p>
|
||||
|
||||
<div class="row">
|
||||
<!-- Category Sidebar -->
|
||||
<div class="col-md-3 mb-4">
|
||||
<div class="bg-card rounded-xl border border-border/60 p-4 shadow-sm">
|
||||
<h5 class="font-serif text-xl text-navy mb-4" style="border-bottom: 2px solid #d4a14a; padding-bottom: 8px;">Categories</h5>
|
||||
<div class="list-group list-group-flush" style="background: transparent;">
|
||||
<a t-att-href="'/rentals' + (search and ('?search=' + search) or '')"
|
||||
t-att-class="'list-group-item list-group-item-action border-0 px-2 py-2 rounded font-medium ' + (not current_category and 'bg-navy text-cream' or 'text-navy hover:bg-navy/5 bg-transparent')"
|
||||
style="transition: all 0.2s; text-decoration: none;">
|
||||
All Products
|
||||
</a>
|
||||
<t t-foreach="categories" t-as="cat">
|
||||
<a t-att-href="'/rentals?category=' + str(cat.id) + (search and ('&search=' + search) or '')"
|
||||
t-att-class="'list-group-item list-group-item-action border-0 px-2 py-2 rounded font-medium mt-1 ' + (current_category == cat.id and 'bg-navy text-cream' or 'text-navy hover:bg-navy/5 bg-transparent')"
|
||||
style="transition: all 0.2s; text-decoration: none;">
|
||||
<span t-field="cat.name"/>
|
||||
</a>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group flex flex-col rounded-xl border border-border/60 bg-card p-8 transition-shadow hover:shadow-lg">
|
||||
<p class="text-xs uppercase tracking-[0.25em] text-gold">For offices, studios & retail</p>
|
||||
<h2 class="mt-3 font-serif text-2xl text-navy">Business Vastu Consultation</h2>
|
||||
<p class="mt-3 text-sm leading-relaxed text-muted-foreground">Align your workspace for growth, focus, and prosperity. Includes entrance, seating, cash counter, and reception placement guidance.</p>
|
||||
<div class="mt-6 flex flex-wrap gap-x-5 gap-y-2 text-xs text-muted-foreground">
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clock h-3.5 w-3.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg> 90 minutes + report</span>
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin h-3.5 w-3.5" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"></path><circle cx="12" cy="10" r="3"></circle></svg> Online or in person</span>
|
||||
|
||||
<!-- Products Section -->
|
||||
<div class="col-md-9">
|
||||
<!-- Search and Filter Area -->
|
||||
<div class="mb-6">
|
||||
<form action="/rentals" method="get" class="flex gap-2">
|
||||
<input type="hidden" name="category" t-att-value="current_category" t-if="current_category"/>
|
||||
<input type="text" name="search" class="form-control flex-1 px-4 py-2 border border-border rounded-lg bg-white focus:outline-none focus:ring-2 focus:ring-gold" placeholder="Search rental products..." t-att-value="search"/>
|
||||
<button type="submit" class="btn bg-navy text-cream hover:bg-navy/90 px-6 py-2 rounded-lg font-medium shadow-sm transition-colors" style="color: #fcf6e9; border: none;">Search</button>
|
||||
</form>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.45), transparent);"></div>
|
||||
<div class="mt-6 flex items-end justify-between">
|
||||
<span class="font-serif text-2xl text-navy">$ on request</span>
|
||||
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book</a>
|
||||
|
||||
<!-- Empty state -->
|
||||
<div class="text-center py-16 bg-card rounded-xl border border-border/60 shadow-sm" t-if="not products">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="#d4a14a" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="mx-auto mb-4"><circle cx="12" cy="12" r="10"/><path d="m15 9-6 6"/><path d="m9 9 6 6"/></svg>
|
||||
<h3 class="font-serif text-2xl text-navy mb-2">No Products Found</h3>
|
||||
<p class="text-muted-foreground text-sm">We couldn't find any rental products matching your filters.</p>
|
||||
<a href="/rentals" class="mt-4 inline-block text-gold underline text-sm font-semibold">Clear Filters</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group flex flex-col rounded-xl border border-border/60 bg-card p-8 transition-shadow hover:shadow-lg">
|
||||
<p class="text-xs uppercase tracking-[0.25em] text-gold">For clinics, studios & retreats</p>
|
||||
<h2 class="mt-3 font-serif text-2xl text-navy">Wellness Centre Vastu Review</h2>
|
||||
<p class="mt-3 text-sm leading-relaxed text-muted-foreground">Create environments that support healing - for clients and practitioners alike. Treatment room placement, flow, and energetic clarity.</p>
|
||||
<div class="mt-6 flex flex-wrap gap-x-5 gap-y-2 text-xs text-muted-foreground">
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clock h-3.5 w-3.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg> 2 hours + report</span>
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin h-3.5 w-3.5" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"></path><circle cx="12" cy="10" r="3"></circle></svg> Online or in person</span>
|
||||
|
||||
<!-- Product Grid -->
|
||||
<div class="row" t-if="products">
|
||||
<t t-foreach="products" t-as="product">
|
||||
<div class="col-md-4 col-sm-6 mb-4">
|
||||
<div class="group flex flex-col h-100 rounded-xl border border-border/60 bg-card transition-shadow hover:shadow-lg overflow-hidden">
|
||||
<!-- Product Image -->
|
||||
<div class="relative overflow-hidden bg-slate-100" style="height: 200px;">
|
||||
<img t-if="product.image_1920" t-att-src="image_data_uri(product.image_1920)" class="w-100 h-100 object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy"/>
|
||||
<div t-else="" class="d-flex align-items-center justify-content-center h-100 text-muted bg-slate-50">
|
||||
<i class="fa fa-picture-o fa-3x text-slate-300"></i>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Product Details -->
|
||||
<div class="p-4 d-flex flex-column flex-grow-1">
|
||||
<h3 class="font-serif text-lg text-navy font-bold mb-2 group-hover:text-gold transition-colors" t-field="product.name"/>
|
||||
<p class="text-sm text-muted-foreground leading-relaxed flex-grow-1 mb-4" t-field="product.description_sale" style="display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;"/>
|
||||
|
||||
<div class="mt-auto pt-3 border-t border-border/40 d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<span class="font-serif text-lg text-navy font-bold" t-field="product.rental_price_per_day" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
|
||||
<span class="text-xs text-muted-foreground block">/ day</span>
|
||||
</div>
|
||||
<a t-att-href="'/rentals/%s' % slug(product)" class="inline-flex items-center justify-center font-medium cursor-pointer transition-colors px-3 py-1.5 text-xs bg-navy text-cream hover:bg-navy/90 rounded-md shadow-sm" style="color: #fcf6e9; text-decoration: none;">
|
||||
View Details
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.45), transparent);"></div>
|
||||
<div class="mt-6 flex items-end justify-between">
|
||||
<span class="font-serif text-2xl text-navy">$ on request</span>
|
||||
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group flex flex-col rounded-xl border border-border/60 bg-card p-8 transition-shadow hover:shadow-lg">
|
||||
<p class="text-xs uppercase tracking-[0.25em] text-gold">For your sacred corner</p>
|
||||
<h2 class="mt-3 font-serif text-2xl text-navy">Altar Placement Guidance</h2>
|
||||
<p class="mt-3 text-sm leading-relaxed text-muted-foreground">A focused session on placing and arranging your altar or prayer space so it feels grounded, intentional, and alive.</p>
|
||||
<div class="mt-6 flex flex-wrap gap-x-5 gap-y-2 text-xs text-muted-foreground">
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clock h-3.5 w-3.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg> 45 minutes</span>
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin h-3.5 w-3.5" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"></path><circle cx="12" cy="10" r="3"></circle></svg> Online</span>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.45), transparent);"></div>
|
||||
<div class="mt-6 flex items-end justify-between">
|
||||
<span class="font-serif text-2xl text-navy">$ on request</span>
|
||||
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group flex flex-col rounded-xl border border-border/60 bg-card p-8 transition-shadow hover:shadow-lg">
|
||||
<p class="text-xs uppercase tracking-[0.25em] text-gold">Before you build or move</p>
|
||||
<h2 class="mt-3 font-serif text-2xl text-navy">Floor Plan Review</h2>
|
||||
<p class="mt-3 text-sm leading-relaxed text-muted-foreground">Send across a floor plan and receive a written Vastu review with suggested adjustments before construction or move-in.</p>
|
||||
<div class="mt-6 flex flex-wrap gap-x-5 gap-y-2 text-xs text-muted-foreground">
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clock h-3.5 w-3.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg> Written report</span>
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin h-3.5 w-3.5" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"></path><circle cx="12" cy="10" r="3"></circle></svg> Remote review</span>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.45), transparent);"></div>
|
||||
<div class="mt-6 flex items-end justify-between">
|
||||
<span class="font-serif text-2xl text-navy">$ on request</span>
|
||||
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group flex flex-col rounded-xl border border-border/60 bg-card p-8 transition-shadow hover:shadow-lg">
|
||||
<p class="text-xs uppercase tracking-[0.25em] text-gold">Continuing the work</p>
|
||||
<h2 class="mt-3 font-serif text-2xl text-navy">Follow-up Consultation</h2>
|
||||
<p class="mt-3 text-sm leading-relaxed text-muted-foreground">For existing clients - to check in on remedies applied, review new spaces, or revisit any concerns over time.</p>
|
||||
<div class="mt-6 flex flex-wrap gap-x-5 gap-y-2 text-xs text-muted-foreground">
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clock h-3.5 w-3.5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg> 45 minutes</span>
|
||||
<span class="inline-flex items-center gap-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-map-pin h-3.5 w-3.5" aria-hidden="true"><path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"></path><circle cx="12" cy="10" r="3"></circle></svg> Online or in person</span>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.45), transparent);"></div>
|
||||
<div class="mt-6 flex items-end justify-between">
|
||||
<span class="font-serif text-2xl text-navy">$ on request</span>
|
||||
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="bg-card/40" style="border-top: 1px solid #e0d6c6;">
|
||||
<div class="mx-auto max-w-6xl px-6 py-20 md:py-28">
|
||||
<div class="mb-12 max-w-2xl">
|
||||
<p class="mb-3 text-xs uppercase tracking-[0.3em] text-gold">A quick orientation</p>
|
||||
<h2 class="font-serif text-4xl text-navy md:text-5xl">How Vastu maps to the rooms you live in</h2>
|
||||
<p class="mt-5 text-muted-foreground">A glimpse of the directional principles that shape every consultation - from the kitchen's energy of nourishment to the bedroom's call for rest.</p>
|
||||
</div>
|
||||
<div class="relative">
|
||||
<div class="absolute -inset-6 -z-10 rounded-3xl bg-gradient-to-br from-gold-soft/30 to-sage/15 blur-2xl"></div>
|
||||
<img alt="Vastu-inspired room guide" class="w-full rounded-2xl shadow-2xl ring-1 ring-navy/10" loading="lazy" src="/theme_aakriti_events/static/src/img/vastu-rooms.png"/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@ -123,6 +99,7 @@
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
||||
<!-- Inherit and Override Product Detail Page -->
|
||||
<template id="rental_product_detail_template_inherit" inherit_id="event_rental.rental_product_detail_template">
|
||||
<xpath expr="//div[@id='wrap']" position="replace">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user