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_*: remove hardcoded colors on shapes and snippets

Browse Source 
Instead now use another custom mapping for the default colors of the
shapes which are used for the default homepage. This allows for the
built page to work with any color palette (especially useful for built
pages in the new configurator) and to handle footer/header connection.

Also change some shapes and default background colors to match what
the preview wanted directly (instead of relying on user asked change as
that would not be handled when generating the page automatically with
the configurator).

Part of https://github.com/odoo/design-themes/pull/2
task-2491890

closes odoo/design-themes#12

closes odoo/design-themes#14

Related: odoo/odoo#71665
Related: odoo/odoo#71768
X-original-commit: 845b969555
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
qsm-odoo
2021-05-12 10:29:54 +00:00
parent 5cbf95db80
commit 8e181539a5
42 changed files with 161 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme_notes/static/src/scss/primary_variables.scss
+7
View File
@@ -163,3 +163,10 @@ $o-theme-color-palettes-compatibility-indexes: (
5: 'notes-5',
6: 'notes-6',
);
//------------------------------------------------------------------------------
// Shapes
//------------------------------------------------------------------------------
$o-bg-shapes: change-shape-colors-mapping('web_editor', 'Blobs/04', (5: 4));
$o-bg-shapes: change-shape-colors-mapping('web_editor', 'Blobs/01', (2: 5));
theme_notes/views/snippets/s_carousel.xml
+3 -3
View File
@@ -3,7 +3,7 @@
<template id="s_carousel" inherit_id="website.s_carousel">
<!-- Slide 1 -->
<xpath expr="//div[hasclass('carousel-content')]" position="replace">
<div class="carousel-content col-lg-6 p-5 o_cc o_cc5 shadow border" style="border-width: 2.5px !important; box-shadow: rgb(161, 192, 5) -20px 20px 0px 0px !important; border-color: rgb(161, 192, 5) !important;">
<div class="carousel-content col-lg-6 p-5 o_cc o_cc5 shadow border" style="border-width: 2.5px !important; box-shadow: rgb(44, 41, 39) -20px 20px 0px 0px !important; border-color: rgb(44, 41, 39) !important;">
<h2><font style="font-size: 62px;">Miraillet Festival</font></h2>
<p class="lead">From the 12th to the 17th of August, come and enjoy the atmosphere at the Mirallet Festival. Discover the line up below.</p>
<p><br/></p>
@@ -12,7 +12,7 @@
</xpath>
<!-- Slide 2 -->
<xpath expr="(//div[hasclass('carousel-content')])[2]" position="replace">
<div class="carousel-content col-lg-8 offset-lg-2 mt48 pt48 pb40 text-center o_cc o_cc5 shadow border" style="border-width: 2.5px !important; box-shadow: rgb(161, 192, 5) 0px 20px 0px 0px !important; border-color: rgb(161, 192, 5) !important;">
<div class="carousel-content col-lg-8 offset-lg-2 mt48 pt48 pb40 text-center o_cc o_cc5 shadow border" style="border-width: 2.5px !important; box-shadow: rgb(44, 41, 39) 0px 20px 0px 0px !important; border-color: rgb(44, 41, 39) !important;">
<h2><font style="font-size: 62px;">6 Days Pass</font></h2>
<p class="lead">Tickets will be on sale soon. Do not miss our 6 Days Pass. Free camping!</p>
<p><br/></p>
@@ -21,7 +21,7 @@
</xpath>
<!-- Slide 3 -->
<xpath expr="(//div[hasclass('carousel-content')])[3]" position="replace">
<div class="carousel-content col-lg-6 offset-lg-6 p-5 pt48 pb40 o_cc o_cc5 shadow border" style="border-width: 2.5px !important; box-shadow: rgb(161, 192, 5) 20px 20px 0px 0px !important; border-color: rgb(161, 192, 5) !important;">
<div class="carousel-content col-lg-6 offset-lg-6 p-5 pt48 pb40 o_cc o_cc5 shadow border" style="border-width: 2.5px !important; box-shadow: rgb(44, 41, 39) 20px 20px 0px 0px !important; border-color: rgb(44, 41, 39) !important;">
<h2><font style="font-size: 62px;">Recent Editions</font></h2>
<p class="lead">Discover what makes the reputation of the Miraillet festival through these after-movies.</p>
<p><br/></p>
theme_notes/views/snippets/s_company_team.xml
+2 -2
View File
@@ -4,11 +4,11 @@
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="pt144 o_cc o_cc5" remove="pt48" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/08","colors":{"c1":"o-color-1"},"flip":["x","y"]}</attribute>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/08","flip":["x","y"]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Blobs_08 o_we_flip_x o_we_flip_y" style="background-image: url('/web_editor/shape/web_editor/Blobs/08.svg?c1=%23A1C005');"/>
<div class="o_we_shape o_web_editor_Blobs_08 o_we_flip_x o_we_flip_y"/>
</xpath>
<!-- Title -->
<xpath expr="//div[hasclass('row')]" position="before">
theme_notes/views/snippets/s_image_text.xml
+3 -3
View File
@@ -4,15 +4,15 @@
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc5" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/04","colors":{"c5":"o-color-1"},"flip":["x"]}</attribute>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/04","flip":["x"]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Blobs_04 o_we_flip_x" style="background-image: url('/web_editor/shape/web_editor/Blobs/04.svg?c5=%23A1C005');"/>
<div class="o_we_shape o_web_editor_Blobs_04 o_we_flip_x"/>
</xpath>
<!-- Paragraph -->
<xpath expr="(//div[hasclass('col-lg-6')])[2]" position="replace">
<div class="pb16 p-5 border pt32 offset-lg-2 col-lg-6 shadow o_cc o_cc4" style="border-width: 2.5px !important; border-color: rgb(33, 33, 33) !important; box-shadow: rgb(33, 33, 33) 20px -20px 0px 0px !important;">
<div class="pb16 p-5 border pt32 offset-lg-2 col-lg-6 shadow o_cc o_cc4" style="border-width: 2.5px !important; border-color: rgb(44, 41, 39) !important; box-shadow: rgb(44, 41, 39) 20px -20px 0px 0px !important;">
<h2>History</h2>
<p>The Miraillet Festival was born in 2002 from a common will of cultural, touristic and institutional actors of the region to propose a major cultural event in the very heart of the region during the summer period.</p>
<p><a href="#" class="btn btn-dark mb-2">Discover more</a></p>
theme_notes/views/snippets/s_media_list.xml
+5 -5
View File
@@ -4,15 +4,15 @@
<!-- Section -->
<xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc o_cc4" remove="bg-200" separator=" "/>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/01","colors":{"c2":"o-color-5"},"flip":["y"]}</attribute>
<attribute name="data-oe-shape-data">{"shape":"web_editor/Blobs/01","flip":["y"]}</attribute>
</xpath>
<!-- Shape -->
<xpath expr="//div[hasclass('container')]" position="before">
<div class="o_we_shape o_web_editor_Blobs_01 o_we_flip_y" style="background-image: url('/web_editor/shape/web_editor/Blobs/01.svg?c2=%23212121');"/>
<div class="o_we_shape o_web_editor_Blobs_01 o_we_flip_y"/>
</xpath>
<!-- Row 1 -->
<xpath expr="(//div[hasclass('col-lg-12')])[1]/div" position="replace">
<div class="row s_col_no_resize s_col_no_bgcolor no-gutters border shadow align-items-center flex-row-reverse o_cc o_cc4" style="border-width: 2.5px !important; border-color: rgb(33, 33, 33) !important; box-shadow: rgb(33, 33, 33) 20px -20px 0px 0px !important;">
<div class="row s_col_no_resize s_col_no_bgcolor no-gutters border shadow align-items-center flex-row-reverse o_cc o_cc4" style="border-width: 2.5px !important; border-color: rgb(44, 41, 39) !important; box-shadow: rgb(44, 41, 39) 20px -20px 0px 0px !important;">
<div class="align-self-stretch s_media_list_img_wrapper col-lg-4">
<img src="/web/image/website.s_media_list_default_image_1" alt="" class="s_media_list_img h-100 w-100"/>
</div>
@@ -25,7 +25,7 @@
</xpath>
<!-- Row 2 -->
<xpath expr="(//div[hasclass('col-lg-12')])[2]/div" position="replace">
<div class="row s_col_no_resize s_col_no_bgcolor no-gutters shadow border align-items-center o_cc o_cc4" style="border-width: 2.5px !important; box-shadow: rgb(33, 33, 33) 20px -20px 0px 0px !important; border-color: rgb(33, 33, 33) !important;">
<div class="row s_col_no_resize s_col_no_bgcolor no-gutters shadow border align-items-center o_cc o_cc4" style="border-width: 2.5px !important; box-shadow: rgb(44, 41, 39) 20px -20px 0px 0px !important; border-color: rgb(44, 41, 39) !important;">
<div class="align-self-stretch s_media_list_img_wrapper col-lg-4">
<img src="/web/image/website.s_media_list_default_image_2" alt="" class="s_media_list_img h-100 w-100"/>
</div>
@@ -37,7 +37,7 @@
</xpath>
<!-- Row 3 -->
<xpath expr="(//div[hasclass('col-lg-12')])[3]/div" position="replace">
<div class="row s_col_no_resize s_col_no_bgcolor no-gutters o_cc o_cc5 border shadow align-items-center flex-row-reverse" style="border-width: 2.5px !important; border-color: rgb(161, 192, 5) !important; box-shadow: rgb(161, 192, 5) 20px -20px 0px 0px !important;">
<div class="row s_col_no_resize s_col_no_bgcolor no-gutters o_cc o_cc5 border shadow align-items-center flex-row-reverse" style="border-width: 2.5px !important; border-color: rgb(44, 41, 39) !important; box-shadow: rgb(44, 41, 39) 20px -20px 0px 0px !important;">
<div class="align-self-stretch s_media_list_img_wrapper col-lg-4">
<img src="/web/image/website.s_media_list_default_image_3" alt="" class="s_media_list_img h-100 w-100"/>
</div>