538 lines
38 KiB
XML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?xml version="1.0" encoding="utf-8"?>
<odoo>
<!-- Custom Homepage Content -->
<record id="clicks2cart_homepage_v17" model="ir.ui.view">
<field name="name">Clicks2Cart Homepage</field>
<field name="type">qweb</field>
<field name="inherit_id" ref="website.homepage"/>
<field name="key">website.homepage</field>
<field name="priority" eval="1000"/>
<field name="website_id" eval="6"/>
<field name="arch" type="xml">
<xpath expr="//div[@id='wrap']" position="replace">
<div id="wrap" class="oe_structure">
<!-- Premium Hero Section -->
<!-- Premium Hero Section (Working Slider) -->
<section class="s_hero_premium py-0">
<div id="clicks2cartHeroCarousel" class="carousel slide h-100" data-bs-ride="carousel">
<!-- Indicators -->
<div class="carousel-indicators">
<button type="button" data-bs-target="#clicks2cartHeroCarousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#clicks2cartHeroCarousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#clicks2cartHeroCarousel" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner h-100">
<!-- Slide 1 -->
<div class="carousel-item active h-100 slide-1">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-12">
<p class="hero-pre-title text-uppercase">EXPLORE THE</p>
<h1 class="display-1 fw-bold mb-4">New Arrivals</h1>
<p class="hero-desc">Experience our hand-picked floral collections designed to bring elegance and freshness to your special moments.</p>
<img src="https://upload.wikimedia.org/wikipedia/commons/e/e6/Separator_flourish.svg" class="hero-separator opacity-75" alt="Separator"/>
<div class="mt-4">
<a href="/shop" class="btn btn-shop-now font-weight-bold">Shop now</a>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 2 -->
<div class="carousel-item h-100 slide-2">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-12">
<p class="hero-pre-title text-uppercase">SPECIAL MOMENTS</p>
<h1 class="display-1 fw-bold mb-4">Wedding Bloom</h1>
<p class="hero-desc">Discover the perfect wedding floral arrangements that capture the essence of your love story with timeless beauty.</p>
<img src="https://upload.wikimedia.org/wikipedia/commons/e/e6/Separator_flourish.svg" class="hero-separator opacity-75" alt="Separator"/>
<div class="mt-4">
<a href="/shop" class="btn btn-shop-now font-weight-bold">Explore More</a>
</div>
</div>
</div>
</div>
</div>
<!-- Slide 3 -->
<div class="carousel-item h-100 slide-3">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-12">
<p class="hero-pre-title text-uppercase">FRESH EVERY DAY</p>
<h1 class="display-1 fw-bold mb-4">Luxury Gifting</h1>
<p class="hero-desc">Elevate your gifting game with our premium floral boxes, delivered fresh to your doorstep every single day.</p>
<img src="https://upload.wikimedia.org/wikipedia/commons/e/e6/Separator_flourish.svg" class="hero-separator opacity-75" alt="Separator"/>
<div class="mt-4">
<a href="/shop" class="btn btn-shop-now font-weight-bold">Gift Now</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Controls -->
<button class="carousel-control-prev" type="button" data-bs-target="#clicks2cartHeroCarousel" data-bs-slide="prev" style="width: 5%;">
<span class="carousel-control-prev-icon" aria-hidden="true" style="filter: invert(1);"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#clicks2cartHeroCarousel" data-bs-slide="next" style="width: 5%;">
<span class="carousel-control-next-icon" aria-hidden="true" style="filter: invert(1);"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</section>
<!-- Who we are? -->
<section class="s_who_we_are bg-white">
<div class="container py-5">
<div class="who-we-are-wrapper" style="background-image: url('https://landing.engotheme.com/html/jenstore/demo/img/who.png');">
<h2 class="title">who we are ?</h2>
<p class="description px-lg-5">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
est laborum.
</p>
<div class="founder-info">
<img src="https://landing.engotheme.com/html/jenstore/demo/img/founder.png" alt="Founder Portrait" width="70" height="70"/>
<div class="details">
<h6>Lovelllo</h6>
<span>Founder</span>
</div>
</div>
</div>
</div>
</section>
<!-- Shop by collection -->
<section class="s_collections position-relative overflow-hidden">
<!-- Large outline flower backgrounds (top-left + bottom-right) -->
<div class="s_col_bg_flower s_col_bg_flower--tl" aria-hidden="true"></div>
<div class="s_col_bg_flower s_col_bg_flower--br" aria-hidden="true"></div>
<div class="container position-relative py-5" style="z-index:2;">
<!-- Section Header -->
<div class="text-center mb-4">
<h2 class="s_col_heading">Shop by collection</h2>
<p class="s_col_subheading">&#8212; All Category of Clicks2Cart &#8212;</p>
</div>
<!-- Main Content Row -->
<div class="row align-items-center g-4">
<!-- Left: Floral Image + Sale Text Overlay -->
<div class="col-lg-5">
<div class="s_col_promo position-relative">
<!-- The actual floral image (pink roses + splash + envelope) -->
<img src="https://landing.engotheme.com/html/jenstore/demo/img/collection.png"
class="s_col_promo_img img-fluid w-100"
alt="Summer Sale Collection"/>
<!-- Text overlay box centered on image -->
<div class="s_col_overlay_text">
<span class="s_col_hello">HELLO SUMMER</span>
<h3 class="s_col_sale_text">Sale 10%</h3>
<a href="/shop" class="s_col_shop_btn">Shop now</a>
</div>
</div>
</div>
<!-- Right: 2×2 Product Grid -->
<div class="col-lg-7">
<t t-set="featured_products" t-value="request.env['product.template'].sudo().search([('is_published', '=', True), ('sale_ok', '=', True), ('website_id', 'in', [False, website.id])], limit=4, order='website_sequence asc')"/>
<div class="row g-3">
<t t-foreach="featured_products" t-as="product">
<div class="col-6">
<div class="s_col_product_card">
<t t-if="product_index == 0">
<span class="s_col_badge s_col_badge--hot">HOT</span>
</t>
<t t-elif="product_index == 3">
<span class="s_col_badge s_col_badge--sale">SALE</span>
</t>
<div class="s_col_product_img">
<a t-attf-href="/shop/product/#{product.website_slug}">
<img t-att-src="website.image_url(product, 'image_512')" t-att-alt="product.name" loading="lazy"/>
</a>
</div>
<div class="s_col_product_info">
<h6 class="s_col_product_name" t-field="product.name"/>
<div class="s_col_stars">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-o"/>
</div>
<p class="s_col_product_price">
<span t-field="product.list_price" t-options='{"widget": "monetary"}'/>
</p>
</div>
</div>
</div>
</t>
<!-- Fallback if no products -->
<t t-if="not featured_products">
<div class="col-6">
<div class="s_col_product_card">
<span class="s_col_badge s_col_badge--hot">HOT</span>
<div class="s_col_product_img">
<img src="/theme_clicks2cart/static/src/img/flora_col.png" alt="Flora"/>
</div>
<div class="s_col_product_info">
<h6 class="s_col_product_name">Flora Bouquet</h6>
<div class="s_col_stars">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-o"/>
</div>
<p class="s_col_product_price">$120.00</p>
</div>
</div>
</div>
<div class="col-6">
<div class="s_col_product_card">
<div class="s_col_product_img">
<img src="/theme_clicks2cart/static/src/img/wedding_col.png" alt="Wedding"/>
</div>
<div class="s_col_product_info">
<h6 class="s_col_product_name">Wedding Roses</h6>
<div class="s_col_stars">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/>
</div>
<p class="s_col_product_price">$115.40</p>
</div>
</div>
</div>
<div class="col-6">
<div class="s_col_product_card">
<div class="s_col_product_img">
<img src="/theme_clicks2cart/static/src/img/holiday_col.png" alt="Holiday"/>
</div>
<div class="s_col_product_info">
<h6 class="s_col_product_name">Holiday Bloom</h6>
<div class="s_col_stars">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-half-o"/><i class="fa fa-star-o"/>
</div>
<p class="s_col_product_price">$250.60</p>
</div>
</div>
</div>
<div class="col-6">
<div class="s_col_product_card">
<span class="s_col_badge s_col_badge--sale">SALE</span>
<div class="s_col_product_img">
<img src="/theme_clicks2cart/static/src/img/hero_bg.png" alt="Sale"/>
</div>
<div class="s_col_product_info">
<h6 class="s_col_product_name">Rose Bouquet</h6>
<div class="s_col_stars">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-o"/><i class="fa fa-star-o"/>
</div>
<p class="s_col_product_price">$100.90</p>
</div>
</div>
</div>
</t>
</div>
</div>
</div>
</div>
</section>
<!-- Wedding Category Feature Section -->
<section class="s_category_feature pb-0">
<!-- Brush Splash Background -->
<div class="s_cat_background" aria-hidden="true"></div>
<div class="container pb-5">
<!-- Section Header -->
<div class="s_cat_header">
<h2 class="s_cat_title">Wedding</h2>
<p class="s_cat_divider">&#126; All Category of Clickstocart &#126;</p>
</div>
<!-- Product Grid (4 items) -->
<div class="row s_cat_grid">
<t t-set="wedding_products" t-value="request.env['product.template'].sudo().search([('is_published', '=', True)], limit=4, order='website_sequence asc')"/>
<t t-foreach="wedding_products" t-as="product">
<div class="col-lg-3 col-md-6 mb-4">
<div class="s_cat_card text-center">
<t t-if="product_index == 0">
<span class="s_cat_badge badge-hot">HOT</span>
</t>
<t t-elif="product_index == 2">
<span class="s_cat_badge badge-sale">SALE</span>
</t>
<div class="s_cat_img_wrap position-relative overflow-hidden">
<a t-attf-href="/shop/product/#{product.website_slug or product.id}">
<img t-att-src="website.image_url(product, 'image_512')" t-att-alt="product.name" loading="lazy"/>
</a>
<!-- Hover Cart Icon -->
<div class="s_cat_hover_btn">
<a t-attf-href="/shop/cart/update_short?product_id=#{product.product_variant_id.id}" class="btn_add_cart" title="Add to Cart">
<i class="fa fa-shopping-cart"></i>
</a>
</div>
</div>
<!-- Product info below image -->
<div class="s_cat_info mt-3">
<h6 class="s_cat_prod_name mb-1">
<a t-attf-href="/shop/product/#{product.website_slug or product.id}" t-field="product.name" class="text-dark text-decoration-none fw-bold"/>
</h6>
<div class="s_cat_prod_price fw-bold" style="color: #e6b3a3;">
<span t-field="product.list_price" t-options='{"widget": "monetary"}'/>
</div>
</div>
</div>
</div>
</t>
<!-- Fallback placeholders -->
<t t-if="not wedding_products">
<t t-foreach="[1,2,3,4]" t-as="item">
<div class="col-lg-3 col-md-6 mb-4">
<div class="s_cat_card text-center">
<t t-if="item == 1"><span class="s_cat_badge badge-hot">HOT</span></t>
<t t-if="item == 3"><span class="s_cat_badge badge-sale">SALE</span></t>
<div class="s_cat_img_wrap position-relative overflow-hidden">
<img t-attf-src="/theme_clicks2cart/static/src/img/wedding_col#{'_v2' if item == 4 else ''}.png" alt="Fallback Product"/>
<div class="s_cat_hover_btn">
<a href="#" class="btn_add_cart"><i class="fa fa-shopping-cart"></i></a>
</div>
</div>
<div class="s_cat_info mt-3">
<h6 class="s_cat_prod_name mb-1">Wedding Flowers</h6>
<div class="s_cat_prod_price fw-bold" style="color: #e6b3a3;">$120.00</div>
</div>
</div>
</div>
</t>
</t>
</div>
</div>
<!-- Floating floral accents at bottom right -->
<div class="s_cat_floating_flower" aria-hidden="true"></div>
</section>
<!-- Holiday Section -->
<section class="s_holiday_section">
<!-- Top accent floral -->
<div class="s_holiday_bg_accent" aria-hidden="true"></div>
<div class="container">
<!-- Section Header -->
<div class="s_holiday_header">
<h2 class="s_holiday_title">Holiday</h2>
<p class="s_holiday_divider">&#8212; Lorem Ipsum is simply dummy text of the printing &#8212;</p>
</div>
<div class="row align-items-center s_holiday_grid_container">
<!-- Left: Product Grid (7 cols) -->
<div class="col-lg-7">
<div class="row s_holiday_prod_grid">
<t t-set="holiday_products" t-value="request.env['product.template'].sudo().search([('is_published', '=', True)], limit=4, offset=4, order='website_sequence asc')"/>
<t t-foreach="holiday_products" t-as="product">
<div class="col-md-6">
<div class="s_cat_card">
<t t-if="product_index == 0">
<span class="s_cat_badge badge-hot">HOT</span>
</t>
<t t-elif="product_index == 3">
<span class="s_cat_badge badge-sale">SALE</span>
</t>
<div class="s_cat_img_wrap position-relative overflow-hidden">
<a t-attf-href="/shop/product/#{product.website_slug or product.id}">
<img t-att-src="website.image_url(product, 'image_512')" t-att-alt="product.name" loading="lazy"/>
</a>
<div class="s_cat_hover_btn">
<a t-attf-href="/shop/cart/update_short?product_id=#{product.product_variant_id.id}" class="btn_add_cart"><i class="fa fa-shopping-cart"></i></a>
</div>
</div>
<div class="s_cat_info">
<h6 class="s_cat_prod_name mb-1">
<a t-attf-href="/shop/product/#{product.website_slug or product.id}" t-field="product.name" class="text-dark text-decoration-none fw-bold"/>
</h6>
<div class="s_cat_prod_price fw-bold">
<span t-field="product.list_price" t-options='{"widget": "monetary"}'/>
</div>
</div>
</div>
</div>
</t>
<!-- Fallback with specific Holiday Images -->
<t t-if="not holiday_products">
<div class="col-md-6 mb-4">
<div class="s_cat_card">
<span class="s_cat_badge badge-hot">HOT</span>
<div class="s_cat_img_wrap position-relative overflow-hidden">
<img src="/theme_clicks2cart/static/src/img/holiday_prod_1.png" alt="Fun &amp; Flirty"/>
<div class="s_cat_hover_btn">
<a href="#" class="btn_add_cart"><i class="fa fa-shopping-cart"></i></a>
</div>
</div>
<div class="s_cat_info">
<h6 class="s_cat_prod_name">Fun &amp; Flirty By Bl..</h6>
<div class="s_cat_stars mb-1" style="color: #e6b3a3; font-size: 0.8rem;">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-o"/>
</div>
<div class="s_cat_prod_price fw-bold">$200.2</div>
</div>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="s_cat_card">
<div class="s_cat_img_wrap position-relative overflow-hidden">
<img src="/theme_clicks2cart/static/src/img/holiday_prod_2.png" alt="Winter White"/>
<div class="s_cat_hover_btn">
<a href="#" class="btn_add_cart"><i class="fa fa-shopping-cart"></i></a>
</div>
</div>
<div class="s_cat_info">
<h6 class="s_cat_prod_name">Winter White Bo..</h6>
<div class="s_cat_stars mb-1" style="color: #e6b3a3; font-size: 0.8rem;">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/>
</div>
<div class="s_cat_prod_price fw-bold">$240.2</div>
</div>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="s_cat_card">
<div class="s_cat_img_wrap position-relative overflow-hidden">
<img src="/theme_clicks2cart/static/src/img/holiday_prod_3.png" alt="Tulipa Floriade"/>
<div class="s_cat_hover_btn">
<a href="#" class="btn_add_cart"><i class="fa fa-shopping-cart"></i></a>
</div>
</div>
<div class="s_cat_info">
<h6 class="s_cat_prod_name">Tulipa Floriade -..</h6>
<div class="s_cat_stars mb-1" style="color: #e6b3a3; font-size: 0.8rem;">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-o"/><i class="fa fa-star-o"/><i class="fa fa-star-o"/>
</div>
<div class="s_cat_prod_price fw-bold">$105.7</div>
</div>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="s_cat_card">
<span class="s_cat_badge badge-sale">SALE</span>
<div class="s_cat_img_wrap position-relative overflow-hidden">
<img src="/theme_clicks2cart/static/src/img/holiday_prod_4.png" alt="Sweet Sorbet"/>
<div class="s_cat_hover_btn">
<a href="#" class="btn_add_cart"><i class="fa fa-shopping-cart"></i></a>
</div>
</div>
<div class="s_cat_info">
<h6 class="s_cat_prod_name">Sweet Sorbet..</h6>
<div class="s_cat_stars mb-1" style="color: #e6b3a3; font-size: 0.8rem;">
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star-o"/>
</div>
<div class="s_cat_prod_price fw-bold">$215.2</div>
</div>
</div>
</div>
</t>
</div>
</div>
<!-- Right: Large Promo Area (5 cols) -->
<div class="col-lg-5">
<div class="s_holiday_promo_wrap">
<div class="s_holiday_promo_bg"></div>
<div class="s_holiday_promo_content">
<span class="s_holiday_hello">HELLO SUMMER</span>
<h3 class="s_holiday_promo_title">Sale 10%</h3>
<a href="/shop" class="s_holiday_shop_btn">Shop now</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Sale Banner -->
<section class="py-5">
<div class="container">
<div class="s_sale_banner p-5 shadow-sm border-0 overflow-hidden" style="background: linear-gradient(135deg, #fdf5e6 0%, #fff 100%); border-radius: 40px;">
<div class="row align-items-center">
<div class="col-lg-6 text-center text-lg-start px-lg-5">
<p class="text-uppercase fw-bold m-0" style="color: #e6b3a3; letter-spacing: 3px;">Limited Offer</p>
<h2 class="display-3 fw-bold my-3" style="font-family: 'Playfair Display';">Sale up to 40%</h2>
<p class="lead text-muted mb-4">Don't miss out on our seasonal favorites at unbelievable prices. Only this week!</p>
<div class="d-flex justify-content-center justify-content-lg-start gap-4 mb-4">
<div class="text-center"><h3 class="fw-bold m-0">12</h3><p class="small text-muted">Days</p></div>
<div class="text-center"><h3 class="fw-bold m-0">20</h3><p class="small text-muted">Hrs</p></div>
<div class="text-center"><h3 class="fw-bold m-0">33</h3><p class="small text-muted">Mins</p></div>
<div class="text-center"><h3 class="fw-bold m-0">27</h3><p class="small text-muted">Secs</p></div>
</div>
<a href="/shop" class="btn btn-dark btn-lg rounded-pill px-5">Shop Sale</a>
</div>
<div class="col-lg-6 mt-4 mt-lg-0">
<img src="/theme_clicks2cart/static/src/img/hero_bg.png" class="img-fluid rounded-4 shadow-lg" alt="Sales Bloom"/>
</div>
</div>
</div>
</div>
</section>
<!-- Latest Blogs -->
<section class="py-5 bg-white">
<div class="container py-4">
<div class="text-center mb-5">
<h2 class="display-5 fw-bold" style="font-family: 'Playfair Display';">Latest Blogs</h2>
<p class="text-muted">Stories from our garden</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card border-0 h-100">
<img src="/theme_clicks2cart/static/src/img/flora_col.png" class="card-img-top rounded-4 mb-3" alt="Blog 1" style="height: 250px; object-fit: cover;"/>
<div class="card-body p-0">
<p class="small text-uppercase text-muted fw-bold mb-1">Flower Care / 24 Feb 2024</p>
<h5 class="fw-bold mb-3" style="font-family: 'Playfair Display';">How to make your flowers last longer</h5>
<a href="/blog" class="text-dark fw-bold text-decoration-none border-bottom border-dark pb-1">Read More</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100">
<img src="/theme_clicks2cart/static/src/img/wedding_col.png" class="card-img-top rounded-4 mb-3" alt="Blog 2" style="height: 250px; object-fit: cover;"/>
<div class="card-body p-0">
<p class="small text-uppercase text-muted fw-bold mb-1">Wedding / 18 Feb 2024</p>
<h5 class="fw-bold mb-3" style="font-family: 'Playfair Display';">Choosing the perfect bridal bouquet</h5>
<a href="/blog" class="text-dark fw-bold text-decoration-none border-bottom border-dark pb-1">Read More</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100">
<img src="/theme_clicks2cart/static/src/img/holiday_col.png" class="card-img-top rounded-4 mb-3" alt="Blog 3" style="height: 250px; object-fit: cover;"/>
<div class="card-body p-0">
<p class="small text-uppercase text-muted fw-bold mb-1">Interior / 12 Feb 2024</p>
<h5 class="fw-bold mb-3" style="font-family: 'Playfair Display';">Bring the nature into your living room</h5>
<a href="/blog" class="text-dark fw-bold text-decoration-none border-bottom border-dark pb-1">Read More</a>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</xpath>
</field>
</record>
</odoo>