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_*: use minimal format for highlighted text content

Browse Source 
*: buzzy, clean, notes

A highlighted text has the following structure:

```
<span class="o_text_highlight o_text_highlight_[highlightId]"
    style="--text-highlight-width: ...; --text-highlight-color: ...;">
    <span class="o_text_highlight_item">
        text content (line 1) ...
        <svg.../>
    </span>
    [<br/>]
    <span class="o_text_highlight_item">
        text content (line 2) ...
        <svg.../>
    </span>
    ...
</span>
```

Which is saved in a minimal format that allows the JS code to rebuild
the SVGs when it's needed:

```
<span class="o_text_highlight o_text_highlight_[highlightId]"
    style="--text-highlight-width: ...; --text-highlight-color: ...;">
    text content ...
</span>
```

The goal of this commit is to use the simplified format for theme
customizations and adapt the code from the "Snippets Preview" and the
"New Page Templates Preview" to be able to build the highlights using
this format when provided in XML.

task-4215788

closes odoo/design-themes#956

Related: odoo/odoo#181884
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
Mehdi Outagant (MOU)
2024-09-27 17:02:35 +02:00
committed by qsm-odoo
parent 971b323f58
commit ab8f6a8fce
11 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme_notes/views/snippets/s_company_team_shapes.xml
+1 -1
View File
@@ -10,7 +10,7 @@
<div class="o_we_shape o_web_editor_Origins_05" style="background-image: url('/web_editor/shape/web_editor/Origins/05.svg?c3=o-color-1');"></div>
</xpath>
<xpath expr="//h2" position="replace">
<h2 style="text-align: center;"><span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 4px; --text-highlight-color: var(--o-color-4);"><span class="o_text_highlight_item">Meet The Band<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" d="M 0,44 h 285.4921875" class="o_text_highlight_path_underline"></path></svg></span></span></h2>
<h2 style="text-align: center;"><span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 4px; --text-highlight-color: var(--o-color-4);">Meet The Band</span></h2>
</xpath>
</template>
theme_notes/views/snippets/s_framed_intro.xml
+1 -1
View File
@@ -8,7 +8,7 @@
</xpath>
<!-- Title -->
<xpath expr="//h1" position="replace" mode="inner">
Unplug &amp; Unwind: The <span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 6px; --text-highlight-color: var(--o-color-1);"><span class="o_text_highlight_item">Ultimate<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" d="M 0,59 h 208.65625" class="o_text_highlight_path_underline"></path></svg></span></span> Music Experience
Unplug &amp; Unwind: The <span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 6px; --text-highlight-color: var(--o-color-1);">Ultimate</span> Music Experience
</xpath>
<!-- Image -->
<xpath expr="//div[hasclass('col-lg-5')]" position="attributes">
theme_notes/views/snippets/s_image_gallery.xml
+1 -1
View File
@@ -18,7 +18,7 @@
</xpath>
<xpath expr="//div[hasclass('row')]/." position="before">
<div class="col-lg-12">
<h2 style="text-align: center;"><span class="o_text_highlight o_text_highlight_underline o_translate_inline" style="--text-highlight-color: var(--o-color-4); --text-highlight-width: 3px;"><span class="o_text_highlight_item">Band Gallery<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" d="M 0,44 h 241.765625" class="o_text_highlight_path_underline"></path></svg></span></span></h2>
<h2 style="text-align: center;"><span class="o_text_highlight o_text_highlight_underline o_translate_inline" style="--text-highlight-color: var(--o-color-4); --text-highlight-width: 3px;">Band Gallery</span></h2>
<p>
<br/>
</p>
theme_notes/views/snippets/s_image_text.xml
+1 -1
View File
@@ -16,7 +16,7 @@
</xpath>
<!-- Title & Paragraph -->
<xpath expr="//h2" position="replace" mode="inner">
<span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 3px; --text-highlight-color: var(--o-color-1);"><span class="o_text_highlight_item">Redefining modern rocks<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" d="M 0,34 h 373.15625" class="o_text_highlight_path_underline"/></svg></span></span>
<span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 3px; --text-highlight-color: var(--o-color-1);">Redefining modern rocks</span>
</xpath>
<xpath expr="//p" position="replace" mode="inner">
<br/>
theme_notes/views/snippets/s_text_image.xml
+1 -1
View File
@@ -9,7 +9,7 @@
</xpath>
<!-- Title & Paragraph -->
<xpath expr="//h2" position="replace" mode="inner">
<span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 3px; --text-highlight-color: var(--o-color-1);"><span class="o_text_highlight_item">Our History<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" d="M 0,34 h 168.0625" class="o_text_highlight_path_underline"></path></svg></span></span>
<span class="o_text_highlight o_translate_inline o_text_highlight_underline" style="--text-highlight-width: 3px; --text-highlight-color: var(--o-color-1);">Our History</span>
</xpath>
<xpath expr="//p" position="replace" mode="inner">
<br/>
theme_notes/views/snippets/s_three_columns.xml
+1 -1
View File
@@ -10,7 +10,7 @@
<xpath expr="//div[hasclass('row')]/." position="before">
<div class="col-lg-12">
<h2 style="text-align: center;">
<span class="o_text_highlight o_text_highlight_underline o_translate_inline" style="--text-highlight-width: 4px; --text-highlight-color: var(--o-color-4);"><span class="o_text_highlight_item">Upcoming concerts<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" d="M 0,44 h 371.046875" class="o_text_highlight_path_underline"></path></svg></span></span>
<span class="o_text_highlight o_text_highlight_underline o_translate_inline" style="--text-highlight-width: 4px; --text-highlight-color: var(--o-color-4);">Upcoming concerts</span>
</h2>
<p>
<br/>