501 lines
24 KiB
XML
501 lines
24 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<odoo>
|
|
|
|
<!-- ══════════════════════════════════════════════════════
|
|
BLOG LIST PAGE
|
|
Route: /v2/blog
|
|
══════════════════════════════════════════════════════ -->
|
|
<template id="v2_blog_list" name="V2 Blog List">
|
|
<t t-call="website.layout">
|
|
<t t-set="head">
|
|
<title t-out="page_title"/>
|
|
<meta name="description" content="Read the latest insights on luxury weddings, event design, multicultural celebrations, and creative inspiration from the Aakriti Events team."/>
|
|
</t>
|
|
|
|
<div id="wrap" class="oe_structure" style="background-color: var(--v2-cream); font-family: var(--v2-font-body);">
|
|
|
|
<style>
|
|
/* Blog Grid */
|
|
.v2-blog-section {
|
|
max-width: 1320px;
|
|
margin: 0 auto;
|
|
padding: 80px 24px;
|
|
}
|
|
.v2-blog-grid {
|
|
display: grid;
|
|
gap: 32px;
|
|
grid-template-columns: 1fr;
|
|
}
|
|
@media (min-width: 768px) {
|
|
.v2-blog-grid {
|
|
grid-template-columns: repeat(2, 1fr);
|
|
}
|
|
}
|
|
@media (min-width: 1024px) {
|
|
.v2-blog-grid {
|
|
grid-template-columns: repeat(3, 1fr);
|
|
}
|
|
}
|
|
/* Blog Card */
|
|
.v2-blog-card {
|
|
background: var(--v2-white);
|
|
border-radius: 18px;
|
|
overflow: hidden;
|
|
box-shadow: 0 10px 40px rgba(30,18,8,0.06);
|
|
border: 1px solid var(--v2-border);
|
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.v2-blog-card:hover {
|
|
transform: translateY(-6px);
|
|
box-shadow: 0 20px 50px rgba(30,18,8,0.12);
|
|
}
|
|
.v2-blog-card-img-wrap {
|
|
position: relative;
|
|
overflow: hidden;
|
|
height: 240px;
|
|
}
|
|
.v2-blog-card-img-wrap img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
transition: transform 0.6s ease;
|
|
}
|
|
.v2-blog-card:hover .v2-blog-card-img-wrap img {
|
|
transform: scale(1.06);
|
|
}
|
|
.v2-blog-card-category {
|
|
position: absolute;
|
|
top: 16px;
|
|
left: 16px;
|
|
background: var(--v2-gold);
|
|
color: var(--v2-white);
|
|
font-size: 0.68rem;
|
|
font-weight: 700;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1em;
|
|
padding: 4px 12px;
|
|
border-radius: 4px;
|
|
}
|
|
.v2-blog-card-body {
|
|
padding: 28px 24px 24px;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.v2-blog-card-meta {
|
|
font-size: 0.78rem;
|
|
color: var(--v2-muted);
|
|
margin-bottom: 12px;
|
|
display: flex;
|
|
gap: 14px;
|
|
align-items: center;
|
|
}
|
|
.v2-blog-card-meta span {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
.v2-blog-card-title {
|
|
font-family: var(--v2-font-display);
|
|
font-size: 1.4rem;
|
|
font-weight: 600;
|
|
color: var(--v2-text);
|
|
line-height: 1.25;
|
|
margin-bottom: 12px;
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
.v2-blog-card-title:hover {
|
|
color: var(--v2-gold);
|
|
}
|
|
.v2-blog-card-excerpt {
|
|
font-size: 0.88rem;
|
|
color: var(--v2-muted);
|
|
line-height: 1.7;
|
|
flex: 1;
|
|
margin-bottom: 24px;
|
|
}
|
|
.v2-blog-card-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
font-size: 0.8rem;
|
|
font-weight: 700;
|
|
color: var(--v2-gold);
|
|
text-decoration: none;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.08em;
|
|
transition: gap 0.2s ease;
|
|
}
|
|
.v2-blog-card-link:hover {
|
|
gap: 10px;
|
|
color: var(--v2-gold-dark);
|
|
}
|
|
@media (max-width: 767px) {
|
|
.v2-blog-section {
|
|
padding: 48px 20px;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<!-- Inner Banner -->
|
|
<section class="v2-inner-banner" style="background-image: url('/theme_aakriti_v2/static/src/img/inner-banner/4.webp');">
|
|
<div class="v2-inner-banner-content">
|
|
<h1 class="v2-inner-banner-title" style="font-family: var(--v2-font-display);">Our Blog</h1>
|
|
<div class="v2-inner-banner-breadcrumb">
|
|
<a href="/">Home</a> / <span class="v2-active">Blog</span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Blog Grid -->
|
|
<div class="v2-blog-section">
|
|
<div style="text-align:center; margin-bottom:56px;">
|
|
<div style="font-size:0.75rem; font-weight:700; color:#C9973A; text-transform:uppercase; letter-spacing:0.15em; margin-bottom:12px; display:flex; align-items:center; justify-content:center; gap:12px;">
|
|
<span style="height:1px; width:40px; background:#C9973A; display:inline-block;"></span>
|
|
INSIGHTS & INSPIRATION
|
|
<span style="height:1px; width:40px; background:#C9973A; display:inline-block;"></span>
|
|
</div>
|
|
<h2 style="font-family:'Cormorant Garamond',Georgia,serif; font-size:clamp(2rem,3.5vw,3rem); color:#1a1206; font-weight:600; margin:0;">
|
|
Stories from the Studio
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="v2-blog-grid">
|
|
<t t-foreach="posts" t-as="post">
|
|
<article class="v2-blog-card">
|
|
<div class="v2-blog-card-img-wrap">
|
|
<img t-att-src="post['image']" t-att-alt="post['title']"/>
|
|
<span class="v2-blog-card-category" t-out="post['category']"/>
|
|
</div>
|
|
<div class="v2-blog-card-body">
|
|
<div class="v2-blog-card-meta">
|
|
<span>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="4" rx="2" ry="2"/><line x1="16" x2="16" y1="2" y2="6"/><line x1="8" x2="8" y1="2" y2="6"/><line x1="3" x2="21" y1="10" y2="10"/></svg>
|
|
<t t-out="post['date']"/>
|
|
</span>
|
|
<span>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
|
<t t-out="post['read_time']"/>
|
|
</span>
|
|
</div>
|
|
<a t-attf-href="/blog/#{post['slug']}" class="v2-blog-card-title" t-out="post['title']"/>
|
|
<p class="v2-blog-card-excerpt" t-out="post['excerpt']"/>
|
|
<a t-attf-href="/blog/#{post['slug']}" class="v2-blog-card-link">
|
|
Read Article
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
|
|
</a>
|
|
</div>
|
|
</article>
|
|
</t>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</t>
|
|
</template>
|
|
|
|
|
|
<!-- ══════════════════════════════════════════════════════
|
|
BLOG DETAIL PAGE
|
|
Route: /v2/blog/<slug>
|
|
══════════════════════════════════════════════════════ -->
|
|
<template id="v2_blog_detail" name="V2 Blog Detail">
|
|
<t t-call="website.layout">
|
|
<t t-set="head">
|
|
<title t-out="page_title"/>
|
|
<meta t-att-name="'description'" t-att-content="post['excerpt']"/>
|
|
</t>
|
|
|
|
<div id="wrap" class="oe_structure" style="background-color: var(--v2-cream); font-family: var(--v2-font-body);">
|
|
|
|
<style>
|
|
/* ── Blog Detail Page ── */
|
|
|
|
|
|
|
|
.v2-detail-meta {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 20px;
|
|
font-size: 0.82rem;
|
|
color: rgba(255,255,255,0.8);
|
|
}
|
|
.v2-detail-meta span {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
/* Article Layout */
|
|
.v2-detail-layout {
|
|
max-width: 1320px;
|
|
margin: 0 auto;
|
|
padding: 64px 24px;
|
|
display: grid;
|
|
gap: 60px;
|
|
grid-template-columns: 1fr;
|
|
}
|
|
@media (min-width: 1024px) {
|
|
.v2-detail-layout {
|
|
grid-template-columns: 1fr 340px;
|
|
}
|
|
}
|
|
/* Article Body */
|
|
.v2-article-body {
|
|
font-size: 1rem;
|
|
color: var(--v2-text);
|
|
line-height: 1.85;
|
|
}
|
|
.v2-article-body h3 {
|
|
font-family: var(--v2-font-display);
|
|
font-size: 1.6rem;
|
|
font-weight: 600;
|
|
color: var(--v2-text);
|
|
margin: 40px 0 16px;
|
|
line-height: 1.2;
|
|
}
|
|
.v2-article-body p {
|
|
margin-bottom: 20px;
|
|
}
|
|
.v2-article-body strong {
|
|
color: var(--v2-text);
|
|
font-weight: 600;
|
|
}
|
|
.v2-article-body a {
|
|
color: var(--v2-gold);
|
|
text-decoration: underline;
|
|
}
|
|
.v2-article-body a:hover {
|
|
color: var(--v2-gold-dark);
|
|
}
|
|
.v2-article-body em {
|
|
font-style: italic;
|
|
}
|
|
/* Author Card */
|
|
.v2-author-card {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 16px;
|
|
background: var(--v2-white);
|
|
border: 1px solid var(--v2-border);
|
|
border-radius: 12px;
|
|
padding: 24px;
|
|
margin-top: 48px;
|
|
}
|
|
.v2-author-avatar {
|
|
width: 60px;
|
|
height: 60px;
|
|
border-radius: 50%;
|
|
background: var(--v2-gold);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: var(--v2-font-display);
|
|
font-size: 1.6rem;
|
|
color: var(--v2-white);
|
|
font-weight: 600;
|
|
flex-shrink: 0;
|
|
}
|
|
.v2-author-info h4 {
|
|
font-family: var(--v2-font-display);
|
|
font-size: 1.2rem;
|
|
color: var(--v2-text);
|
|
font-weight: 600;
|
|
margin: 0 0 4px;
|
|
}
|
|
.v2-author-info p {
|
|
font-size: 0.8rem;
|
|
color: var(--v2-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.08em;
|
|
margin: 0;
|
|
}
|
|
/* Tags */
|
|
.v2-tags {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 8px;
|
|
margin-top: 32px;
|
|
}
|
|
.v2-tag {
|
|
font-size: 0.75rem;
|
|
color: var(--v2-gold);
|
|
border: 1px solid var(--v2-gold);
|
|
padding: 4px 14px;
|
|
border-radius: 100px;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.06em;
|
|
}
|
|
/* Sidebar */
|
|
.v2-sidebar {}
|
|
.v2-sidebar-card {
|
|
background: var(--v2-white);
|
|
border: 1px solid var(--v2-border);
|
|
border-radius: 16px;
|
|
padding: 32px 28px;
|
|
margin-bottom: 32px;
|
|
}
|
|
.v2-sidebar-title {
|
|
font-family: var(--v2-font-display);
|
|
font-size: 1.25rem;
|
|
font-weight: 600;
|
|
color: var(--v2-text);
|
|
margin-bottom: 20px;
|
|
padding-bottom: 12px;
|
|
border-bottom: 1px solid var(--v2-border);
|
|
}
|
|
.v2-recent-post {
|
|
display: flex;
|
|
gap: 14px;
|
|
align-items: flex-start;
|
|
padding: 14px 0;
|
|
border-bottom: 1px solid var(--v2-border);
|
|
text-decoration: none;
|
|
}
|
|
.v2-recent-post:last-child {
|
|
border-bottom: none;
|
|
padding-bottom: 0;
|
|
}
|
|
.v2-recent-post-img {
|
|
width: 72px;
|
|
height: 60px;
|
|
border-radius: 8px;
|
|
object-fit: cover;
|
|
flex-shrink: 0;
|
|
}
|
|
.v2-recent-post-info h5 {
|
|
font-size: 0.88rem;
|
|
font-weight: 600;
|
|
color: var(--v2-text);
|
|
line-height: 1.35;
|
|
margin: 0 0 4px;
|
|
transition: color 0.2s;
|
|
}
|
|
.v2-recent-post:hover .v2-recent-post-info h5 {
|
|
color: var(--v2-gold);
|
|
}
|
|
.v2-recent-post-info span {
|
|
font-size: 0.75rem;
|
|
color: var(--v2-muted);
|
|
}
|
|
.v2-cta-sidebar {
|
|
background: linear-gradient(135deg, var(--v2-dark) 0%, var(--v2-dark2) 100%);
|
|
border-radius: 16px;
|
|
padding: 36px 28px;
|
|
text-align: center;
|
|
}
|
|
.v2-cta-sidebar h3 {
|
|
font-family: var(--v2-font-display);
|
|
font-size: 1.5rem;
|
|
color: var(--v2-white);
|
|
font-weight: 600;
|
|
margin-bottom: 12px;
|
|
line-height: 1.25;
|
|
}
|
|
.v2-cta-sidebar p {
|
|
font-size: 0.88rem;
|
|
color: rgba(255,255,255,0.7);
|
|
margin-bottom: 24px;
|
|
line-height: 1.6;
|
|
}
|
|
@media (max-width: 767px) {
|
|
.v2-detail-layout {
|
|
padding: 40px 20px;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<!-- Inner Banner -->
|
|
<section class="v2-inner-banner" style="background-image: url('/theme_aakriti_v2/static/src/img/inner-banner/5.webp');">
|
|
<div class="v2-inner-banner-content">
|
|
<h1 class="v2-inner-banner-title" style="font-family: var(--v2-font-display);" t-out="post['title']"/>
|
|
<div class="v2-inner-banner-breadcrumb">
|
|
<a href="/">Home</a> / <a href="/blog">Blog</a> / <span class="v2-active" t-out="post['category']"/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Article Layout -->
|
|
<div class="v2-detail-layout">
|
|
|
|
<!-- Main Content -->
|
|
<div>
|
|
<!-- Breadcrumb -->
|
|
<div style="font-size:0.78rem; color: var(--v2-muted); margin-bottom:32px; text-transform:uppercase; letter-spacing:0.06em;">
|
|
<a href="/" style="color: var(--v2-muted); text-decoration:none;">Home</a>
|
|
<span style="margin:0 8px;">·</span>
|
|
<a href="/blog" style="color: var(--v2-muted); text-decoration:none;">Blog</a>
|
|
<span style="margin:0 8px;">·</span>
|
|
<span style="color: var(--v2-gold);" t-out="post['category']"/>
|
|
</div>
|
|
|
|
<!-- Article Body -->
|
|
<div class="v2-article-body">
|
|
<t t-out="post['content']"/>
|
|
</div>
|
|
|
|
<!-- Tags -->
|
|
<div class="v2-tags">
|
|
<t t-foreach="post.get('tags', [])" t-as="tag">
|
|
<span class="v2-tag" t-out="tag"/>
|
|
</t>
|
|
</div>
|
|
|
|
<!-- Author Card -->
|
|
<div class="v2-author-card">
|
|
<div class="v2-author-avatar">
|
|
<t t-out="post['author'][0]"/>
|
|
</div>
|
|
<div class="v2-author-info">
|
|
<h4 t-out="post['author']"/>
|
|
<p t-out="post['author_title']"/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Back Link -->
|
|
<div style="margin-top:48px;">
|
|
<a href="/blog" style="display:inline-flex; align-items:center; gap:8px; font-size:0.82rem; font-weight:700; color: var(--v2-gold); text-transform:uppercase; letter-spacing:0.08em; text-decoration:none;">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M19 12H5"/><path d="m12 19-7-7 7-7"/></svg>
|
|
Back to All Articles
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sidebar -->
|
|
<aside class="v2-sidebar">
|
|
<!-- Recent Posts -->
|
|
<div class="v2-sidebar-card">
|
|
<div class="v2-sidebar-title">More Articles</div>
|
|
<t t-foreach="recent_posts" t-as="rp">
|
|
<a t-attf-href="/blog/#{rp['slug']}" class="v2-recent-post">
|
|
<img t-att-src="rp['image']" t-att-alt="rp['title']" class="v2-recent-post-img"/>
|
|
<div class="v2-recent-post-info">
|
|
<h5 t-out="rp['title']"/>
|
|
<span t-out="rp['date']"/>
|
|
</div>
|
|
</a>
|
|
</t>
|
|
</div>
|
|
|
|
<!-- CTA Card -->
|
|
<div class="v2-cta-sidebar">
|
|
<h3>Ready to Create Your Dream Event?</h3>
|
|
<p>Let's talk about your vision. We'd love to bring it to life.</p>
|
|
<a href="/contactus" style="display:inline-flex; align-items:center; gap:8px; background: var(--v2-gold); color: var(--v2-white); padding:12px 24px; border-radius:4px; font-size:0.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; text-decoration:none; transition:background 0.3s;">
|
|
Book a Consultation
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
|
|
</a>
|
|
</div>
|
|
</aside>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</t>
|
|
</template>
|
|
|
|
</odoo>
|