[FIX] web_editor: fix position of shapes

This commit will fix a bug related to the position
of the shapes Blocks/01 and Blocks/02.
- Now, they can be connected when using together.
- Avoid a bug of position when the snippet is too tall.

Fix related to the PR #70843

closes odoo/odoo#71809

X-original-commit: b5f135f83e576f6b552392249913dacca45a7650
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
Brieuc-brd
2021-06-07 12:07:22 +00:00
parent da1ec48481
commit a11d043245
4 changed files with 55 additions and 2 deletions
@@ -0,0 +1,26 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 24.1.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1400 570" xml:space="preserve">
<style type="text/css">
.st0{fill:url(#SVGID_1_);}
.st1{opacity:0.44;fill:#383E45;enable-background:new;}
.st2{opacity:0.17;fill:#383E45;enable-background:new;}
.st3{opacity:0.13;fill:#383E45;enable-background:new;}
.st4{opacity:.07;fill:#F6F6F6;enable-background:new;}
.st5{opacity:0.13;fill:#3AADAA;enable-background:new;}
.st6{opacity:0.44;fill:#3AADAA;enable-background:new;}
</style>
<radialGradient id="SVGID_1_" cx="1516.38" cy="335.54" r="1778.8101" gradientTransform="matrix(1 0 0 -1 0 572)" gradientUnits="userSpaceOnUse">
<stop offset="0" style="stop-color:#F6F6F6"/>
<stop offset="0.35" style="stop-color:#3AADAA"/>
<stop offset="0.99" style="stop-color:#383E45"/>
</radialGradient>
<polygon class="st0" points="1400,323 0,570 0,0 1400,0 "/>
<polygon class="st1" points="0,0 0.2,90.6 281.9,42.1 281.9,0 "/>
<polygon class="st2" points="364.6,88.5 0,144.1 0,233.6 364.6,177.9 "/>
<polygon class="st3" points="518.4,0 281.9,0 281.9,42.1 "/>
<polygon class="st4" points="599.5,291.9 0,397.6 0,487 599.5,381.3 "/>
<polygon class="st5" points="871.1,154.5 427.1,232.8 427.1,322.3 871.1,244 "/>
<polygon class="st6" points="1098.1,0 1079,3.4 1079,92.8 1400,36.6 1400,0 "/>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

@@ -0,0 +1,25 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 24.1.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1400 570" xml:space="preserve">
<style type="text/css">
.st0{fill:url(#SVGID_1_);}
.st1{opacity:0.13;fill:#3AADAA;enable-background:new;}
.st2{opacity:0.1;fill:#383E45;enable-background:new;}
.st3{opacity:0.44;fill:#383E45;enable-background:new;}
.st4{opacity:0.44;fill:#3AADAA;enable-background:new;}
.st5{opacity:0.13;fill:#383E45;enable-background:new;}
</style>
<radialGradient id="SVGID_1_" cx="1517.8101" cy="1258.9148" r="1750.687" gradientTransform="matrix(1 0 0 1 0 -452)" gradientUnits="userSpaceOnUse">
<stop offset="0" style="stop-color:#F6F6F6"/>
<stop offset="0.35" style="stop-color:#3AADAA"/>
<stop offset="0.99" style="stop-color:#383E45"/>
</radialGradient>
<polygon class="st0" points="0,246.6 1400,0 1400,570 0,570 "/>
<polygon class="st1" points="753.4,570 1118,505.7 1118,416.2 753.4,480.5 "/>
<polygon class="st2" points="306.9,282.1 906.4,176.3 906.4,87 306.9,192.6 "/>
<polygon class="st1" points="712.6,300 1156.6,221.7 1156.6,132.3 712.6,210.5 "/>
<polygon class="st3" points="0,570 0,568 281.9,518.3 281.9,570 "/>
<polygon class="st4" points="1098.2,570 1400,516.8 1400,570 "/>
<polygon class="st5" points="518.4,476.6 518.4,570 281.9,570 281.9,518.3 "/>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

@@ -676,7 +676,9 @@ $o-bg-shapes: ('web_editor': (
'Blobs/11': ('position': center, 'size': 100% auto, 'colors': (1), 'repeat-y': false),
'Blobs/12': ('position': bottom, 'size': 100% auto, 'colors': (1), 'repeat-y': false),
'Blocks/01': ('position': bottom, 'size': 100% auto, 'colors': (1, 3, 5), 'repeat-y': false),
'Blocks/01_001': ('position': top, 'size': 100% auto, 'colors': (1, 3, 5), 'repeat-y': false),
'Blocks/02': ('position': top, 'size': 100% auto, 'colors': (1, 3, 5), 'repeat-y': false),
'Blocks/02_001': ('position': bottom, 'size': 100% auto, 'colors': (1, 3, 5), 'repeat-y': false),
'Blocks/03': ('position': bottom, 'size': 100% auto, 'colors': (1, 4), 'repeat-y': false),
'Blocks/04': ('position': bottom, 'size': 100% auto, 'colors': (1, 2, 3, 5), 'repeat-y': false),
'Bold/01': ('position': top, 'size': 100% auto, 'colors': (2), 'repeat-y': false),
+2 -2
View File
@@ -252,8 +252,8 @@
<we-button data-shape="web_editor/Rainy/02" data-select-label="Rainy 02"/>
<we-button data-shape="web_editor/Rainy/06" data-select-label="Rainy 06"/>
<we-button data-shape="web_editor/Rainy/07" data-select-label="Rainy 07"/>
<we-button data-shape="web_editor/Blocks/02" data-select-label="Blocks 02"/>
<we-button data-shape="web_editor/Blocks/01" data-select-label="Blocks 01"/>
<we-button data-shape="web_editor/Blocks/02_001" data-select-label="Blocks 02"/>
<we-button data-shape="web_editor/Blocks/01_001" data-select-label="Blocks 01"/>
<we-button data-shape="web_editor/Rainy/03" data-select-label="Rainy 03"/>
<we-button data-shape="web_editor/Rainy/04" data-select-label="Rainy 04"/>
<we-button data-shape="web_editor/Rainy/05_001" data-select-label="Rainy 05"/>