NextERP/design-themes
2
0
Fork 0
mirror of https://github.com/odoo/design-themes.git synced 2025-10-07 01:18:52 +07:00
Code Issues Packages Projects Releases Wiki Activity

[IMP] theme_paptic: theme improvement

Browse Source 
Revamp of `theme_paptic`

task-4178088

closes odoo/design-themes#934

Signed-off-by: Benoit Socias (bso) <bso@odoo.com>
This commit is contained in:
Antoine (anso)
2024-09-25 09:02:17 +02:00
parent fa220d0170
commit 971b323f58
19 changed files with 1125 additions and 1209 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme_paptic/views/customizations.xml
+85 -135
View File
@@ -6,7 +6,7 @@
<!-- ==== Headers ===== -->
<template id="header_shadow" inherit_id="website.template_header_default" name="Paptic Header Shadow">
<xpath expr="//t[@t-set='_navbar_classes']" position="attributes">
<attribute name="class" remove="shadow-sm" separator=" "/>
<attribute name="t-valuef" remove="shadow-sm" separator=" "/>
</xpath>
</template>
@@ -14,122 +14,76 @@
<!-- ==== Cover ===== -->
<template id="s_cover" inherit_id="website.s_cover" name="Paptic s_cover">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="pb0 pt192" remove="pt232 pb232 bg-black-50 s_parallax_is_fixed s_parallax" separator=" "/>
<attribute name="data-scroll-background-ratio">0</attribute>
<attribute name="class" add="o_cc1 pt80 pb56" remove="o_cc5 pt232 pb232" separator=" "/>
</xpath>
<!-- Enable SVG dynamic color functionality -->
<xpath expr="//span[hasclass('oe_img_bg')]" position="attributes">
<attribute name="style"
add="background-image:url('/web_editor/shape/theme_paptic/s_cover.svg?c1=rgba%28255%2C+255%2C+255%2C+0.17%29');"
remove="background-image: url('/web/image/website.s_cover_default_image');"
separator=";"/>
</xpath>
<!-- Remove image -->
<xpath expr="//span[hasclass('oe_img_bg')]" position="replace"/>
<!-- Remove color filter -->
<xpath expr="//div[hasclass('o_we_bg_filter')]" position="replace"/>
<xpath expr="//h1" position="replace">
<h1>Grow your Business.<br/>Optimize your time.</h1>
<h1 class="display-3-fs">Plan, build, deliver insane value</h1>
</xpath>
<xpath expr="//p" position="replace">
<p>&#160;</p>
<p class="lead" style="text-align: left;"><br/>Offering tailored strategies to drive growth and success.</p>
</xpath>
<xpath expr="//p[2]" position="replace">
<p>
<a href="#" class="btn btn-lg btn-primary mb-2">START NOW</a>&#160;&#160;&#160;&#160;
<a t-att-href="cta_btn_href" class="btn btn-lg btn-secondary mb-2"><t t-esc="cta_btn_text and cta_btn_text.upper()">SCHEDULE A DEMO</t></a>
<br/>
<a href="#" class="btn btn-lg btn-primary">Our solutions</a>
</p>
</xpath>
<!-- Create Structure -->
<xpath expr="//div[hasclass('container')]" position="inside">
<div class="row">
<div class="o_colored_level col-lg-6"/>
<div class="o_colored_level col-lg-6">
<img src="/web_editor/shape/theme_paptic/s_cover_person.svg?c1=o-color-1" style="width: 100%;" alt="Man waiting at the airport"/>
<div class="o_colored_level col-lg-5 pt32"/>
<div class="o_colored_level col-lg-6 offset-lg-1">
<img class="img img-fluid" src="/web_editor/shape/theme_paptic/s_cover.svg?c1=o-color-1&amp;c2=o-color-2"/>
</div>
</div>
</xpath>
<xpath expr="//div[hasclass('col-lg-6')]" position="inside">
<xpath expr="//div[hasclass('col-lg-5')]" position="inside">
<xpath expr="//div[hasclass('container')]/h1" position="move"/>
<xpath expr="//div[hasclass('container')]/p" position="move"/>
<xpath expr="//div[hasclass('container')]/p" position="move"/>
</xpath>
</template>
<template id="configurator_s_cover" inherit_id="website.configurator_s_cover" name="Paptic s_cover">
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/04","flip":["x"]}</attribute>
</xpath>
<xpath expr="//section/div" position="before">
<div class="o_we_shape o_web_editor_Blocks_04" style="background-image: url('/web_editor/shape/web_editor/Blocks/04.svg?c1=o-color-1&amp;c2=o-color-2&amp;c3=o-color-4&amp;c5=o-color-5&amp;flip=x'); background-position: 50% 100%;"/>
</xpath>
</template>
<!-- ==== Image-Text ===== -->
<template id="s_image_text" inherit_id="website.s_image_text" name="Paptic s_image_text">
<xpath expr="//section" position="attributes">
<attribute name="class" add="pt160 pb16 o_cc o_cc3" remove="pt80 pb80" separator=" "/>
</xpath>
<xpath expr="//img" position="attributes">
<attribute name="src">/web_editor/shape/theme_paptic/s_image_text.svg?c1=o-color-1</attribute>
<attribute name="src">/web_editor/shape/theme_paptic/s_image_text.svg?c1=o-color-1&amp;c2=o-color-2</attribute>
</xpath>
<xpath expr="//h2" position="replace" mode="inner">
<font style="background-image: linear-gradient(135deg, var(--o-color-1) 0%, var(--o-color-3) 100%);" class="text-gradient">Help you grow</font>
</xpath>
<xpath expr="//h2" position="after">
<p>&#160;</p>
<xpath expr="//h2" position="replace">
<h2>Top quality code</h2>
</xpath>
<xpath expr="//p[2]" position="replace">
<h5>Always Improving</h5>
<p>Thanks to our running release system, benefit from all updates (security and new features) in real time.</p>
</xpath>
<xpath expr="//p[3]" position="replace">
<p>&#160;</p>
<h5>Scalable and Modular</h5>
<p>Whether you start small or are already a large company, our solution adapts to your needs and grows with you.</p>
<div class="s_hr pb16 pt8" data-snippet="s_hr" data-name="Separator">
<hr class="w-100 mx-auto" style="border-top-color: rgb(233, 236, 239) !important; border-top-width: 3px !important;"/>
</div>
<xpath expr="//p" position="replace" mode="inner">
<p><br/>Our code is built for performance, scalability, and reliability. With meticulous attention to detail, we create clean, maintainable, and efficient solutions that power your business forward.</p>
</xpath>
<xpath expr="//a[hasclass('btn')]" position="replace">
<a href="#" class="btn btn-link">DISCOVER MORE &#160;<i class="fa fa-chevron-right"/></a>
</xpath>
<xpath expr="//img" position="attributes">
<attribute name="class" add="pull-right" remove="img-fluid" separator=" "/>
</xpath>
</template>
<template id="configurator_s_image_text" inherit_id="website.configurator_s_image_text" name="Paptic s_image_text">
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/02_001","flip":["y"]}</attribute>
</xpath>
<xpath expr="//section/div" position="before">
<div class="o_we_shape o_web_editor_Origins_02_001" style="background-image: url('/web_editor/shape/web_editor/Origins/02_001.svg?c4=o-color-4&amp;c5=o-color-2&amp;flip=y'); background-position: 50% 0%;"></div>
</xpath>
<xpath expr="//a" position="replace"/>
</template>
<!-- ==== Text-Image ===== -->
<template id="s_text_image" inherit_id="website.s_text_image" name="Paptic s_text_image">
<xpath expr="//section" position="attributes">
<attribute name="class" add="pb88 o_cc o_cc3" remove="pb80" separator=" "/>
</xpath>
<xpath expr="//img" position="attributes">
<attribute name="src">/web_editor/shape/theme_paptic/s_text_image.svg?c1=o-color-1</attribute>
<attribute name="src">/web_editor/shape/theme_paptic/s_text_image.svg?c1=o-color-1&amp;c2=o-color-2</attribute>
</xpath>
<xpath expr="//h2" position="replace" mode="inner">
<font style="background-image: linear-gradient(135deg, var(--o-color-1) 0%, var(--o-color-3) 100%);" class="text-gradient">A Section Subtitle</font>
<xpath expr="//h2" position="replace">
<h2>Communication is key!</h2>
</xpath>
<xpath expr="//p" position="replace" mode="inner">
<p><br/>Clear, consistent communication drives success. We prioritize open dialogue, ensuring alignment with your goals and seamless collaboration throughout every project.</p>
</xpath>
<xpath expr="//a" position="replace"/>
</template>
<!-- ==== Showcase ===== -->
@@ -229,6 +183,9 @@
<!-- ==== References ===== -->
<template id="s_references" inherit_id="website.s_references" name="Paptic s_references">
<xpath expr="//section" position="attributes">
<attribute name="class" remove="pt80 pb80" separator=" "/>
</xpath>
<xpath expr="//div[hasclass('col-lg-12')]" position="replace"/>
</template>
@@ -238,13 +195,13 @@
<attribute name="class" remove="pt32 pb32 o_cc2" add="pt120 pb120 o_cc3" separator=" "/>
</xpath>
<xpath expr="//div[hasclass('row')]" position="before">
<h3 style="text-align: center;"><font style="background-image: linear-gradient(135deg, var(--o-color-1) 0%, var(--o-color-3) 100%);" class="text-gradient">SUCCESS STORIES</font></h3>
<h2 style="text-align: center;">Success Stories</h2>
<p>&#160;</p>
</xpath>
<!-- Card #1 -->
<xpath expr="//div[hasclass('card')]" position="attributes">
<attribute name="style" add="border-width: 0px !important; box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.05) !important;" separator=";"/>
<attribute name="style" add="border-width: 0px !important;" separator=";"/>
</xpath>
<!-- Card #1 - Title & text -->
<xpath expr="//h5[hasclass('card-title')]" position="replace" mode="inner">
@@ -263,7 +220,7 @@
<!-- Card #2 -->
<xpath expr="(//div[hasclass('card')])[2]" position="attributes">
<attribute name="style" add="border-width: 0px !important; box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.05) !important;" separator=";"/>
<attribute name="style" add="border-width: 0px !important;" separator=";"/>
</xpath>
<!-- Card #2 - Title & text -->
<xpath expr="(//h5[hasclass('card-title')])[2]" position="replace" mode="inner">
@@ -282,7 +239,7 @@
<!-- Card #3 -->
<xpath expr="(//div[hasclass('card')])[3]" position="attributes">
<attribute name="style" add="border-width: 0px !important; box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.05) !important;" separator=";"/>
<attribute name="style" add="border-width: 0px !important;" separator=";"/>
</xpath>
<!-- Card #3 - Title & text -->
<xpath expr="(//h5[hasclass('card-title')])[3]" position="replace" mode="inner">
@@ -300,22 +257,13 @@
</xpath>
</template>
<template id="configurator_s_three_columns" inherit_id="website.configurator_s_three_columns" name="Paptic s_three_columns">
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/02_001","flip":[]}</attribute>
</xpath>
<xpath expr="//section/div" position="before">
<div class="o_we_shape o_web_editor_Origins_02_001"></div>
</xpath>
</template>
<!-- ==== Picture ===== -->
<template id="s_picture" inherit_id="website.s_picture" name="Paptic s_picture">
<xpath expr="//section" position="attributes">
<attribute name="class" add="pt72 o_cc1" remove="pt64" separator=" "/>
</xpath>
<xpath expr="//img" position="attributes">
<attribute name="src">/web_editor/shape/theme_paptic/s_picture.svg?c1=o-color-1</attribute>
<attribute name="src">/web_editor/shape/theme_paptic/s_picture.svg?c1=o-color-1&amp;c2=o-color-2</attribute>
</xpath>
</template>
@@ -331,17 +279,6 @@
</xpath>
</template>
<!-- ==== Comparisons ===== -->
<template id="s_comparisons" inherit_id="website.s_comparisons" name="Paptic s_comparisons">
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Floats/03","flip":[]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Floats_03"/>
</xpath>
</template>
<!-- ==== Call to action ===== -->
<template id="s_call_to_action" inherit_id="website.s_call_to_action" name="Paptic s_call_to_action">
<xpath expr="//section" position="attributes">
@@ -357,19 +294,25 @@
<template id="s_cta_box" inherit_id="website.s_cta_box">
<!-- Card -->
<xpath expr="//div[hasclass('card')]" position="attributes">
<attribute name="class" add="o_cc5" remove="o_cc4" separator=" "/>
<attribute name="class" add="flex-lg-row" remove="flex-lg-row-reverse" separator=" "/>
<attribute name="style" add="border-radius: 24px !important; -card-img-size-h: 33.33333%;" separator=";"/>
</xpath>
<!-- Title -->
<xpath expr="//h2" position="replace" mode="inner">
Leverage your processes
Join our tech team for innovation<br/>and growth!
</xpath>
<!-- Paragraphs -->
<xpath expr="//p" position="replace" mode="inner">
See how we can help<br/><br/>
Join our dynamic tech team focused on innovation and growth.<br/><br/>
</xpath>
<!-- Figure -->
<xpath expr="//figure" position="attributes">
<attribute name="class" remove="ratio ratio-1x1" separator=" "/>
</xpath>
<!-- Image -->
<xpath expr="//img" position="attributes">
<attribute name="src">/theme_paptic/static/src/img/pictures/s_banner_2.jpg</attribute>
<attribute name="src">/web_editor/shape/theme_paptic/s_cta_box.svg?c1=o-color-1&amp;c2=o-color-2</attribute>
<attribute name="style">padding: 40px;</attribute>
</xpath>
<!-- Button -->
<xpath expr="//a[hasclass('btn')]" position="replace" mode="inner">
@@ -377,33 +320,15 @@
</xpath>
</template>
<template id="configurator_s_call_to_action" inherit_id="website.configurator_s_call_to_action" name="Paptic s_call_to_action">
<!-- Shape option -->
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/12_001","flip":["y"]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Airy_12_001" style="background-image: url('/web_editor/shape/web_editor/Airy/12_001.svg?c1=o-color-5&amp;c3=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
</xpath>
</template>
<!-- ==== Banner ===== -->
<template id="s_banner" inherit_id="website.s_banner" name="Paptic s_banner">
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc5" separator=" "/>
</xpath>
</template>
<!-- ==== Numbers ===== -->
<template id="s_numbers" inherit_id="website.s_numbers" name="Paptic s_numbers">
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc4" remove="o_cc1" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/01_001","flip":[]}</attribute>
<attribute name="class" add="o_cc5" remove="o_cc1" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/06","flip":[]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Blocks_01_001"/>
<div class="o_we_shape o_web_editor_Blobs_06"/>
</xpath>
</template>
@@ -412,18 +337,10 @@
<!-- Left column -->
<xpath expr="//div[hasclass('col-lg-6')]" position="attributes">
<attribute name="class" add="o_cc3 text-center" remove="o_cc4" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/03","flip":["y"]}</attribute>
</xpath>
<xpath expr="//div[hasclass('col-lg-6')]/h2" position="before">
<div class="o_we_shape o_web_editor_Blocks_03" style="background-image: url('/web_editor/shape/web_editor/Blocks/03.svg?c1=o-color-1&amp;c4=o-color-4&amp;flip=y'); background-position: 50% 0%"/>
</xpath>
<!-- Right column -->
<xpath expr="//div[hasclass('col-lg-6')][2]" position="attributes">
<attribute name="class" add="o_cc3 text-center" remove="o_cc5" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/03","flip":["x","y"]}</attribute>
</xpath>
<xpath expr="//div[hasclass('col-lg-6')][2]/h2" position="before">
<div class="o_we_shape o_web_editor_Blocks_03" style="background-image: url('/web_editor/shape/web_editor/Blocks/03.svg?c1=o-color-1&amp;c4=o-color-4&amp;flip=xy'); background-position: 50% 0%"/>
</xpath>
</template>
@@ -485,12 +402,11 @@
<template id="s_product_catalog" inherit_id="website.s_product_catalog" name="Paptic s_product_catalog">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc3" separator=" "/>
<attribute name="class" add="o_cc o_cc5" separator=" "/>
</xpath>
<!-- Filter -->
<xpath expr="//div[hasclass('o_we_bg_filter')]" position="attributes">
<attribute name="class" remove="bg-white-85" separator=" "/>
<attribute name="style">background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.75) 0%, rgba(178, 255, 218, 1) 100%);</attribute>
<attribute name="class" remove="bg-white-85" add="bg-black-85" separator=" "/>
</xpath>
</template>
@@ -749,13 +665,13 @@
<template id="s_big_number" inherit_id="website.s_big_number">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/03"}</attribute>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/18"}</attribute>
<attribute name="class" add="o_cc4" remove="o_cc5" separator=" "/>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('o_we_shape')]" position="replace">
<div class="o_we_shape o_web_editor_Wavy_03"/>
<div class="o_we_shape o_web_editor_Wavy_18"/>
</xpath>
<!-- Text -->
@@ -828,4 +744,38 @@
</xpath>
</template>
<!-- ==== Masonry Block ===== -->
<template id="s_masonry_block" inherit_id="website.s_masonry_block">
<xpath expr="//t[@t-call='website.s_masonry_block_default_template']" position="replace">
<t t-call="website.s_masonry_block_images_template"/>
</xpath>
<xpath expr="//section" position="attributes">
<attribute name="data-masonry-template">images</attribute>
</xpath>
</template>
<template id="s_masonry_block_images_template" inherit_id="website.s_masonry_block_images_template">
<xpath expr="//div[hasclass('row')]" position="attributes">
<attribute name="data-row-count">11</attribute>
</xpath>
<!-- Block 1 -->
<xpath expr="(//div[hasclass('o_grid_item')])[1]" position="attributes">
<attribute name="class" remove="oe_img_bg o_bg_img_center o_cc5 g-height-10 shadow" add="o_cc2 g-height-11" separator=" "/>
<attribute name="style">z-index: 1; grid-area: 1 / 1 / 12 / 7; --grid-item-padding-y: 48px; --grid-item-padding-x: 48px;</attribute>
</xpath>
<xpath expr="(//div[hasclass('o_grid_item')])[1]/div[hasclass('o_we_bg_filter')]" position="replace"/>
<xpath expr="(//div[hasclass('o_grid_item')])[1]/p" position="after">
<img class="img img-fluid" src="/web_editor/shape/theme_paptic/s_masonry_block_1.svg?c1=o-color-1&amp;c2=o-color-2"/>
</xpath>
<!-- Block 2 -->
<xpath expr="(//div[hasclass('o_grid_item')])[2]" position="attributes">
<attribute name="class" remove="oe_img_bg o_bg_img_center o_cc5 g-height-10 shadow" add="o_cc2 g-height-11" separator=" "/>
<attribute name="style">z-index: 2; grid-area: 1 / 7 / 12 / 13; --grid-item-padding-y: 48px; --grid-item-padding-x: 48px;</attribute>
</xpath>
<xpath expr="(//div[hasclass('o_grid_item')])[2]/div[hasclass('o_we_bg_filter')]" position="replace"/>
<xpath expr="(//div[hasclass('o_grid_item')])[2]/p" position="after">
<img class="img img-fluid" src="/web_editor/shape/theme_paptic/s_masonry_block_2.svg?c1=o-color-1&amp;c2=o-color-2"/>
</xpath>
</template>
</odoo>