alaguraj/odoo-testing-addons
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Footer ui updated

Browse Source
This commit is contained in:
Alaguraj0361 2026-02-02 22:55:24 +05:30
parent ad48c93063
commit de84edb9c2
2 changed files with 257 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

178
addons/dine360_theme_chennora/static/src/scss/theme.scss
View File

@ -814,11 +814,185 @@
}
// Footer
// Footer Refinement
footer#bottom {
background-color: #04121D !important;
color: white;
position: relative;
padding-top: 120px; // Space for the floating bar
overflow: visible;
a:hover {
color: #FECD4F !important;
// Floating Teal Bar
.footer-cta-bar-wrapper {
position: absolute;
top: -60px;
left: 0;
right: 0;
z-index: 20;
.footer-cta-bar {
background-color: #2BB1A5;
border-radius: 20px;
padding: 30px 50px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
display: flex;
justify-content: space-between;
align-items: center;
.cta-item {
display: flex;
align-items: center;
gap: 20px;
color: white;
.icon-circle {
width: 50px;
height: 50px;
background: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #2BB1A5;
font-size: 20px;
}
strong {
display: block;
font-size: 14px;
opacity: 0.8;
}
p {
margin: 0;
font-weight: 700;
font-size: 16px;
}
}
}
}
.footer-title {
font-size: 24px;
font-weight: 800;
margin-bottom: 30px;
position: relative;
padding-bottom: 10px;
&::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 50px;
height: 3px;
background: #2BB1A5;
}
}
.footer-logo {
max-width: 180px;
}
.social-links {
display: flex;
gap: 10px;
a {
width: 35px;
height: 35px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
color: white;
transition: all 0.3s;
&:hover {
background: #FECD4F;
border-color: #FECD4F;
color: #04121D;
}
}
}
.footer-list {
list-style: none;
padding: 0;
margin: 0;
li {
margin-bottom: 15px;
display: flex;
align-items: flex-start;
gap: 10px;
i {
color: #2BB1A5;
font-size: 12px;
margin-top: 5px;
}
a {
color: white;
text-decoration: none;
transition: color 0.3s;
&:hover {
color: #FECD4F;
}
}
}
}
.footer-accent-left {
position: absolute;
left: -50px;
bottom: 100px;
width: 200px;
opacity: 0.8;
pointer-events: none;
}
.footer-accent-right {
position: absolute;
right: -50px;
top: 0;
width: 250px;
opacity: 0.8;
pointer-events: none;
border-radius: 50%;
}
.footer-copyright-bar {
background-color: #FECD4F;
color: #04121D;
text-align: center;
padding: 15px;
font-weight: 700;
margin-top: 80px;
}
}
// Mobile Responsive Footer
@media (max-width: 991px) {
footer#bottom {
padding-top: 200px;
.footer-cta-bar-wrapper {
top: -150px;
.footer-cta-bar {
flex-direction: column;
gap: 20px;
padding: 30px;
}
}
.footer-accent-left,
.footer-accent-right {
display: none;
}
}
}

143
addons/dine360_theme_chennora/views/layout.xml
View File

@ -17,19 +17,6 @@
</xpath>
<xpath expr="//head" position="attributes">
<!--
Cache the <head> of the website.layout:
- For each individual website.page record (their css/js might be the
same but their title will not for example). Arguably we could do this
for any record (not only website.page) but this t-cache was originally
added to replace the website.page own cache system. For other records,
it could probably depend on each individual access right.
- Only for non-designers (especially visitors) (hence the "editable or
translatable" check).
- Only if not in any debug mode (we want any correct value of debug mode
to correctly appear in the `odoo` object + assets may depend on this
(e.g. debug=assets or debug=tests)).
-->
<attribute name="t-cache">main_object if main_object and main_object._name == 'website.page' and not request.session.debug and not editable and not translatable else None</attribute>
</xpath>
<xpath expr="//head/*[1]" position="before">
@ -60,7 +47,6 @@
<meta t-if="meta_keywords or editable" name="keywords" t-att-content="meta_keywords"/>
<t t-if="seo_object">
<meta name="default_description" t-att-content="website_meta_description or website_meta.get('meta_description')" groups="website.group_website_designer"/>
<!-- OpenGraph tags for Facebook sharing -->
<t t-set="opengraph_meta" t-value="website_meta.get('opengraph_meta')"/>
<t t-if="opengraph_meta">
<t t-foreach="opengraph_meta" t-as="property">
@ -74,7 +60,6 @@
</t>
</t>
</t>
<!-- Twitter tags for sharing -->
<t t-set="twitter_meta" t-value="website_meta.get('twitter_meta')"/>
<t t-if="opengraph_meta">
<t t-foreach="twitter_meta" t-as="t_meta">
@ -82,7 +67,6 @@
</t>
</t>
</t>
<!-- `alternate`/`canonical` mainly useful to crawlers/bots/SEO tools, which test the website as public user -->
<t t-if="request and request.is_frontend_multilang and website and website.is_public_user()">
<t t-set="alternate_languages" t-value="website._get_alternate_languages(canonical_params=canonical_params)"/>
<t t-foreach="alternate_languages" t-as="lg">
@ -90,9 +74,6 @@
</t>
</t>
<link t-if="request and website and website.is_public_user()" rel="canonical" t-att-href="website._get_canonical_url(canonical_params=canonical_params)"/>
<!-- TODO: Once we have style in DB, add this preconnect only if a
google font is actually used. Note that if no font is used, the
preconnect is actually not connecting to the google servers. -->
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin=""/>
</xpath>
@ -102,9 +83,6 @@
</xpath>
<xpath expr="//header/t[@t-cache]" position="attributes">
<!-- website.is_public_user() is needed for menus having a page with
restricted visibility (only shown to logged in user): public users and
logged in users can't share the menu cache. -->
<attribute name="t-cache">None if website.is_menu_cache_disabled() else (xmlid,website,website.is_public_user())</attribute>
</xpath>
@ -114,23 +92,79 @@
<t t-set="extra_items_toggle_aria_label">Extra items button</t>
</xpath>
<xpath expr="//footer" position="attributes">
<attribute name="data-name">Footer</attribute>
<!-- Background now controlled by css configuration, using color combinations -->
<attribute name="t-attf-class" add="o_colored_level o_cc" remove="bg-light" separator=" "/>
<!-- Add the main object as a cache key so that the footer_visible page
option is properly reflected across pages. Controllers and other objects
do not have any page option (yet) so they can share the same cache -->
<attribute name="t-cache" add="website,main_object._name == 'website.page' and main_object"/>
</xpath>
<xpath expr="//div[hasclass('o_footer_copyright')]" position="attributes">
<attribute name="data-name">Copyright</attribute>
<!-- Background now controlled by css configuration, using color combinations -->
<attribute name="class" add="o_colored_level o_cc" separator=" "/>
</xpath>
<xpath expr="//t[@t-call='web.brand_promotion']/.." position="attributes">
<attribute name="class" add="o_not_editable" separator=" "/>
<attribute name="t-if">not editable</attribute>
<xpath expr="//footer[@id='bottom']" position="replace">
<footer id="bottom" data-anchor="true" data-name="Footer" class="o_footer o_colored_level o_cc">
<div id="footer" class="oe_structure oe_structure_solo">
<section class="s_footer_premium pt80">
<div class="container footer-cta-bar-wrapper">
<div class="footer-cta-bar">
<div class="cta-item">
<div class="icon-circle"><i class="fa fa-map-marker"></i></div>
<div>
<strong>Address</strong>
<p>Unit 66, 11665 McVean Dr, Brampton, Canada.</p>
</div>
</div>
<div class="cta-item">
<div class="icon-circle"><i class="fa fa-envelope"></i></div>
<div>
<strong>Send Email</strong>
<p>chennorakitchen@gmail.com</p>
</div>
</div>
<div class="cta-item">
<div class="icon-circle"><i class="fa fa-phone"></i></div>
<div>
<strong>Call Us</strong>
<p>+1(647)856-2878</p>
</div>
</div>
</div>
</div>
<div class="container main-footer-content mt-5">
<div class="row">
<div class="col-lg-3 col-md-6 mb-5">
<h2 class="fw-bold mb-4" style="color: #FECD4F;">Chennora</h2>
<p class="text-white-50 mb-4">Chennora brings Chennai's authentic flavors to Brampton where every dish tells a story of South Indian heritage.</p>
<div class="social-links">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-tiktok"></i></a>
<a href="#"><i class="fa fa-youtube"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
<div class="col-lg-3 col-md-6 mb-5">
<h4 class="footer-title">Hours</h4>
<ul class="footer-list">
<li><span>Sunday - Thursday: <span style="color: #2BB1A5;">12pm - 9pm</span></span></li>
<li><span>Friday &amp; Saturday: <span style="color: #2BB1A5;">12pm - 11pm</span></span></li>
</ul>
</div>
<div class="col-lg-3 col-md-6 mb-5">
<h4 class="footer-title">Quick Links</h4>
<ul class="footer-list">
<li><i class="fa fa-chevron-right"></i><a href="/about">About Us</a></li>
<li><i class="fa fa-chevron-right"></i><a href="/blog">Our Blogs</a></li>
<li><i class="fa fa-chevron-right"></i><a href="/contactus">Contact Us</a></li>
</ul>
</div>
<div class="col-lg-3 col-md-6 mb-5">
<h4 class="footer-title">Contact</h4>
<div class="mb-3 d-flex align-items-center"><i class="fa fa-phone me-3" style="color: #2BB1A5;"></i><span>+1(647)856-2878</span></div>
<h5 class="fw-bold mt-4 mb-2">Address</h5>
<div class="d-flex align-items-start"><i class="fa fa-map-marker me-3 mt-1" style="color: #2BB1A5;"></i><span>Chennora Indian Kitchen Bar, Unit 66, 11665 McVean Dr, Brampton</span></div>
</div>
</div>
</div>
<img src="/dine360_theme_chennora/static/src/img/about-leaves.png" class="footer-accent-left d-none d-lg-block" alt=""/>
<img src="/dine360_theme_chennora/static/src/img/gallery-2.png" class="footer-accent-right d-none d-lg-block" alt=""/>
<div class="footer-copyright-bar">
Copyright 2026 @ Chennora. Powered by MetatronCube. All Right Reserved.
</div>
</section>
</div>
</footer>
</xpath>
<xpath expr="//div[@id='wrapwrap']" position="after">
@ -146,7 +180,7 @@
'analytics_storage': 'denied',
});
gtag('js', new Date());
gtag('config', '&lt;t t-esc="website.google_analytics_key"/&gt;');
gtag('config', '<t t-esc="website.google_analytics_key"/>');
function allConsentsGranted() {
gtag('consent', 'update', {
'ad_storage': 'granted',
@ -172,12 +206,9 @@
</t>
</xpath>
<!-- Page options -->
<xpath expr="//div[@id='wrapwrap']" position="before">
<t groups="website.group_website_restricted_editor">
<t t-foreach="['header_overlay', 'header_color', 'header_text_color', 'header_visible', 'footer_visible']" t-as="optionName">
<!-- Firefox autocomplete is too aggressive and works on hidden inputs,
so we need to disable it (https://bugzilla.mozilla.org/show_bug.cgi?id=520561) -->
<input t-if="main_object and optionName in main_object" type="hidden" class="o_page_option_data" autocomplete="off" t-att-name="optionName" t-att-value="main_object[optionName]"/>
</t>
</t>
@ -191,39 +222,19 @@
<t t-set="header_text_color_is_class" t-value="'text-' in header_text_color"/>
<t t-set="header_text_color_class" t-value="header_text_color_is_class and header_text_color or ''"/>
<t t-set="header_text_color_style" t-value="(not header_text_color_is_class) and header_text_color or ''"/>
<div groups="base.group_user" class="o_frontend_to_backend_nav position-fixed d-none">
<svg xmlns="http://www.w3.org/2000/svg" class="o_frontend_to_backend_icon position-absolute" width="24px" height="24px" viewBox="-7 -7 24 24" preserveAspectRatio="xMinYMin">
<path fill="#FFF" d="M8 8V1a1 1 0 1 1 2 0v8a1 1 0 0 1-1 1H1a1 1 0 1 1 0-2h7z"/>
</svg>
<div class="o_frontend_to_backend_buttons d-flex">
<a href="#" title="Go to your Odoo Apps" class="o_frontend_to_backend_apps_btn fa fa-th d-flex align-items-center justify-content-center text-decoration-none" data-bs-toggle="dropdown"/>
<div class="dropdown-menu o_frontend_to_backend_apps_menu" role="menu">
<a role="menuitem" class="dropdown-item" t-esc="menu['name']" t-as="menu" t-foreach="env['ir.ui.menu'].with_context(force_action=True).load_menus_root()['children']" t-attf-href="/web#menu_id=#{menu['id']}&amp;action=#{menu['action'] and menu['action'].split(',')[1] or ''}"/>
</div>
<a groups="website.group_website_restricted_editor" href="#" title="Edit this content" class="o_frontend_to_backend_edit_btn px-3 d-flex align-items-center justify-content-center text-decoration-none">
<img src="/website/static/description/icon.png" alt=""/>Editor
</a>
</div>
</div>
</xpath>
<xpath expr="//div[@id='wrapwrap']" position="attributes">
<attribute name="t-attf-class" add="#{'o_header_overlay' if main_object and 'header_overlay' in main_object and main_object.header_overlay else ''}" separator=" "/>
</xpath>
<xpath expr="//header" position="attributes">
<attribute name="t-attf-class" add="#{header_bg_color_class}" separator=" "/>
<attribute name="t-attf-style" add="#{header_bg_color_style and ('background-color: %s;' % header_bg_color_style)}" separator=" "/>
<attribute name="t-attf-class" add="#{header_text_color_class}" separator=" "/>
<attribute name="t-attf-style" add="#{header_text_color_style and ('color: %s;' % header_text_color_style)}" separator=" "/>
<attribute name="t-attf-class" add="#{header_bg_color_class} #{header_text_color_class}" separator=" "/>
<attribute name="t-attf-style" add="#{header_bg_color_style and ('background-color: %s;' % header_bg_color_style)} #{header_text_color_style and ('color: %s;' % header_text_color_style)}" separator=" "/>
</xpath>
<xpath expr="//header" position="attributes">
<attribute name="t-attf-class" add="#{'d-none o_snippet_invisible' if main_object and 'header_visible' in main_object and not main_object.header_visible else ''}" separator=" "/>
<attribute name="t-att-data-invisible">'1' if main_object and 'header_visible' in main_object and not main_object.header_visible else None</attribute>
</xpath>
<xpath expr="//footer[@id='bottom']" position="attributes">
<attribute name="t-attf-class" add="#{'d-none o_snippet_invisible' if main_object and 'footer_visible' in main_object and not main_object.footer_visible else ''}" separator=" "/>
<attribute name="t-att-data-invisible">'1' if main_object and 'footer_visible' in main_object and not main_object.footer_visible else None</attribute>
</xpath>
</template>
</data>
</odoo>