mirror of
https://github.com/odoo/design-themes.git
synced 2025-10-07 01:18:52 +07:00
Benjamin Vray
44b3badbca
Initially, the background shapes were flipped using only CSS. This was done by adding the classes 'o_we_flip_x' or 'o_we_flip_y' to a shape to flip it. However, this system caused issues as it sometimes left a gap between two connected shapes. As a result, the system was changed with this commit [1], and the classes 'o_we_flip_x' and 'o_we_flip_y' were no longer used from this point on. Despite this change, in our themes, we continued to use these obsolete classes to define whether a shape should be flipped or not. This commit addresses this by removing all instances of 'o_we_flip_x' and 'o_we_flip_y' classes that were still being used in theme snippets and replacing them with the new system, where flipping is defined as a parameter in the background image URL. Note that in stable versions where we cannot modify theme snippets, we have added code to automatically adapt the shapes to the new system (in this commit [2]). [1]: https://github.com/odoo/odoo/commit/42b3ad10e0b32b7fc72f801e2c67d6baf938c566 [2]: https://github.com/odoo/odoo/commit/256ff539afe331544ccb58848f1ecd0eecbe4daa task-2824607 closes odoo/design-themes#639 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
59 lines
3.2 KiB
XML
59 lines
3.2 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<odoo>
|
|
|
|
<template id="s_carousel" inherit_id="website.s_carousel">
|
|
<!-- Slide #1 -->
|
|
<xpath expr="//div[hasclass('carousel-item')]" position="attributes">
|
|
<attribute name="class" add="pb224 pt224 o_cc o_cc5" remove="pb152 pt152" separator=" "/>
|
|
<attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/25","flip":["y"]}</attribute>
|
|
</xpath>
|
|
<xpath expr="//div[hasclass('carousel-content')]" position="replace">
|
|
<div class="carousel-content col-lg-6">
|
|
<h1>Miraillet Festival</h1>
|
|
<p class="lead">From the 12th to the 17th of August, come and enjoy the atmosphere at the Miraillet Festival. Discover the line up below.</p>
|
|
<p><br/></p>
|
|
<p><a href="/contactus" class="btn btn-primary btn-lg mb-2">More Info</a></p>
|
|
</div>
|
|
</xpath>
|
|
<!-- Slide #1 - Shape -->
|
|
<xpath expr="//div[hasclass('carousel-item')]//div[hasclass('container')]" position="before">
|
|
<div class="o_we_shape o_web_editor_Wavy_25" style="background-image: url('/web_editor/shape/web_editor/Wavy/25.svg?c1=o-color-5&c2=o-color-5&flip=y'); background-position: 50% 100%;"/>
|
|
</xpath>
|
|
<!-- Slide #2 -->
|
|
<xpath expr="//div[hasclass('carousel-item')][2]" position="attributes">
|
|
<attribute name="class" add="pb224 pt224 o_cc o_cc2" remove="pt96 pb96" separator=" "/>
|
|
<attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/25","flip":[]}</attribute>
|
|
</xpath>
|
|
<xpath expr="(//div[hasclass('carousel-content')])[2]" position="replace">
|
|
<div class="carousel-content col-lg-6">
|
|
<h1>6 Days Pass</h1>
|
|
<p class="lead">Tickets will be on sale soon. Do not miss our 6 Days Pass. Free camping!</p>
|
|
<p><br/></p>
|
|
<p><a href="/" class="btn btn-primary btn-lg mb-2">More Info</a></p>
|
|
</div>
|
|
</xpath>
|
|
<!-- Slide #2 - Shape -->
|
|
<xpath expr="//div[hasclass('carousel-item')][2]//div[hasclass('container')]" position="before">
|
|
<div class="o_we_shape o_web_editor_Wavy_25 o_second_extra_shape_mapping"/>
|
|
</xpath>
|
|
<!-- Slide #3 -->
|
|
<xpath expr="//div[hasclass('carousel-item')][3]" position="attributes">
|
|
<attribute name="class" add="pb224 pt224 o_cc o_cc5" remove="pt128 pb128" separator=" "/>
|
|
<attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/25","flip":["y"]}</attribute>
|
|
</xpath>
|
|
<xpath expr="(//div[hasclass('carousel-content')])[3]" position="replace">
|
|
<div class="carousel-content col-lg-6">
|
|
<h1>Recent Editions</h1>
|
|
<p class="lead">Discover what makes the reputation of the Miraillet festival through these after-movies.</p>
|
|
<p><br/></p>
|
|
<p><a href="/" class="btn btn-primary btn-lg mb-2">More Info</a></p>
|
|
</div>
|
|
</xpath>
|
|
<!-- Slide #3 - Shape -->
|
|
<xpath expr="//div[hasclass('carousel-item')][3]//div[hasclass('container')]" position="before">
|
|
<div class="o_we_shape o_web_editor_Wavy_25 o_third_extra_shape_mapping" style="background-image: url('/web_editor/shape/web_editor/Wavy/25.svg?c1=o-color-2&c2=o-color-2&flip=y'); background-position: 50% 100%;"/>
|
|
</xpath>
|
|
</template>
|
|
|
|
</odoo>
|