pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] website, *: prevent abuse of h1 and use font size classes

Browse Source 
*: website_event, website_forum, website_livechat, website_mass_mailing,
   website_slides

This commit permits to reduce the risk to have a wrong h1 tag or
multiple h1 tags on the same page. This commit replaces some h1 tags
with a h2 in snippets. In addition, this commit removes some font sizes
written in the style attribute and replaces them with a font size class
now that they are possible to use and edit as an user.

task-1958098

Part-of: odoo/odoo#129791
Co-authored-by: qsm-odoo <qsm@odoo.com>
This commit is contained in:
Guillaume (gdi)
2023-10-19 19:08:11 +00:00
committed by qsm-odoo
co-authored by qsm-odoo
parent da8fec249a
commit c32e7b27fe
23 changed files with 41 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website/static/tests/tours/link_tools.js
+2 -2
View File
@@ -320,7 +320,7 @@ wTourUtils.registerWebsitePreviewTour('link_tools', {
wTourUtils.clickOnElement("mega menu", "iframe header .o_mega_menu_toggle"),
wTourUtils.changeOption("MegaMenuLayout", "we-toggler"),
wTourUtils.changeOption("MegaMenuLayout", '[data-select-label="Cards"]'),
wTourUtils.clickOnElement("card's text", "iframe header .s_mega_menu_cards font"),
wTourUtils.clickOnElement("card's text", "iframe header .s_mega_menu_cards p"),
{
content: "Enter an URL",
trigger: "#o_link_dialog_url_input",
@@ -328,7 +328,7 @@ wTourUtils.registerWebsitePreviewTour('link_tools', {
},
{
content: "Check nothing is lost",
trigger: "iframe header .s_mega_menu_cards a[href='https://www.odoo.com']:has(img):has(h4):has(p font)",
trigger: "iframe header .s_mega_menu_cards a[href='https://www.odoo.com']:has(img):has(h4):has(p)",
run: () => {}, // This is a check.
},
...wTourUtils.clickOnSave(),
addons/website/static/tests/tours/snippet_table_of_content.js
+4 -4
View File
@@ -4,8 +4,8 @@ import wTourUtils from '@website/js/tours/tour_utils';
const scrollToHeading = function (position) {
return {
content: `Scroll to h1 number ${position}`,
trigger: `iframe h1:eq(${position})`,
content: `Scroll to h2 number ${position}`,
trigger: `iframe h2:eq(${position})`,
run: function () {
this.$anchor[0].scrollIntoView(true);
},
@@ -41,7 +41,7 @@ wTourUtils.registerWebsitePreviewTour('snippet_table_of_content', {
...wTourUtils.clickOnEditAndWaitEditMode(),
{
content: "Click on the first TOC's title",
trigger: 'iframe .s_table_of_content:eq(0) h1',
trigger: 'iframe .s_table_of_content:eq(0) h2',
},
{
content: "Hide the first TOC on mobile",
@@ -49,7 +49,7 @@ wTourUtils.registerWebsitePreviewTour('snippet_table_of_content', {
},
{
content: "Click on the second TOC's title",
trigger: 'iframe .s_table_of_content:eq(1) h1',
trigger: 'iframe .s_table_of_content:eq(1) h2',
},
{
content: "Hide the second TOC on desktop",
addons/website/static/tests/tours/text_animations.js
+1 -1
View File
@@ -13,7 +13,7 @@ wTourUtils.registerWebsitePreviewTour("text_animations", {
}),
{
content: "Click on the snippet title",
trigger: "iframe .s_cover h1 > font",
trigger: "iframe .s_cover h1",
run: "dblclick", // Make sure the title is selected.
},
{
addons/website/views/new_page_template_templates.xml
+2 -2
View File
@@ -1093,10 +1093,10 @@ overridden by modules), because:
<a href="#table_of_content_heading_1_1" class="table_of_content_link list-group-item list-group-item-action py-2 border-0 rounded-0 active">Intuitive system</a>
<a href="#table_of_content_heading_1_2" class="table_of_content_link list-group-item list-group-item-action py-2 border-0 rounded-0">Design features</a>
</xpath>
<xpath expr="//section//section[1]//h1" position="attributes">
<xpath expr="//section//section[1]//h2" position="attributes">
<attribute name="id">table_of_content_heading_1_1</attribute>
</xpath>
<xpath expr="//section//section[2]//h1" position="attributes">
<xpath expr="//section//section[2]//h2" position="attributes">
<attribute name="id">table_of_content_heading_1_2</attribute>
</xpath>
</template>
addons/website/views/snippets/s_banner.xml
+1 -1
View File
@@ -6,7 +6,7 @@
<div class="container">
<div class="row s_nb_column_fixed o_grid_mode" data-row-count="11">
<div class="justify-content-center o_grid_item g-height-8 g-col-lg-5 col-lg-5" data-name="Box" style="z-index: 1; grid-area: 2 / 1 / 10 / 6;">
<h1><font style="font-size: 62px;">Sell Online. <strong>Easily.</strong></font></h1>
<h1 class="display-3">Sell Online. <strong>Easily.</strong></h1>
<p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
<div class="s_hr text-start pb32 pt4" data-snippet="s_hr" data-name="Separator">
<hr class="w-100 mx-auto"/>
addons/website/views/snippets/s_carousel.xml
+3 -3
View File
@@ -18,7 +18,7 @@
<div class="container oe_unremovable">
<div class="row">
<div class="carousel-content col-lg-6">
<h2><font style="font-size: 62px;">Slide Title</font></h2>
<h2 class="display-3-fs">Slide Title</h2>
<p class="lead">Use this snippet to presents your content in a slideshow-like format. Don't write about products or services here, write about solutions.</p>
<p>
<a href="/contactus" class="btn btn-primary">Contact us</a>
@@ -32,7 +32,7 @@
<div class="container oe_unremovable">
<div class="row">
<div class="carousel-content col-lg-8 offset-lg-2 bg-black-50 text-center pt48 pb40">
<h2 style="font-size: 62px;">Clever Slogan</h2>
<h2 class="display-3-fs">Clever Slogan</h2>
<div class="s_hr pt8 pb24" data-snippet="s_hr" data-name="Separator">
<hr class="w-25 mx-auto" style="border-top-width: 1px; border-top-style: solid;"/>
</div>
@@ -47,7 +47,7 @@
<div class="container oe_unremovable">
<div class="row">
<div class="carousel-content col-lg-6 offset-lg-6">
<h2><font style="font-size: 62px; background-color: rgb(255, 255, 255);">Edit this title</font></h2>
<h2><font class="display-3-fs" style="background-color: rgb(255, 255, 255);">Edit this title</font></h2>
<h4><font style="background-color: rgb(255, 255, 255);">Good writing is simple, but not simplistic.</font></h4>
<p><br/></p>
<p>Good copy starts with understanding how your product or service helps your customers. Simple words communicate better than big words and pompous language.</p>
addons/website/views/snippets/s_cover.xml
+1 -1
View File
@@ -6,7 +6,7 @@
<span class="s_parallax_bg oe_img_bg" style="background-image: url('/web/image/website.s_cover_default_image'); background-position: 50% 0;"/>
<div class="o_we_bg_filter bg-black-50"/>
<div class="container s_allow_columns">
<h1 style="text-align: center;"><font style="font-size: 62px; font-weight: bold;">Catchy Headline</font></h1>
<h1 class="display-3" style="text-align: center; font-weight: bold;">Catchy Headline</h1>
<p class="lead" style="text-align: center;">Write one or two paragraphs describing your product, services or a specific feature.<br/> To be successful your content needs to be useful to your readers.</p>
<p style="text-align: center;">
<a t-att-href="cta_btn_href" class="btn btn-primary"><t t-esc="cta_btn_text">Contact us</t></a>
addons/website/views/snippets/s_mega_menu_big_icons_subtitles.xml
+1 -1
View File
@@ -74,7 +74,7 @@
<i t-attf-class="fa rounded rounded-circle me-3 #{_icon_classes}"/>
<div class="flex-grow-1">
<h4 class="mt-0 mb-0" t-esc="_title"/>
<span><font style="font-size: 14px;" t-esc="_text"/></span>
<span class="small"><t t-esc="_text"/></span>
</div>
</div>
</a>
addons/website/views/snippets/s_mega_menu_cards.xml
+1 -1
View File
@@ -58,7 +58,7 @@
<a href="#" class="nav-link o_default_snippet_text rounded text-wrap text-center p-3">
<img t-att-src="_img_src" class="mb-3 rounded shadow img-fluid" alt=""/>
<h4 t-esc="_title"/>
<p class="o_default_snippet_text mb-0"><font style="font-size: 14px;" t-esc="_text"/></p>
<p class="o_default_snippet_text mb-0 small"><t t-esc="_text"/></p>
</a>
</div>
</template>
addons/website/views/snippets/s_mega_menu_images_subtitles.xml
+3 -3
View File
@@ -46,8 +46,8 @@
<div class="col col-md-6 col-lg py-2">
<img src="/web/image/website.s_mega_menu_images_subtitles_default_image_7" class="mb-3 rounded shadow img-fluid" alt=""/>
<h4 class="o_default_snippet_text">The team</h4>
<p class="text-muted o_default_snippet_text">
<font style="font-size: 14px;">Created in 2021, the company is young and dynamic. Discover the composition of the team and their skills.</font>
<p class="text-muted o_default_snippet_text small">
Created in 2021, the company is young and dynamic. Discover the composition of the team and their skills.
</p>
<a href="#" class="btn btn-primary o_default_snippet_text">Discover our team</a>
</div>
@@ -62,7 +62,7 @@
<img t-att-src="_img_src" class="me-3 rounded shadow" alt=""/>
<div class="flex-grow-1">
<h4 class="mt-0 mb-0" t-esc="_title"/>
<span><font style="font-size: 14px;" t-esc="_text"/></span>
<span class="small"><t t-esc="_text"/></span>
</div>
</div>
</a>
addons/website/views/snippets/s_mega_menu_little_icons.xml
+2 -2
View File
@@ -55,8 +55,8 @@
</div>
<div class="col-lg-4 p-4 s_mega_menu_gray_area">
<h4 class="o_default_snippet_text">The team</h4>
<p class="text-muted o_default_snippet_text">
<font style="font-size: 14px;">Created in 2021, the company is young and dynamic. Discover the composition of the team and their skills.</font>
<p class="text-muted o_default_snippet_text small">
Created in 2021, the company is young and dynamic. Discover the composition of the team and their skills.
</p>
<a href="#" class="btn btn-primary o_default_snippet_text">Discover our team</a>
</div>
addons/website/views/snippets/s_mega_menu_thumbnails.xml
+4 -4
View File
@@ -57,8 +57,8 @@
<div class="col col-sm-6 col-md-4 col-lg-3 text-center py-2">
<a href="#" class="nav-link p-0 o_default_snippet_text" data-name="Menu Item">
<img class="img-fluid rounded shadow" src="/web/image/website.s_mega_menu_thumbnails_default_image_11" alt=""/>
<span class="d-block p-2">
<b><font style="font-size:14px;">Discover our new products</font></b>
<span class="d-block p-2 small">
<b>Discover our new products</b>
</span>
</a>
</div>
@@ -96,9 +96,9 @@
<a href="#" class="nav-link o_default_snippet_text p-0" data-name="Menu Item">
<img class="img-fluid rounded shadow" t-att-src="_img_src" alt=""/>
<br/>
<span class="d-block p-2">
<span class="d-block p-2 small">
<b>
<font style="font-size:14px;" t-esc="_text"/>
<t t-esc="_text"/>
</b>
</span>
</a>
addons/website/views/snippets/s_picture.xml
+1 -1
View File
@@ -4,7 +4,7 @@
<template id="s_picture" name="Picture">
<section class="s_picture pt48 pb24 o_cc o_cc2">
<div class="container">
<h2 style="text-align: center;"><font style="font-size: 62px;">A punchy Headline</font></h2>
<h2 class="display-3-fs" style="text-align: center;">A punchy Headline</h2>
<p style="text-align: center;">Choose a vibrant image and write an inspiring paragraph about it.<br/> It does not have to be long, but it should reinforce your image.</p>
<p style="text-align: center;"><br/></p>
<div class="row s_nb_column_fixed">
addons/website/views/snippets/s_popup.xml
+1 -1
View File
@@ -15,7 +15,7 @@
<div class="container">
<div class="row s_nb_column_fixed">
<div class="col-lg-10 offset-lg-1 text-center o_cc o_cc1 jumbotron pt48 pb48">
<h2><font style="font-size: 62px;">Win $20</font></h2>
<h2 class="display-3-fs">Win $20</h2>
<p class="lead">Check out now and get $20 off your first order.</p>
<a href="#" class="btn btn-primary">New customer</a>
</div>
addons/website/views/snippets/s_table_of_content.xml
+2 -2
View File
@@ -10,7 +10,7 @@
</div>
<div class="col-lg-9 s_table_of_content_main oe_structure oe_empty" data-name="Content">
<section class="pb16">
<h1 data-anchor="true">Intuitive system</h1>
<h2 data-anchor="true">Intuitive system</h2>
<h4>What you see is what you get</h4>
<p>
Insert text styles like headers, bold, italic, lists, and fonts with
@@ -28,7 +28,7 @@
</p>
</section>
<section class="pb16">
<h1 data-anchor="true">Design features</h1>
<h2 data-anchor="true">Design features</h2>
<h4>Bootstrap-based templates</h4>
<p>
Easily design your own Odoo templates thanks to clean HTML
addons/website/views/snippets/s_text_cover.xml
+1 -1
View File
@@ -6,7 +6,7 @@
<div class="container-fluid">
<div class="row">
<div class="o_colored_level o_cc o_cc_1 col-lg-5 pt160 pb160 px-5">
<h1><span style="font-size: 62px;">Sell Online. <br/>Easily.</span></h1>
<h1 class="display-3">Sell Online. <br/>Easily.</h1>
<p class="lead">Write one or two paragraphs describing your product, services or a specific feature. To be successful your content needs to be useful to your readers.</p>
<a t-att-href="cta_btn_href" class="btn btn-primary"><t t-esc="cta_btn_text">Contact us</t></a>
</div>
addons/website/views/snippets/s_title.xml
+1 -1
View File
@@ -4,7 +4,7 @@
<template id="s_title" name="Title">
<section class="s_title pt40 pb40" data-vcss="001">
<div class="container s_allow_columns">
<h1 style="text-align: center;"><font style="font-size: 62px;">Your Site Title</font></h1>
<h2 class="display-3-fs" style="text-align: center;">Your Site Title</h2>
</div>
</section>
</template>
addons/website_event/views/event_templates_page_misc.xml
+1 -3
View File
@@ -14,9 +14,7 @@
<div class="oe_structure oe_empty" id="oe_structure_website_event_intro_1"/>
<section class="s_title pt32 pb32" data-vcss="001" data-snippet="s_title" data-name="Title">
<div class="container s_allow_columns">
<h1 style="text-align: center;">
<font style="font-size: 62px;" class="o_default_snippet_text">Introduction</font>
</h1>
<h1 class="display-3 o_default_snippet_text" style="text-align: center;">Introduction</h1>
</div>
</section>
<div class="oe_structure oe_empty" id="oe_structure_website_event_intro_2"/>
addons/website_forum/models/forum_forum.py
+1 -1
View File
@@ -29,7 +29,7 @@ class Forum(models.Model):
@api.model
def _get_default_welcome_message(self):
return Markup("""
<h1 style="text-align: center;clear-both"><font style="font-size: 62px; font-weight: bold;">%(message_intro)s</font></h1>
<h2 class="display-3-fs" style="text-align: center;clear-both;font-weight: bold;">%(message_intro)s</h2>
<div class="text-white">
<p class="lead o_default_snippet_text" style="text-align: center;">%(message_post)s</p>
<p style="text-align: center;">
addons/website_forum/views/forum_forum_templates_forum_all.xml
+1 -1
View File
@@ -86,7 +86,7 @@
<div class="oe_structure oe_empty" id="oe_structure_forum_all_top">
<section class="s_cover o_colored_level s_parallax_no_overflow_hidden pt96 pb48" data-scroll-background-ratio="0" data-snippet="s_cover" data-name="Cover">
<div class="s_allow_columns container">
<h1 style="text-align: center;"><font style="font-size: 62px; font-weight: bold;">Community Forums</font></h1>
<h1 class="display-3" style="text-align: center; font-weight: bold;">Community Forums</h1>
<p class="lead" style="text-align: center;">Tap into the collective knowledge of our community by asking your questions in our forums,<br/> where helpful members are ready to assist you.</p>
<p style="text-align: center;">
<a class="mb-2" t-attf-href="/profile/users?forum_origin=#{request.httprequest.path}" data-bs-original-title="" title="" target="_blank">Meet our community members</a>
addons/website_livechat/views/website_livechat.xml
+3 -3
View File
@@ -38,7 +38,7 @@
</div>
<div class="card-body text-center">
<h2 style="margin: 0">
<b style="font-size: 30px">
<b>
<t t-esc="percentage['great']" />
</b>
<small>%</small>
@@ -53,7 +53,7 @@
</div>
<div class="card-body text-center">
<h2 style="margin: 0">
<b style="font-size: 30px">
<b>
<t t-esc="percentage['okay']" />
</b>
<small>%</small>
@@ -68,7 +68,7 @@
</div>
<div class="card-body text-center">
<h2 style="margin: 0">
<b style="font-size: 30px">
<b>
<t t-esc="percentage['bad']" />
</b>
<small>%</small>
addons/website_mass_mailing/views/snippets_templates.xml
+1 -1
View File
@@ -158,7 +158,7 @@ database, without the s_newsletter_list class. See fixNewsletterListClass.
<section class="s_text_block oe_img_bg o_bg_img_center pt88 pb64" data-snippet="s_text_block" data-name="Text"
style="background-image: url('/web/image/website.s_cover_default_image'); background-position: 0 100%;">
<div class="container s_allow_columns">
<h1 style="text-align: center;">Always <b>First</b>.</h1>
<h2 style="text-align: center;">Always <b>First</b>.</h2>
<p style="text-align: center;">Be the first to find out all the latest news,<br/> products, and trends.</p>
</div>
</section>
addons/website_slides/data/slide_slide_demo.xml
+3 -3
View File
@@ -234,7 +234,7 @@
<div class="container">
<div class="row s_nb_column_fixed">
<div class="col-lg-12">
<h1 class="o_default_snippet_text" style="font-size: 62px; text-align: center;">Catchy Headline</h1>
<h1 class="o_default_snippet_text display-3" style="text-align: center;">Catchy Headline</h1>
<p class="lead o_default_snippet_text" style="text-align: center;">Write one or two paragraphs describing your product, services or a specific feature.<br/> To be successful your content needs to be useful to your readers.</p>
<p>
<a href="/contactus" class="btn btn-primary rounded-circle o_default_snippet_text">Contact us</a>
@@ -471,7 +471,7 @@
<div class="container">
<div class="row s_nb_column_fixed">
<div class="col-lg-12">
<h1 class="o_default_snippet_text" style="font-size: 62px; text-align: center;">Catchy Headline</h1>
<h1 class="o_default_snippet_text display-3" style="text-align: center;">Catchy Headline</h1>
<p class="lead o_default_snippet_text" style="text-align: center;">Write one or two paragraphs describing your product, services or a specific feature.<br/> To be successful your content needs to be useful to your readers.</p>
<p class="o_default_snippet_text">
<a href="/contactus" class="btn btn-primary rounded-circle">Contact us</a>
@@ -614,7 +614,7 @@
<div class="container">
<div class="row s_nb_column_fixed">
<div class="col-lg-12">
<h1 class="o_default_snippet_text" style="font-size: 62px; text-align: center;">Foreword</h1>
<h1 class="o_default_snippet_text display-3" style="text-align: center;">Foreword</h1>
<p class="lead o_default_snippet_text" style="text-align: center;">Write one or two paragraphs describing your product, services or a specific feature.<br/> To be successful your content needs to be useful to your readers.</p>
<p>
<a href="/contactus" class="btn btn-primary rounded-circle o_default_snippet_text">Contact us</a>