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_clean: improve theme

Browse Source 
task-4178066
Part of task-4177975

closes odoo/design-themes#929

Signed-off-by: Serge Bayet (seba) <seba@odoo.com>
This commit is contained in:
Xavier Luyckx (xlu)
2024-09-20 09:16:53 +02:00
parent 0bb5f6c93e
commit c31b3c7c83
18 changed files with 350 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme_clean/__manifest__.py
+9 -8
View File
@@ -12,6 +12,9 @@
'views/image_content.xml',
'views/snippets/s_cta_box.xml',
'views/snippets/s_cta_card.xml',
'views/snippets/s_accordion_image.xml',
'views/snippets/s_banner.xml',
'views/snippets/s_cover.xml',
'views/snippets/s_striped_top.xml',
'views/snippets/s_card_offset.xml',
@@ -19,6 +22,7 @@
'views/snippets/s_text_image.xml',
'views/snippets/s_three_columns.xml',
'views/snippets/s_call_to_action.xml',
'views/snippets/s_company_team.xml',
'views/snippets/s_title.xml',
'views/snippets/s_features.xml',
'views/snippets/s_numbers.xml',
@@ -30,6 +34,7 @@
'views/snippets/s_product_catalog.xml',
'views/snippets/s_quotes_carousel.xml',
'views/snippets/s_unveil.xml',
'views/snippets/s_numbers_showcase.xml',
'views/snippets/s_key_benefits.xml',
'views/snippets/s_pricelist_boxed.xml',
'views/snippets/s_striped_center_top.xml',
@@ -46,17 +51,13 @@
'static/description/clean_screenshot.jpg',
],
'images_preview_theme': {
'website.s_cover_default_image': '/theme_clean/static/src/img/backgrounds/bg_snippet_09.jpg',
'website.s_text_image_default_image': '/theme_clean/static/src/img/content/image_content_19.jpg',
'website.s_image_text_default_image': '/theme_clean/static/src/img/content/image_content_20.jpg',
'website.s_banner_default_image': '/theme_clean/static/src/img/backgrounds/bg_snippet_07.jpg',
'website.s_carousel_default_image_1': '/theme_clean/static/src/img/content/image_content_25.jpg',
'website.s_three_columns_default_image_1': '/theme_clean/static/src/img/content/image_content_22.jpg',
'website.s_three_columns_default_image_2': '/theme_clean/static/src/img/content/image_content_23.jpg',
'website.s_three_columns_default_image_3': '/theme_clean/static/src/img/content/image_content_24.jpg',
'website.s_text_image_default_image': '/theme_clean/static/src/img/content/image_content_19.jpg',
'website.s_picture_default_image': '/theme_clean/static/src/img/content/image_content_21.jpg',
},
'configurator_snippets': {
'homepage': ['s_cover', 's_text_image', 's_title', 's_features', 's_carousel', 's_numbers',
's_three_columns', 's_call_to_action'],
'homepage': ['s_banner', 's_color_blocks_2', 's_title', 's_text_image', 's_image_text', 's_numbers_showcase', 's_company_team', 's_accordion_image', 's_cta_card'],
},
'license': 'LGPL-3',
'live_test_url': 'https://theme-clean.odoo.com',
theme_clean/models/theme_clean.py
+1 -4
View File
@@ -5,8 +5,5 @@ class ThemeClean(models.AbstractModel):
_inherit = 'theme.utils'
def _theme_clean_post_copy(self, mod):
self.enable_view('website.template_header_hamburger')
self.enable_view('website.template_header_hamburger_align_right')
self.enable_view('website.no_autohide_menu')
self.enable_view('website.template_header_default')
self.enable_view('website.template_footer_contact')
theme_clean/static/description/clean_description.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 72 KiB

After

Width:  |  Height:  |  Size: 35 KiB

theme_clean/static/description/clean_screenshot.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 171 KiB

After

Width:  |  Height:  |  Size: 135 KiB

theme_clean/static/description/theme_clean.svg
+204 -252
View File
File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 113 KiB

After

Width:  |  Height:  |  Size: 32 KiB

theme_clean/static/src/js/tour.js
+24 -22
View File
@@ -1,17 +1,16 @@
/** @odoo-module */
import * as wTourUtils from '@website/js/tours/tour_utils';
import { _t } from "@web/core/l10n/translation";
const snippets = [
{
id: 's_cover',
name: 'Cover',
id: 's_banner',
name: 'Banner',
groupName: "Intro",
},
{
id: 's_text_image',
name: 'Text - Image',
id: 's_color_blocks_2',
name: 'Big Boxes',
groupName: "Content",
},
{
@@ -20,28 +19,33 @@ const snippets = [
groupName: "Text",
},
{
id: 's_features',
name: 'Features',
id: 's_text_image',
name: 'Text - Image',
groupName: "Content",
},
{
id: 's_carousel',
name: 'Carousel',
groupName: "Intro",
},
{
id: 's_numbers',
name: 'Numbers',
id: 's_image_text',
name: 'Image - Text',
groupName: "Content",
},
{
id: 's_three_columns',
name: 'Columns',
groupName: "Columns",
id: 's_numbers_showcase',
name: 'Numbers Showcase',
groupName: "Content",
},
{
id: 's_call_to_action',
name: 'Call to Action',
id: 's_company_team',
name: 'Team',
groupName: "People",
},
{
id: 's_accordion_image',
name: 'Accordion Image',
groupName: "Content",
},
{
id: 's_cta_card',
name: 'Card Call to Action',
groupName: "Content",
},
];
@@ -54,11 +58,9 @@ wTourUtils.registerThemeHomepageTour("clean_tour", () => [
...wTourUtils.dragNDrop(snippets[1]),
...wTourUtils.dragNDrop(snippets[2]),
...wTourUtils.dragNDrop(snippets[3]),
...wTourUtils.clickOnSnippet(snippets[3]),
wTourUtils.changeOption('ContainerWidth', 'we-button-group.o_we_user_value_widget', _t('width')),
wTourUtils.goBackToBlocks(),
...wTourUtils.dragNDrop(snippets[4]),
...wTourUtils.dragNDrop(snippets[5]),
...wTourUtils.dragNDrop(snippets[6]),
...wTourUtils.dragNDrop(snippets[7]),
...wTourUtils.dragNDrop(snippets[8]),
]);
theme_clean/static/src/scss/primary_variables.scss
+11 -49
View File
@@ -117,9 +117,13 @@ $o-theme-font-configs: (
'family': ('Ubuntu', sans-serif),
'url': 'Ubuntu:300,300i,400,400i,700,700i',
),
'Bitter': (
'family': ('Bitter', serif),
'url': 'Bitter:300,300i,400,400i,700,700i',
'IBM Plex Sans': (
'family': ('IBM Plex Sans', sans-serif),
'url': 'IBM+Plex+Sans:300,300i,400,400i,700,700i',
),
'Inter': (
'family': ('Inter', sans-serif),
'url': 'Inter:300,300i,400,400i,700,700i',
),
'Noto Serif': ( // font update - Droid Serif -> Noto+Serif
'family': ('Noto Serif', serif),
@@ -145,46 +149,6 @@ $o-theme-font-configs: (
'family': ('Josefin Slab', serif),
'url': 'Josefin+Slab:300,300i,400,400i,700,700i',
),
'Abel': (
'family': ('Abel', sans-serif),
'url': 'Abel:300,300i,400,400i,700,700i',
),
'Mulish': (
'family': ('Mulish', sans-serif),
'url': 'Mulish:300,300i,400,400i,700,700i',
),
'Libre Baskerville': (
'family': ('Libre Baskerville', serif),
'url': 'Libre+Baskerville:300,300i,400,400i,700,700i',
),
'Medula One': (
'family': ('Medula One', cursive),
'url': 'Medula+One:300,300i,400,400i,700,700i',
),
'Montserrat Alternates': (
'family': ('Montserrat Alternates', sans-serif),
'url': 'Montserrat+Alternates:300,300i,400,400i,700,700i',
),
'Imprima': (
'family': ('Imprima', sans-serif),
'url': 'Imprima:300,300i,400,400i,700,700i',
),
'Oswald': (
'family': ('Oswald', sans-serif),
'url': 'Oswald:300,300i,400,400i,700,700i',
),
'Quattrocento': (
'family': ('Quattrocento', serif),
'url': 'Quattrocento:300,300i,400,400i,700,700i',
),
'Vollkorn': (
'family': ('Vollkorn', serif),
'url': 'Vollkorn:300,300i,400,400i,700,700i',
),
'Alice': (
'family': ('Alice', serif),
'url': 'Alice:300,300i,400,400i,700,700i',
),
);
//------------------------------------------------------------------------------
@@ -194,12 +158,10 @@ $o-theme-font-configs: (
$o-website-values-palettes: (
(
'color-palettes-name': 'clean-1',
'headings-font': 'Dosis',
'navbar-font': 'Dosis',
'buttons-font': 'Dosis',
'header-template': 'hamburger',
'hamburger-position': 'right',
'footer-template': 'contact',
'headings-font': 'IBM Plex Sans',
'navbar-font': 'Inter',
'buttons-font': 'Inter',
'header-template': 'default',
),
);
theme_clean/views/image_content.xml
+1 -1
View File
@@ -10,7 +10,7 @@
<record id="s_banner_default_image_2" model="theme.ir.attachment">
<field name="key">website.s_banner_default_image_2</field>
<field name="name">website.s_banner_default_image_2</field>
<field name="url">/theme_clean/static/src/img/backgrounds/bg_snippet_12.jpg</field>
<field name="url">/theme_clean/static/src/img/content/image_content_27.jpg</field>
</record>
<record id="s_banner_default_image_3" model="theme.ir.attachment">
<field name="key">website.s_banner_default_image_3</field>
theme_clean/views/snippets/s_accordion_image.xml
+11
View File
@@ -0,0 +1,11 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="s_accordion_image" inherit_id="website.s_accordion_image">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc1" remove="o_cc2" separator=" "/>
</xpath>
</template>
</odoo>
theme_clean/views/snippets/s_banner.xml
+27
View File
@@ -0,0 +1,27 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="s_banner" inherit_id="website.s_banner">
<!-- Text -->
<xpath expr="//h1" position="replace">
<h1 class="display-3 o_default_snippet_text">Unleash your <strong class="o_default_snippet_text"><span class="o_text_highlight o_translate_inline o_text_highlight_circle_2 o_text_highlight_fill" style="--text-highlight-width: 6px;"><span class="o_text_highlight_item">potential<svg fill="none" class="o_text_highlight_svg o_content_no_merge position-absolute overflow-visible top-0 start-0 w-100 h-100 pe-none"><path stroke-width="var(--text-highlight-width)" stroke="var(--text-highlight-color)" stroke-linecap="round" fill="var(--text-highlight-color)" transform="scale(1.2835546875, 0.6916666666666667)" d="M112.58 21.164h18.516c-.478-.176-1.722-.64-2.967-1.105.101-.401.214-.803.315-1.192 12.255 2.912 24.561 5.573 36.716 8.823 5.896 1.582 11.628 3.967 17.171 6.527 10.433 4.832 14.418 14.22 16.479 24.739.377 1.92.566 3.878.83 5.823 2.212 15.94-5.858 23.986-21.595 33.813-.993.615-2.288.79-3.181 1.494-14.229 11.308-31.412 14.32-48.608 17.107-29.01 4.694-57.431 2.209-84.91-8.372-8.145-3.138-16.164-6.853-23.706-11.22C6.176 90.986 1.16 80.053.193 67.25c-1.798-23.809 9.025-42.485 30.356-53.304C44.678 6.793 59.8 3.367 75.45 2.375 90.583 1.42 105.793.379 120.927.78c16.089.427 32.041 3.05 46.911 9.84 2.074.941 3.67 2.912 4.915 5.083-9.73-1.443-19.433-2.987-29.175-4.305-4.89-.665-9.842-1.067-14.77-1.33-23.82-1.28-47.376.514-70.391 7.003a133.771 133.771 0 0 0-22.639 8.648c-17.9 8.786-27.616 26.935-25.567 46.364.666 6.263 3.507 11.133 9.05 14.308 26.862 15.401 55.748 21.965 86.645 19.819 15.561-1.08 31.01-2.787 45.767-8.284 11.099-4.142 21.658-9.25 30.595-17.195 9.779-8.698 11.715-18.55 5.669-30.249-1.131-2.196-3.256-4.079-5.33-5.56-7.981-5.736-17.773-7.48-26.459-11.534-13.249-6.175-27.541-6.916-41.343-10.167-.817-.188-1.571-.64-2.35-.966.037-.364.088-.728.125-1.092Z" class="o_text_highlight_path_circle_2"></path></svg></span></span>.</strong></h1>
</xpath>
<!-- Remove panels -->
<xpath expr="(//div[hasclass('o_grid_item_image')])[2]" position="replace"/>
<xpath expr="//div[hasclass('col-lg-5')]" position="replace"/>
<!-- Image Layout -->
<xpath expr="//div[hasclass('o_grid_item_image')]" position="attributes">
<attribute name="class" add="g-col-lg-6 col-lg-6" remove="o_grid_item g-col-lg-4 col-lg-4" separator=" "/>
<attribute name="style" add="grid-area: 1 / 7 / 11 / 13;" remove="grid-area: 1 / 8 / 11 / 12;" separator=" "/>
</xpath>
<!-- Img -->
<xpath expr="//img" position="attributes">
<attribute name="src">/web_editor/image_shape/website.s_banner_default_image_2/web_editor/composition/composition_oval_line.svg?c2=o-color-2</attribute>
<attribute name="data-shape">web_editor/composition/composition_oval_line</attribute>
<attribute name="data-original-mimetype">image/jpeg</attribute>
<attribute name="data-file-name">s_banner_2.svg</attribute>
<attribute name="data-shape-colors">;#34495E;;;</attribute>
</xpath>
</template>
</odoo>
theme_clean/views/snippets/s_call_to_action.xml
-11
View File
@@ -18,15 +18,4 @@
</xpath>
</template>
<template id="configurator_s_call_to_action" inherit_id="website.configurator_s_call_to_action">
<!-- Shape option -->
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001", "flip":["y"]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-4&amp;c4=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
</xpath>
</template>
</odoo>
theme_clean/views/snippets/s_color_blocks_2.xml
+9 -8
View File
@@ -3,21 +3,22 @@
<template id="s_color_blocks_2" inherit_id="website.s_color_blocks_2">
<!-- Column #1 -->
<xpath expr="//div[hasclass('col-lg-6')]" position="attributes">
<attribute name="class" add="oe_img_bg" separator=" "/>
<attribute name="style">background-image: url('/web/image/website.s_color_blocks_2_default_image_1');</attribute>
</xpath>
<xpath expr="//h2" position="before">
<div class="o_we_bg_filter bg-black-50"/>
<xpath expr="//div[hasclass('col-lg-6')]" position="replace">
<div class="col-lg-6 o_cc o_cc4">
<h2>We are committed to helping you achieve success with unparalleled support and expert guidance, every step of the way.</h2>
</div>
</xpath>
<!-- Column #2 -->
<xpath expr="//div[hasclass('col-lg-6')][2]" position="attributes">
<attribute name="class" add="oe_img_bg" separator=" "/>
<attribute name="class" add="oe_img_bg pt152 pb152" separator=" "/>
<attribute name="style">background-image: url('/web/image/website.s_color_blocks_2_default_image_2');</attribute>
</xpath>
<xpath expr="(//h2)[2]" position="before">
<xpath expr="//div[hasclass('col-lg-6')][2]" position="inside">
<div class="o_we_bg_filter bg-black-50"/>
</xpath>
<xpath expr="//div[hasclass('col-lg-6')][2]/h2" position="replace"/>
<xpath expr="//div[hasclass('col-lg-6')][2]/p" position="replace"/>
<xpath expr="//div[hasclass('col-lg-6')][2]/a" position="replace"/>
</template>
</odoo>
theme_clean/views/snippets/s_company_team.xml
+10
View File
@@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="configurator_s_company_team" inherit_id="website.configurator_s_company_team">
<xpath expr="//section" position="attributes">
<attribute name="class" add="pt0 pb16" remove="pt48 pb48" separator=" "/>
</xpath>
</template>
</odoo>
theme_clean/views/snippets/s_cta_card.xml
+12
View File
@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="s_cta_card" inherit_id="website.s_cta_card">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="pt48 pb56 o_cc3" remove="pt64 pb64 o_cc2" separator=" "/>
</xpath>
</template>
</odoo>
theme_clean/views/snippets/s_image_text.xml
+1 -1
View File
@@ -4,7 +4,7 @@
<template id="s_image_text" inherit_id="website.s_image_text">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc4 pt72 pb72" remove="pt80 pb80" separator=" "/>
<attribute name="class" add="o_cc o_cc1 pt48 pb72" remove="pt80 pb80" separator=" "/>
</xpath>
<!-- Add space after title -->
<xpath expr="//h2" position="after">
theme_clean/views/snippets/s_numbers_showcase.xml
+25
View File
@@ -0,0 +1,25 @@
<?xml version="1.0" encoding="utf-8"?>
<odoo>
<template id="s_numbers_showcase" inherit_id="website.s_numbers_showcase">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc4 pt88" remove="pt80" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","colors":{"c3": "#FFFFFF"},"flip":["y"]}</attribute>
</xpath>
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-4&amp;flip=y');"/>
</xpath>
<!-- Grid items -->
<xpath expr="(//div[hasclass('o_grid_item')])[2]" position="attributes">
<attribute name="class" add="o_cc1 rounded" remove="o_cc3" separator=" "/>
</xpath>
<xpath expr="(//div[hasclass('o_grid_item')])[3]" position="attributes">
<attribute name="class" add="rounded" separator=" "/>
</xpath>
<xpath expr="(//div[hasclass('o_grid_item')])[4]" position="attributes">
<attribute name="class" add="o_cc3 rounded" remove="o_cc4" separator=" "/>
</xpath>
</template>
</odoo>
theme_clean/views/snippets/s_text_image.xml
+1 -1
View File
@@ -4,7 +4,7 @@
<template id="s_text_image" inherit_id="website.s_text_image">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc2 pt72 pb72" remove="pt80 pb80" separator=" "/>
<attribute name="class" add="o_cc o_cc1 pt16 pb16" remove="pt80 pb80" separator=" "/>
</xpath>
<!-- Title & Paragraphs -->
<xpath expr="//h2" position="replace" mode="inner">
theme_clean/views/snippets/s_title.xml
+4 -18
View File
@@ -4,28 +4,14 @@
<template id="s_title" inherit_id="website.s_title">
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc5 o_full_screen_height parallax s_parallax_is_fixed" separator=" "/>
<attribute name="data-scroll-background-ratio">1</attribute>
</xpath>
<!-- Filter & background image -->
<xpath expr="//div[hasclass('container')]" position="before">
<span class="s_parallax_bg oe_img_bg" style="background-image: url('/web/image/website.s_banner_default_image');"/>
<div class="o_we_bg_filter bg-black-50"/>
<attribute name="class" remove="pt40" add="pt80" separator=" "/>
</xpath>
<!-- Title -->
<xpath expr="//h2" position="replace" mode="inner">
<b>We create the perfect <br/>tailored solution for you</b>
We create the perfect <br/>tailored solution for you
</xpath>
</template>
<template id="configurator_s_title" inherit_id="website.configurator_s_title">
<!-- Shape option -->
<xpath expr="//section" position="attributes">
<attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/07_002","flip":[]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Origins_07_002"/>
<xpath expr="//h2" position="attributes">
<attribute name="class" remove="display-3-fs" separator=" "/>
</xpath>
</template>