[IMP] theme_anelusia: revamp the theme

task-4177978
Part of task-4177975

closes odoo/design-themes#911

Signed-off-by: Serge Bayet (seba) <seba@odoo.com>

theme_anelusia/__manifest__.py

@@ -65,19 +65,20 @@
         'static/description/anelusia_screenshot.jpg',
     ],
     'images_preview_theme': {
-        'website.s_banner_default_image': '/theme_anelusia/static/src/img/snippets/s_banner.jpg',
         'website.library_image_10': '/theme_anelusia/static/src/img/snippets/library_image_03.jpg',
         'website.library_image_05': '/theme_anelusia/static/src/img/snippets/library_image_13.jpg',
         'website.library_image_08': '/theme_anelusia/static/src/img/snippets/library_image_14.jpg',
         'website.library_image_13': '/theme_anelusia/static/src/img/snippets/library_image_10.jpg',
         'website.library_image_03': '/theme_anelusia/static/src/img/snippets/library_image_05.jpg',
         'website.library_image_02': '/theme_anelusia/static/src/img/snippets/library_image_16.jpg',
+        'website.s_cover_default_image': '/theme_anelusia/static/src/img/snippets/s_cover.jpg',
         'website.s_media_list_default_image_1': '/theme_anelusia/static/src/img/snippets/s_media_list_1.jpg',
+        'website.s_image_text_default_image': '/theme_anelusia/static/src/img/snippets/s_image_text.jpg',
         'website.s_media_list_default_image_2': '/theme_anelusia/static/src/img/snippets/s_media_list_2.jpg',
+        'website.s_text_image_default_image': '/theme_anelusia/static/src/img/snippets/s_text_image.jpg',
     },
     'configurator_snippets': {
-        'homepage': ['s_text_cover', 's_images_wall', 's_color_blocks_2', 's_references',
+        'homepage': ['s_text_cover', 's_images_wall', 's_color_blocks_2', 's_references', 's_media_list','s_key_images', 's_call_to_action'],
-                     's_media_list', 's_company_team', 's_call_to_action'],
     },
     'license': 'LGPL-3',
     'live_test_url': 'https://theme-anelusia.odoo.com',

theme_anelusia/static/src/js/tour.js

@@ -29,9 +29,9 @@ const snippets = [
         groupName: "Content",
     },
     {
-        id: 's_company_team',
+        id: 's_key_images',
-        name: 'Team',
+        name: 'Key Images',
-        groupName: "People",
+        groupName: "Columns",
     },
     {
         id: 's_call_to_action',
@@ -41,18 +41,18 @@ const snippets = [
 ];
 
 wTourUtils.registerThemeHomepageTour("anelusia_tour", () => [
-    wTourUtils.assertCssVariable('--color-palettes-name', '"generic-17"'),
+    wTourUtils.assertCssVariable('--color-palettes-name', '"default-25"'),
     ...wTourUtils.dragNDrop(snippets[0]),
     ...wTourUtils.clickOnText(snippets[0], 'h1', 'top'),
     wTourUtils.goBackToBlocks(),
     ...wTourUtils.dragNDrop(snippets[1]),
     ...wTourUtils.dragNDrop(snippets[2], 'top'),
     ...wTourUtils.dragNDrop(snippets[3]),
-    ...wTourUtils.clickOnSnippet(snippets[3], 'top'),
+    ...wTourUtils.dragNDrop(snippets[4]),
+    ...wTourUtils.clickOnSnippet(snippets[4], 'top'),
     wTourUtils.changeBackgroundColor(),
     wTourUtils.selectColorPalette(),
     wTourUtils.goBackToBlocks(),
-    ...wTourUtils.dragNDrop(snippets[4]),
     ...wTourUtils.dragNDrop(snippets[5]),
     ...wTourUtils.dragNDrop(snippets[6]),
 ]);

theme_anelusia/static/src/scss/primary_variables.scss

@@ -4,7 +4,7 @@
 
 $o-website-values-palettes: (
     (
-        'color-palettes-name': 'generic-17',
+        'color-palettes-name': 'default-25',
 
         // Header
         'header-font-size':                 1rem,
@@ -131,7 +131,7 @@ $o-theme-color-palettes: map-merge($o-theme-color-palettes,
     )
 );
 
-$o-selected-color-palettes-names: append($o-selected-color-palettes-names, 'generic-17');
+$o-selected-color-palettes-names: append($o-selected-color-palettes-names, 'default-25');
 
 $o-color-palettes-compatibility-indexes: (
     1: 'anelusia-1',

theme_anelusia/views/images_library.xml

@@ -397,5 +397,20 @@
     <field name="name">website.s_empowerment_default_image</field>
     <field name="url">/theme_anelusia/static/src/img/snippets/s_empowerment_default_image.jpg</field>
 </record>
+<record id="s_image_hexagonal_default_image" model="theme.ir.attachment">
+    <field name="key">website.s_image_hexagonal_default_image</field>
+    <field name="name">website.s_image_hexagonal_default_image</field>
+    <field name="url">/theme_anelusia/static/src/img/snippets/s_quotes_carousel_1.jpg</field>
+</record>
+<record id="s_image_hexagonal_default_image_1" model="theme.ir.attachment">
+    <field name="key">website.s_image_hexagonal_default_image_1</field>
+    <field name="name">website.s_image_hexagonal_default_image_1</field>
+    <field name="url">/theme_anelusia/static/src/img/snippets/s_image_hexagonal_default_image_1.jpg</field>
+</record>
+<record id="s_image_punchy_default_image" model="theme.ir.attachment">
+    <field name="key">website.s_image_punchy_default_image</field>
+    <field name="name">website.s_image_punchy_default_image</field>
+    <field name="url">/theme_anelusia/static/src/img/snippets/s_carousel_3.jpg</field>
+</record>
 
 </odoo>

theme_anelusia/views/snippets/s_comparisons.xml

@@ -4,7 +4,7 @@
 <template id="s_comparisons" inherit_id="website.s_comparisons">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="class" add="o_cc o_cc4" separator=" "/>
+        <attribute name="class" add="o_cc o_cc2" separator=" "/>
     </xpath>
 </template>
 

theme_anelusia/views/snippets/s_image_hexagonal.xml

@@ -2,10 +2,25 @@
 <odoo>
 
 <template id="s_image_hexagonal" inherit_id="website.s_image_hexagonal">
-    <!-- Image -->
+    <xpath expr="//section" position="attributes">
-    <xpath expr="(//img)[2]" position="attributes">
+        <attribute name="class" add="o_cc o_cc4" separator=" "/>
-        <attribute name="src">/web/image/website.s_text_image_default_image</attribute>
     </xpath>
+    <xpath expr="//div[hasclass('o_grid_item')]" position="attributes">
+        <attribute name="class" add="o_snippet_mobile_invisible d-none d-lg-block" separator=" "/>
+    </xpath>
+    <xpath expr="(//div[hasclass('o_grid_item')])[2]" position="attributes">
+        <attribute name="style" add="--grid-item-padding-x: 24px; --grid-item-padding-y: 24px;" separator=" "/>
+    </xpath>
+    <xpath expr="(//div[hasclass('o_grid_item')])[3]" position="attributes">
+        <attribute name="class" remove="o_snippet_mobile_invisible d-none d-lg-block" separator=" "/>
+    </xpath>
+    <xpath expr="//h2" position="replace">
+        <h1 class="display-4-fs">Unvail our <br/>Exclusive <br/>Collections</h1>
+    </xpath>
+    <xpath expr="//p" position="replace" mode="inner">
+        Discover timeless elegance and modern style with our exclusive fashion collections. Elevate your wardrobe with unique pieces crafted to make a statement.
+    </xpath>
+    <xpath expr="(//p)[2]" position="replace"/>
 </template>
 
 </odoo>

theme_anelusia/views/snippets/s_key_images.xml

@@ -4,7 +4,7 @@
 <template id="s_key_images" inherit_id="website.s_key_images">
     <!-- Layout -->
     <xpath expr="//section" position="attributes">
-        <attribute name="class" add="o_cc o_cc5" separator=" "/>
+        <attribute name="class" add="o_cc o_cc3" separator=" "/>
     </xpath>
     <xpath expr="//img" position="attributes">
         <attribute name="src">/web_editor/image_shape/website.s_key_images_default_image_1/web_editor/geometric/geo_square_6.svg</attribute>

theme_anelusia/views/snippets/s_striped_center_top.xml

@@ -18,6 +18,10 @@
     <xpath expr="//figcaption" position="replace" mode="inner">
         Crafted with passion for every season
     </xpath>
+    <!-- Image -->
+    <xpath expr="//img" position="attributes">
+        <attribute name="style">width: 50% !important;</attribute>
+    </xpath>
 </template>
 
 </odoo>

theme_anelusia/views/snippets/s_text_cover.xml

@@ -4,10 +4,18 @@
 <template id="s_text_cover" inherit_id="website.s_text_cover">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="class" add="o_cc4" remove="o_cc3" separator=" "/>
+        <attribute name="class" add="o_cc1" remove="o_cc3" separator=" "/>
+    </xpath>
+    <!-- Container -->
+    <xpath expr="//div[hasclass('row')]" position="attributes">
+        <attribute name="data-row-count">15</attribute>
+    </xpath>
+    <xpath expr="//div[hasclass('row')]/div" position="attributes">
+        <attribute name="class" add="g-height-9" remove="g-height-10 o_cc o_cc1" separator=" "/>
+        <attribute name="style">z-index: 1; grid-area: 4 / 2 / 13 / 8; --grid-item-padding-x: 24px; --grid-item-padding-y: 24px; text-align: right;</attribute>
     </xpath>
     <xpath expr="//h1" position="replace" mode="inner">
-        The next<br/> summer<br/> collection
+        <font style="background-image: linear-gradient(135deg, var(--o-color-1) 0%, var(--o-color-2) 100%);" class="text-gradient"><strong>The next</strong></font><br/><font style="background-image: linear-gradient(135deg, var(--o-color-1) 0%, var(--o-color-2) 100%);" class="text-gradient"> <strong>summer</strong></font><br/><font style="background-image: linear-gradient(135deg, var(--o-color-1) 0%, var(--o-color-2) 100%);" class="text-gradient"> <strong>collection</strong></font>
     </xpath>
     <!-- Paragraph -->
     <xpath expr="//p[hasclass('lead')]" position="replace" mode="inner">
@@ -17,6 +25,11 @@
     <xpath expr="//a[hasclass('btn')]/t" position="replace" mode="inner">
         Discover it
     </xpath>
+    <!-- Image -->
+    <xpath expr="//div[hasclass('row')]//div[2]" position="attributes">
+        <attribute name="class" add="g-col-lg-4 col-lg-4 g-height-15" remove="g-height-12 g-col-lg-6 col-lg-6 o_cc o_cc1 pt48 pb48" separator=" "/>
+        <attribute name="style">grid-area: 1 / 9 / 16 / 13; --grid-item-padding-x: 0px; --grid-item-padding-y: 0px; background-image: url('/web/image/website.s_text_cover_default_image');</attribute>
+    </xpath>
 </template>
 
 </odoo>