[FIX] theme_*: fix font style of snippet headers

Some snippets contain incorrect font style that are not achievable using
the editor (for example: <h2 class="display-3"> in the "Key benefits"
snippet).

These snippets were adapted in the community commit linked to this one
to align with what the editor would generate if we recreated them from
scratch.

In this commit, we adapt the themes following the change in community.
We also fix a few issues (e.g., wording for the ´s_numbers´ snippet)
noticed during the changes.

task-4148057

closes odoo/design-themes#895

Related: odoo/odoo#178957
Signed-off-by: Robin Lejeune (role) <role@odoo.com>
This commit is contained in:
Benjamin Vray
2024-09-04 11:36:42 +02:00
parent 6fc1519894
commit d60776bdd2
9 changed files with 77 additions and 61 deletions
+6 -3
View File
@@ -124,13 +124,16 @@
<xpath expr="//section/div" position="before"> <xpath expr="//section/div" position="before">
<div class="o_we_shape o_web_editor_Blobs_11" style="background-image: url('/web_editor/shape/web_editor/Blobs/11.svg?c1=o-color-1&amp;flip=x'); background-position: 50% 50%;"/> <div class="o_we_shape o_web_editor_Blobs_11" style="background-image: url('/web_editor/shape/web_editor/Blobs/11.svg?c1=o-color-1&amp;flip=x'); background-position: 50% 50%;"/>
</xpath> </xpath>
<xpath expr="//h6" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
Faculties Faculties
</xpath> </xpath>
<xpath expr="//div[hasclass('row')]/div[2]/h6" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner">
47
</xpath>
<xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
Nationalities Nationalities
</xpath> </xpath>
<xpath expr="//div[hasclass('row')]/div[3]/h6" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
Libraries Libraries
</xpath> </xpath>
</template> </template>
+12 -6
View File
@@ -12,14 +12,20 @@
<div class="o_we_shape o_web_editor_Floats_12"/> <div class="o_we_shape o_web_editor_Floats_12"/>
</xpath> </xpath>
<!-- Titles --> <!-- Titles -->
<xpath expr="//h6" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
Useful options Unique references
</xpath> </xpath>
<xpath expr="//h6" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner">
Beautiful snippets 98%
</xpath> </xpath>
<xpath expr="//h6" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
Amazing pages Happy customers
</xpath>
<xpath expr="(//span[hasclass('s_number')])[3]" position="replace" mode="inner">
418
</xpath>
<xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
Stores around the world
</xpath> </xpath>
</template> </template>
-10
View File
@@ -248,16 +248,6 @@
<span class="s_parallax_bg oe_img_bg" style="background-image: url('/web/image/website.s_parallax_default_image'); background-position: 50% 75%;"/> <span class="s_parallax_bg oe_img_bg" style="background-image: url('/web/image/website.s_parallax_default_image'); background-position: 50% 75%;"/>
<div class="o_we_bg_filter bg-black-75"></div> <div class="o_we_bg_filter bg-black-75"></div>
</xpath> </xpath>
<!-- Content -->
<xpath expr="//div[hasclass('row')]/div/span" position="attributes">
<attribute name="class" add="text-white" separator=" "/>
</xpath>
<xpath expr="(//div[hasclass('row')]/div/span)[2]" position="attributes">
<attribute name="class" add="text-white" separator=" "/>
</xpath>
<xpath expr="(//div[hasclass('row')]/div/span)[3]" position="attributes">
<attribute name="class" add="text-white" separator=" "/>
</xpath>
</template> </template>
<!-- ======== PICTURE ======== --> <!-- ======== PICTURE ======== -->
+7 -4
View File
@@ -6,14 +6,17 @@
<xpath expr="//section" position="attributes"> <xpath expr="//section" position="attributes">
<attribute name="class" add="pt0 pb48" remove="pt80 pb80" separator=" "/> <attribute name="class" add="pt0 pb48" remove="pt80 pb80" separator=" "/>
</xpath> </xpath>
<!-- Replace h6 by paragraphs --> <!-- Replace texts -->
<xpath expr="//h6" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
Different lenses Different lenses
</xpath> </xpath>
<xpath expr="(//h6)[2]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner">
256
</xpath>
<xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
Storage capacity (GB) Storage capacity (GB)
</xpath> </xpath>
<xpath expr="(//h6)[3]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
Number of controllers Number of controllers
</xpath> </xpath>
</template> </template>
+19 -12
View File
@@ -12,26 +12,33 @@
</xpath> </xpath>
<!-- Column #1 --> <!-- Column #1 -->
<xpath expr="//div[hasclass('col-lg-4')]" position="attributes"> <xpath expr="//div[hasclass('col-lg-4')]" position="attributes">
<attribute name="class" add="pt104 pb104 o_cc o_cc5" remove="pt24 pb24" separator=" "/> <attribute name="class" add="pt104 pb64 o_cc o_cc5" separator=" "/>
</xpath>
<!-- Column #1 - Text -->
<xpath expr="//h6" position="replace" mode="inner">
Editions through the Europe
</xpath> </xpath>
<!-- Column #2 --> <!-- Column #2 -->
<xpath expr="//div[hasclass('col-lg-4')][2]" position="attributes"> <xpath expr="(//div[hasclass('col-lg-4')])[2]" position="attributes">
<attribute name="class" add="pt104 pb104 o_cc o_cc2" remove="pt24 pb24" separator=" "/> <attribute name="class" add="pt104 pb104 o_cc o_cc1" remove="pt24 pb24" separator=" "/>
</xpath> </xpath>
<!-- Column #2 - Text --> <!-- Column #2 - Text -->
<xpath expr="(//h6)[2]" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
Artists from around the world Editions through the Europe
</xpath> </xpath>
<!-- Column #3 --> <!-- Column #3 -->
<xpath expr="//div[hasclass('col-lg-4')][3]" position="attributes"> <xpath expr="(//div[hasclass('col-lg-4')])[3]" position="attributes">
<attribute name="class" add="pt104 pb104 o_cc o_cc3" remove="pt24 pb24" separator=" "/> <attribute name="class" add="pt104 pb104 o_cc o_cc2" remove="pt24 pb24" separator=" "/>
</xpath> </xpath>
<!-- Column #3 - Text --> <!-- Column #3 - Text -->
<xpath expr="(//h6)[3]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner">
72
</xpath>
<xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
Artists from around the world
</xpath>
<!-- Column #4 -->
<xpath expr="(//div[hasclass('col-lg-4')])[4]" position="attributes">
<attribute name="class" add="pt104 pb104 o_cc o_cc3" remove="pt24 pb24" separator=" "/>
</xpath>
<!-- Column #4 - Text -->
<xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
Scenes outdoor &amp; indoor Scenes outdoor &amp; indoor
</xpath> </xpath>
</template> </template>
@@ -8,14 +8,14 @@
<attribute name="style">background-image:url('/web_editor/shape/theme_odoo_experts/s_numbers.svg?c1=o-color-1');</attribute> <attribute name="style">background-image:url('/web_editor/shape/theme_odoo_experts/s_numbers.svg?c1=o-color-1');</attribute>
</xpath> </xpath>
<!-- Numbers --> <!-- Numbers -->
<xpath expr="//span[hasclass('s_number')]" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
<b>12</b> <strong>Useful options</strong>
</xpath> </xpath>
<xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
<b>45</b> <strong>More leads</strong>
</xpath> </xpath>
<xpath expr="(//span[hasclass('s_number')])[3]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
<b>8</b> <strong>Amazing pages</strong>
</xpath> </xpath>
</template> </template>
@@ -7,24 +7,24 @@
<attribute name="class" add="pt32 pb56" remove="pt80 pb80" separator=" "/> <attribute name="class" add="pt32 pb56" remove="pt80 pb80" separator=" "/>
</xpath> </xpath>
<!-- Column #01 --> <!-- Column #01 -->
<xpath expr="//div[hasclass('col-lg-4')][1]/h6" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
properties already sold properties already sold
</xpath> </xpath>
<xpath expr="//div[hasclass('col-lg-4')][1]/span" position="replace" mode="inner"> <xpath expr="//span[hasclass('s_number')]" position="replace" mode="inner">
14,000 14K
</xpath> </xpath>
<!-- Column #02 --> <!-- Column #02 -->
<xpath expr="//div[hasclass('col-lg-4')][2]/span" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner">
97% 98%
</xpath> </xpath>
<xpath expr="//div[hasclass('col-lg-4')][2]/h6" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
happy customers happy customers
</xpath> </xpath>
<!-- Column #03 --> <!-- Column #03 -->
<xpath expr="//div[hasclass('col-lg-4')][3]/span" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[3]" position="replace" mode="inner">
142 142
</xpath> </xpath>
<xpath expr="//div[hasclass('col-lg-4')][3]/h6" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
amazing agents amazing agents
</xpath> </xpath>
</template> </template>
+2 -2
View File
@@ -46,7 +46,7 @@
<template id="new_page_template_about_full_s_numbers" inherit_id="website.new_page_template_about_full_s_numbers"> <template id="new_page_template_about_full_s_numbers" inherit_id="website.new_page_template_about_full_s_numbers">
<xpath expr="//section" position="attributes"> <xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc2" remove="o_cc3" separator=" "/> <attribute name="class" remove="o_cc3" separator=" "/>
</xpath> </xpath>
</template> </template>
@@ -59,7 +59,7 @@
<template id="new_page_template_about_personal_s_numbers" inherit_id="website.new_page_template_about_personal_s_numbers"> <template id="new_page_template_about_personal_s_numbers" inherit_id="website.new_page_template_about_personal_s_numbers">
<xpath expr="//section" position="attributes"> <xpath expr="//section" position="attributes">
<!-- o_colored_level is defined by both theme and new page template --> <!-- o_colored_level is defined by both theme and new page template -->
<attribute name="class" add="o_cc2 o_colored_level" remove="o_cc3 o_colored_level pt0" separator=" "/> <attribute name="class" add="pt64" remove="o_cc3 o_colored_level pt0" separator=" "/>
</xpath> </xpath>
</template> </template>
+17 -10
View File
@@ -2,28 +2,35 @@
<odoo> <odoo>
<template id="s_numbers" inherit_id="website.s_numbers"> <template id="s_numbers" inherit_id="website.s_numbers">
<!-- Column #01 --> <!-- Section -->
<xpath expr="//*[hasclass('row')]/*[1]" position="attributes"> <xpath expr="//section" position="attributes">
<attribute name="class" add="o_cc2" remove="o_cc1" separator=" "/>
</xpath>
<!-- Column #2 -->
<xpath expr="(//div[hasclass('col-lg-4')])[2]" position="attributes">
<attribute name="class" add="o_cc o_cc1 rounded pt64 pb64" remove="pt24 pb24" separator=" "/> <attribute name="class" add="o_cc o_cc1 rounded pt64 pb64" remove="pt24 pb24" separator=" "/>
<attribute name="style" add="box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 4px 0px !important;" separator=" "/> <attribute name="style" add="box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 4px 0px !important;" separator=" "/>
</xpath> </xpath>
<xpath expr="(//h6)[1]" position="replace" mode="inner"> <xpath expr="//span[hasclass('h5-fs')]" position="replace" mode="inner">
<font class="text-o-color-1">Solutions</font> <font class="text-o-color-1">Solutions</font>
</xpath> </xpath>
<!-- Column #02 --> <!-- Column #3 -->
<xpath expr="//*[hasclass('row')]/*[2]" position="attributes"> <xpath expr="(//div[hasclass('col-lg-4')])[3]" position="attributes">
<attribute name="class" add="o_cc o_cc1 rounded pt64 pb64" remove="pt24 pb24" separator=" "/> <attribute name="class" add="o_cc o_cc1 rounded pt64 pb64" remove="pt24 pb24" separator=" "/>
<attribute name="style" add="box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 4px 0px !important;" separator=" "/> <attribute name="style" add="box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 4px 0px !important;" separator=" "/>
</xpath> </xpath>
<xpath expr="(//h6)[2]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('s_number')])[2]" position="replace" mode="inner">
<font class="text-o-color-1">Customers</font> 98%
</xpath> </xpath>
<!-- Column #03 --> <xpath expr="(//span[hasclass('h5-fs')])[2]" position="replace" mode="inner">
<xpath expr="//*[hasclass('row')]/*[3]" position="attributes"> <font class="text-o-color-1">Happy customers</font>
</xpath>
<!-- Column #4 -->
<xpath expr="(//div[hasclass('col-lg-4')])[4]" position="attributes">
<attribute name="class" add="o_cc o_cc1 rounded pt64 pb64" remove="pt24 pb24" separator=" "/> <attribute name="class" add="o_cc o_cc1 rounded pt64 pb64" remove="pt24 pb24" separator=" "/>
<attribute name="style" add="box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 4px 0px !important;" separator=" "/> <attribute name="style" add="box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 4px 0px !important;" separator=" "/>
</xpath> </xpath>
<xpath expr="(//h6)[3]" position="replace" mode="inner"> <xpath expr="(//span[hasclass('h5-fs')])[3]" position="replace" mode="inner">
<font class="text-o-color-1">Languages</font> <font class="text-o-color-1">Languages</font>
</xpath> </xpath>
</template> </template>