oca/oca-ocb-web
2
0
Fork 0
mirror of https://github.com/bringout/oca-ocb-web.git synced 2026-04-19 12:12:02 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

replace stale web_editor with html_editor and html_builder for 19.0

Browse source 
web_editor was removed in Odoo 19.0 and replaced by html_editor
and html_builder. The old web_editor was incorrectly included in
the 19.0 vanilla import.

🤖 assisted by claude
This commit is contained in:
Ernad Husremovic 2026-03-09 15:31:13 +01:00
parent 4b94f0abc5
commit f866779561
1513 changed files with 396049 additions and 358525 deletions
Download patch file Download diff file Expand all files Collapse all files

124
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/01.svg Normal file
View file

@ -0,0 +1,124 @@
<svg viewBox="0 0 800 630" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<g id="gradients">
<linearGradient spreadMethod="pad" id="owb_top_shape_1_gradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-opacity:.5" stop-color="#3AADAA" id="owb_top_shape_1_gradient_stop_1">
<animate attributeName="stop-color" values="#3AADAA;#FFFFFF;#3AADAA" dur="30s" repeatCount="indefinite"/>
</stop>
<stop offset="100%" style="stop-opacity:1" stop-color="#FFFFFF" id="owb_top_shape_1_gradient_stop_2">
<animate attributeName="stop-color" values="#FFFFFF;#7C6576;#FFFFFF" dur="30s" repeatCount="indefinite"/>
</stop>
</linearGradient>
<linearGradient spreadMethod="pad" id="owb_top_shape_2_gradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-opacity:.5" stop-color="#7C6576" id="owb_top_shape_2_gradient_stop_1">
<animate attributeName="stop-color" values="#7C6576;#3AADAA;#7C6576" dur="30s" repeatCount="indefinite"/>
</stop>
<stop offset="100%" style="stop-opacity:1" stop-color="#FFFFFF" id="owb_top_shape_2_gradient_stop_2">
<animate attributeName="stop-color" values="#FFFFFF;#3AADAA;#FFFFFF" dur="30s" repeatCount="indefinite"/>
</stop>
</linearGradient>
<linearGradient spreadMethod="pad" id="owb_top_squares_1_gradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-opacity:.5;" stop-color="#3AADAA" id="owb_top_squares_1_gradient_stop_1">
<animate attributeName="stop-color" values="#3AADAA;#F6F6F6;#383E45;#3AADAA" dur="30s" repeatCount="indefinite"/>
</stop>
<stop offset="100%" style="stop-opacity:1;" stop-color="#FFFFFF" id="owb_top_squares_1_gradient_stop_2">
<animate attributeName="stop-color" values="#FFFFFF;#383E45;#F6F6F6;#FFFFFF" dur="30s" repeatCount="indefinite"/>
</stop>
</linearGradient>
<linearGradient spreadMethod="pad" id="owb_top_squares_2_gradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-opacity:.5;" stop-color="#383E45" id="owb_top_squares_2_gradient_stop_1">
<animate attributeName="stop-color" values="#383E45;#3AADAA;#383E45;" dur="30s" repeatCount="indefinite"/>
</stop>
<stop offset="100%" style="stop-opacity:1;" stop-color="#383E45" id="owb_top_squares_2_gradient_stop_2">
<animate attributeName="stop-color" values="#383E45;#3AADAA;#383E45;" dur="30s" repeatCount="indefinite"/>
</stop>
</linearGradient>
</g>
<g id="paths">
<path id="owb_top_shape_oval" fill="url(#owb_top_shape_1_gradient)" d="M 378.1,121.2 C 408.4,150 417.2,197.9 411,245.8 404.8,293.7 383.5,341.7 353.4,370.7 303.2,419.1 198.7,427.7 144.5,383.8 86.18,336.5 67.13,221.3 111.9,161 138.6,125 188.9,99.62 240.7,90.92 292.4,82.24 345.6,90.32 378.1,121.2 Z">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="25s" values="0;10;-10;10;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
<animate attributeName="d" dur="30s" repeatCount="indefinite"
values="
M 378.1,121.2 C 408.4,150 417.2,197.9 411,245.8 404.8,293.7 383.5,341.7 353.4,370.7 303.2,419.1 198.7,427.7 144.5,383.8 86.18,336.5 67.13,221.3 111.9,161 138.6,125 188.9,99.62 240.7,90.92 292.4,82.24 345.6,90.32 378.1,121.2 Z;
M 418.1,159.8 C 460.9,222.9 497,321.5 452.4,383.4 417.2,432.4 371.2,405.6 271.3,420.3 137.2,440 90.45,500.6 42.16,442.8 -9.572,381 86.33,289.1 117.7,215.5 144.3,153.4 145.7,54.21 212.7,36.25 290.3,15.36 373.9,94.6 418.1,159.8 Z;
M 451.5,185.8 C 441.5,266.2 339.6,305 272.3,350.2 207.7,393.6 226.7,444.7 182.6,447.9 132.8,451.4 83.97,399.9 66.37,353.1 34.6,268.4 41.16,141.8 112,85.44 186.1,26.33 313.8,54.1 396,101.4 425.2,118.2 455.6,152.4 451.5,185.8 Z;
M 368.1,46.42 C 461,96.69 473.7,266.2 422.3,358.4 379.1,436 259.6,484.8 175,457.5 107.5,435.7 12.65,329.8 60.93,277.7 95.18,240.8 154,379.3 194.2,348.9 250.7,306 116,204.1 148.4,140.9 184.8,70.02 298,8.455 368.1,46.42 Z;
M 378.1,121.2 C 408.4,150 417.2,197.9 411,245.8 404.8,293.7 383.5,341.7 353.4,370.7 303.2,419.1 198.7,427.7 144.5,383.8 86.18,336.5 67.13,221.3 111.9,161 138.6,125 188.9,99.62 240.7,90.92 292.4,82.24 345.6,90.32 378.1,121.2 Z"/>
</path>
<polygon id="owb_top_shape_polygon" fill="url(#owb_top_shape_2_gradient)" points="41 41 150.363333 41 259 41 259 150 259 259 150 259 41 259 41 150.363333">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="15s" values="0;-20;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
<animate attributeName="points" dur="15s" repeatCount="indefinite"
values="
41 41 150.363333 41 259 41 259 150 259 259 150 259 41 259 41 150.363333;
72 79 150.5 0 226 79 300 150 226 223 150 300 72 223 0 150.5;
26 92 150.5 16 271.5 92 271.5 150 271.5 210.5 150.5 283.5 26 210.5 26 150;
88 114.5 150 0 210.5 114.5 257 207 300 300 150 300 0 300 45 207;
26 92 150.5 16 271.5 92 271.5 150 271.5 210.5 150.5 283.5 26 210.5 26 150;
72 79 150.5 0 226 79 300 150 226 223 150 300 72 223 0 150.5;
41 41 150.363333 41 259 41 259 150 259 259 150 259 41 259 41 150.363333"/>
</polygon>
<g id="owb_top_squares_1" fill="url(#owb_top_squares_1_gradient)" opacity=".5">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="30s" values="0;7;-2;3;0" repeatCount="indefinite" calcMode="spline"
keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
<polygon points="122 114 122 122 114 122 114 114"/>
<polygon points="108 114 108 122 100 122 100 114"/>
<polygon points="94 114 94 122 86 122 86 114"/>
<polygon points="79 114 79 122 71 122 71 114"/>
<polygon points="65 114 65 122 57 122 57 114"/>
<polygon points="122 100 122 108 114 108 114 100"/>
<polygon points="108 100 108 108 100 108 100 100"/>
<polygon points="94 100 94 108 86 108 86 100"/>
<polygon points="79 100 79 108 71 108 71 100"/>
<polygon points="65 100 65 108 57 108 57 100"/>
<polygon points="122 86 122 94 114 94 114 86"/>
<polygon points="108 86 108 94 100 94 100 86"/>
<polygon points="94 86 94 94 86 94 86 86"/>
<polygon points="79 86 79 94 71 94 71 86"/>
<polygon points="65 86 65 94 57 94 57 86"/>
<polygon points="122 71 122 79 114 79 114 71"/>
<polygon points="108 71 108 79 100 79 100 71"/>
<polygon points="94 71 94 79 86 79 86 71"/>
<polygon points="79 71 79 79 71 79 71 71"/>
<polygon points="65 71 65 79 57 79 57 71"/>
<polygon points="122 57 122 65 114 65 114 57"/>
<polygon points="108 57 108 65 100 65 100 57"/>
<polygon points="94 57 94 65 86 65 86 57"/>
<polygon points="79 57 79 65 71 65 71 57"/>
<polygon points="65 57 65 65 57 65 57 57"/>
</g>
<g id="owb_top_squares_2" fill="url(#owb_top_squares_2_gradient)" opacity=".8">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="30s" values="0;-8;3;-4;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
<polygon points="122 114 122 122 114 122 114 114"/>
<polygon points="108 114 108 122 100 122 100 114"/>
<polygon points="94 114 94 122 86 122 86 114"/>
<polygon points="79 114 79 122 71 122 71 114"/>
<polygon points="65 114 65 122 57 122 57 114"/>
<polygon points="122 100 122 108 114 108 114 100"/>
<polygon points="108 100 108 108 100 108 100 100"/>
<polygon points="94 100 94 108 86 108 86 100"/>
<polygon points="79 100 79 108 71 108 71 100"/>
<polygon points="65 100 65 108 57 108 57 100"/>
<polygon points="122 86 122 94 114 94 114 86"/>
<polygon points="108 86 108 94 100 94 100 86"/>
<polygon points="94 86 94 94 86 94 86 86"/>
<polygon points="79 86 79 94 71 94 71 86"/>
<polygon points="65 86 65 94 57 94 57 86"/>
<polygon points="122 71 122 79 114 79 114 71"/>
<polygon points="108 71 108 79 100 79 100 71"/>
<polygon points="94 71 94 79 86 79 86 71"/>
<polygon points="79 71 79 79 71 79 71 71"/>
<polygon points="65 71 65 79 57 79 57 71"/>
<polygon points="122 57 122 65 114 65 114 57"/>
<polygon points="108 57 108 65 100 65 100 57"/>
<polygon points="94 57 94 65 86 65 86 57"/>
<polygon points="79 57 79 65 71 65 71 57"/>
<polygon points="65 57 65 65 57 65 57 57"/>
</g>
</g>
</defs>
<use class="owb_shapes_intro" x="80" y="160" transform="matrix(.5,0,0,.5,0,0)" xlink:href="#owb_top_shape_oval"/>
<use class="owb_shapes_intro" x="950" y="800" transform="matrix(.5,0,0,.5,0,0)"
xlink:href="#owb_top_shape_polygon"/>
<use x="500" y="80" xlink:href="#owb_top_squares_1"/>
<use x="30" y="400" xlink:href="#owb_top_squares_2"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 8.7 KiB

137
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/02.svg Normal file
View file

@ -0,0 +1,137 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1440 450">
<defs>
<g id="gradients">
<linearGradient id="gradient_1" x1="306.5" y1="110.8" x2="100.54" y2="417.02" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#3AADAA" style="stop-opacity:0"/>
<stop offset="1" stop-color="#3AADAA"/>
</linearGradient>
<linearGradient id="gradient_2" x1="39.43" y1="19" x2="118.98" y2="107.27" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#383E45" style="stop-opacity:0"/>
<stop offset="1" stop-color="#383E45"/>
</linearGradient>
<linearGradient id="gradient_2-2" x1="49.76" y1="9.69" x2="129.31" y2="97.96" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-3" x1="60.09" y1="0.39" x2="139.64" y2="88.65" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-4" x1="30.12" y1="27.39" x2="109.67" y2="115.66" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-5" x1="40.45" y1="18.08" x2="120" y2="106.35" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-6" x1="50.78" y1="8.77" x2="130.33" y2="97.04" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-7" x1="20.81" y1="35.78" x2="100.37" y2="124.05" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-8" x1="31.14" y1="26.47" x2="110.69" y2="114.74" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-9" x1="41.47" y1="17.16" x2="121.02" y2="105.43" xlink:href="#gradient_2"/>
<linearGradient id="gradient_3" x1="1208.09" y1="-11.9" x2="1440.2" y2="267.4" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#7C6576"/>
<stop offset="1" stop-color="#7C6576" style="stop-opacity:0"/>
</linearGradient>
</g>
</defs>
<polygon id="shape_1" points="1314.26 29.42 1349.55 80.57 1400.7 115.86 1349.55 151.15 1314.26 202.3 1278.97 151.15 1227.82 115.86 1278.97 80.57 1314.26 29.42" fill="url(#gradient_3)">
<animate attributeName="points" dur="45s" repeatCount="indefinite"
values="
1314.26 29.42 1349.55 80.57 1400.7 115.86 1349.55 151.15 1314.26 202.3 1278.97 151.15 1227.82 115.86 1278.97 80.57 1314.26 29.42;
1293.88 103.21 1372.04 104.76 1373.58 182.91 1372.04 261.07 1293.88 262.62 1215.72 261.07 1214.18 182.91 1215.72 104.76 1293.88 103.21;
1238.95 152.19 1306.99 177.84 1332.64 245.88 1306.99 313.93 1238.95 339.57 1170.91 313.93 1145.26 245.88 1170.91 177.84 1238.95 152.19;
1231.12 48.94 1302.76 80.23 1274.34 153.05 1243.05 224.69 1170.23 196.26 1098.59 164.98 1127.02 92.16 1158.3 20.51 1231.12 48.94;
1314.26 29.42 1349.55 80.57 1400.7 115.86 1349.55 151.15 1314.26 202.3 1278.97 151.15 1227.82 115.86 1278.97 80.57 1314.26 29.42"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
</polygon>
<path id="shape_2" d="M262.66 299.63c.66 31.1-22.32 61.4-54.7 85.85C175.74 410 134.35 428.59 107.1 415.87C79.85 403.15 66.59 359 71.82 326.48c5.14-32.79 28.63-54.1 55.14-72.32c26.75-18.31 56.37-33.59 83.53-25.49C237.56 236.94 262 268.53 262.66 299.63Z" fill="url(#gradient_1)">
<animate attributeName="d" dur="30s" repeatCount="indefinite"
values="
M262.66 299.63c.66 31.1-22.32 61.4-54.7 85.85C175.74 410 134.35 428.59 107.1 415.87C79.85 403.15 66.59 359 71.82 326.48c5.14-32.79 28.63-54.1 55.14-72.32c26.75-18.31 56.37-33.59 83.53-25.49C237.56 236.94 262 268.53 262.66 299.63Z;
M238.16 203.32c18.77 25.63 7 75.79-17.68 107.91c-24.68 32.12-62.25 46.19-92 41.5c-29.59-4.51-51.6-27.61-67.12-54.49c-15.52-26.71-24.54-57.38-13.71-78.5c11-21.11 42-32.84 82.28-38.07C170 176.44 219.22 177.52 238.16 203.32Z;
M294.9 176.2c19.88 37.27 33.59 75 20.55 95.26c-13.04 20.26-52.64 22.73-93.42 23.4c-40.78.67-82.73-.5-93.92-19.72c-11.37-19.22 8.18-56.32 29.08-94.26c21.05-37.77 43.62-76.21 67.68-77.21C249.1 102.67 275 139.1 294.9 176.2Z;
M262.66 299.63c.66 31.1-22.32 61.4-54.7 85.85C175.74 410 134.35 428.59 107.1 415.87C79.85 403.15 66.59 359 71.82 326.48c5.14-32.79 28.63-54.1 55.14-72.32c26.75-18.31 56.37-33.59 83.53-25.49C237.56 236.94 262 268.53 262.66 299.63Z"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
<line id="line_1" x1="335.3" y1="106.6" x2="208.7" y2="233.2" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<line id="line_2" x1="335.3" y1="121.31" x2="208.7" y2="247.91" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" begin="1s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<line id="line_3" x1="335.3" y1="136.02" x2="208.7" y2="262.62" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" begin="2s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<line id="line_4" x1="335.3" y1="150.73" x2="208.7" y2="277.33" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" begin="3s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<g id="circles" style="transform-box: fill-box;">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="15s" values="0;15;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="15s" values="0 0;5 15;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95" additive="sum"/>
<circle cx="73.33" cy="56.62" r="4.36" fill="url(#gradient_2)"/>
<circle cx="92.05" cy="56.62" r="4.36" fill="url(#gradient_2-2)"/>
<circle cx="110.77" cy="56.62" r="4.36" fill="url(#gradient_2-3)"/>
<circle cx="73.33" cy="75.34" r="4.36" fill="url(#gradient_2-4)"/>
<circle cx="92.05" cy="75.34" r="4.36" fill="url(#gradient_2-5)"/>
<circle cx="110.77" cy="75.34" r="4.36" fill="url(#gradient_2-6)"/>
<circle cx="73.33" cy="94.05" r="4.36" fill="url(#gradient_2-7)"/>
<circle cx="92.05" cy="94.05" r="4.36" fill="url(#gradient_2-8)"/>
<circle cx="110.77" cy="94.05" r="4.36" fill="url(#gradient_2-9)"/>
</g>
<g id="squares" style="transform-box: fill-box;" transform-origin="right bottom">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="15s" values="0;-2;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="15s" values="0;-20;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95" additive="sum"/>
<rect id="square_1" x="1242.56" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_2" x="1266.49" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.1s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_3" x="1290.41" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.2s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_4" x="1314.33" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.3s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_5" x="1338.26" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.4s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_6" x="1362.18" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.5s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_7" x="1386.1" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.6s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_8" x="1242.56" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.7s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_9" x="1266.49" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.8s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_10" x="1290.41" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.9s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_11" x="1314.33" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_12" x="1338.26" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.1s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_13" x="1362.18" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.2s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_14" x="1386.1" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.3s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_15" x="1242.56" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.4s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_16" x="1266.49" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.5s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_17" x="1290.41" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.6s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_18" x="1314.33" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.7s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_19" x="1338.26" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.8s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_20" x="1362.18" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.9s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_21" x="1386.1" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="2s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 12 KiB

120
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/03.svg Normal file
View file

@ -0,0 +1,120 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1440 450">
<style>
@keyframes rotate {
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}
@keyframes rotate_reverse {
0% {transform: rotate(0deg);}
100% {transform: rotate(-360deg);}
}
@keyframes rotate_scale {
0% {transform: rotate(0deg) scale(1);}
50% {transform: rotate(180deg) scale(.8);}
100% {transform: rotate(360deg) scale(1);}
}
@keyframes translate_v {
0%, 100% {transform: translate(0, 0);}
50% {transform: translate(0, -10%);}
}
@keyframes shape_transform_4 {
0%, 100% {transform: translate(0, 0) rotate(0deg);}
50% {transform: translate(30%, 30%) rotate(360deg);}
}
@keyframes shape_transform_6 {
0%, 100% {transform: translate(0, 0);}
50% {transform: translate(0, 10%);}
}
@keyframes shape_transform_8 {
0%, 100% {transform: translate(0, 0) rotate(0deg);}
50% {transform: translate(0, 10%) rotate(-720deg);}
}
@keyframes shape_transform_9 {
0%, 100% {transform: translate(0, 0) scale(1, 1);}
50% {transform: translate(0, 15%) scale(.8, 1);}
}
path {
transform-box: fill-box;
transform-origin: center;
}
#shape_transform_1 {animation: rotate_scale 6s linear infinite;}
#shape_transform_2 {animation: rotate 3s linear infinite;}
#shape_transform_3 {animation: translate_v 10s linear infinite;}
#shape_transform_4 {animation: shape_transform_4 5s linear infinite;}
#shape_transform_6 {animation: shape_transform_6 8s linear infinite;}
#shape_transform_7 {animation: rotate_scale 6s linear infinite;}
#shape_transform_8 {animation: shape_transform_8 8s linear infinite;}
#shape_transform_9 {animation: shape_transform_9 8s linear infinite;}
#shape_transform_10 {animation: rotate_reverse 15s linear infinite;}
#shape_transform_11 {animation: translate_v 5s linear infinite;}
#shape_transform_12 {animation: translate_v 5s linear infinite;}
#shape_transform_13 {animation: rotate 10s linear infinite;}
</style>
<path id="shape_morph_1" d="M1201.07 311c54.9 50.27 133.1 39.24 189-19.59c55.9-58.83 44.67-150.88-20.13-188.92c-64.8-38.04-136.26-36.69-189 19.59C1128.2 178.36 1146.17 260.69 1201.07 311Z" fill="#F6F6F6">
<animate attributeName="d" dur="15s" repeatCount="indefinite"
values="
M1201.07 311c54.9 50.27 133.1 39.24 189-19.59c55.9-58.83 44.67-150.88-20.13-188.92c-64.8-38.04-136.26-36.69-189 19.59C1128.2 178.36 1146.17 260.69 1201.07 311Z;
M1213.61 291.65c64.66 36.88 102.12 82.17 158 23.34c55.88-58.83 43.55-171.1-21.25-209.14c-64.8-38.04-122.18-59-174.9-2.73C1122.74 159.39 1149.7 255.19 1213.61 291.65Z;
M1213.61 291.65c50 51.67 110.84 86.08 166.72 27.25c55.88-58.83 7.87-161.94-37.6-221.77c-41.41-54.49-129.63-61.31-167.27 6C1140.26 166.06 1162.47 238.75 1213.61 291.65Z;
M1201.07 311c54.9 50.27 133.1 39.24 189-19.59c55.9-58.83 44.67-150.88-20.13-188.92c-64.8-38.04-136.26-36.69-189 19.59C1128.2 178.36 1146.17 260.69 1201.07 311Z"/>
</path>
<path id="shape_transform_1" d="M1221.2,337.28a20.43,20.43,0,0,0,29.2-3.07c7.22-8.91,6.06-23.64-3.06-29.2s-22.55-7.67-29.2,3.08S1211.88,329.74,1221.2,337.28Z" fill="#3AADAA"/>
<path id="shape_transform_2" d="M1262.88,309.53c-3.54,1.32-4.84,5.11-3.47,9a6.16,6.16,0,0,0,9,3.44c3.21-2.06,4.79-5.31,3.46-9S1266.41,308.21,1262.88,309.53Z" fill="#3AADAA"/>
<path id="shape_transform_3" d="M1188.48,256.78c22.39,20.51,54.29,16,77.07-8s18.22-61.53-8.2-77-55.57-15-77.07,8S1166.1,236.28,1188.48,256.78Z" fill="#383E45"/>
<path id="shape_transform_4" d="M1259.18,271.33c2.78,2.55,6.74,2,9.58-1a6.16,6.16,0,0,0-1-9.58c-3.29-1.92-6.91-1.86-9.58,1S1256.39,268.79,1259.18,271.33Z" fill="#383E45"/>
<path d="M1269.72,254.38c1.39,1.28,3.37,1,4.79-.49a3.08,3.08,0,0,0-.51-4.79,3.66,3.66,0,0,0-4.79.49A3.34,3.34,0,0,0,1269.72,254.38Z" fill="#383E45"/>
<path id="shape_morph_2" d="M1060.75 420.62c33.16 26.85 86.09 20.64 119.92-12.49c33.83-33.13 29.14-92.2-12.71-119.89c-41.85-27.69-90.31-24.07-119.92 12.49C1018.43 337.29 1027.6 393.77 1060.75 420.62Z" fill="#7C6576">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M1060.75 420.62c33.16 26.85 86.09 20.64 119.92-12.49c33.83-33.13 29.14-92.2-12.71-119.89c-41.85-27.69-90.31-24.07-119.92 12.49C1018.43 337.29 1027.6 393.77 1060.75 420.62Z;
M1070.48 414.61c23.75 35.44 82.77 37.49 116.6 4.36c33.83-33.13 7.61-99.08-34.24-126.77c-41.85-27.69-70.85-33.1-100.46 3.46C1022.77 332.22 1048.32 381.56 1070.48 414.61Z;
M1051.59 416.43c23.75 35.44 117.65 20.42 151.48-12.72c33.83-33.14-28-72.28-50.23-111.51c-24.75-43.66-70.78-40.73-91.61 1.45C1039 338.69 1029.43 383.37 1051.59 416.43Z;
M1060.75 420.62c33.16 26.85 86.09 20.64 119.92-12.49c33.83-33.13 29.14-92.2-12.71-119.89c-41.85-27.69-90.31-24.07-119.92 12.49C1018.43 337.29 1027.6 393.77 1060.75 420.62Z"/>
</path>
<path id="shape_morph_3" d="M1011.72 316.18c31.37 28.73 76.06 22.42 108-11.2c31.94-33.62 25.53-86.21-11.5-108c-37.03-21.79-77.86-21-108 11.19C970.08 240.36 980.36 287.45 1011.72 316.18Z" fill="#3AADAA">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M1011.72 316.18c31.37 28.73 76.06 22.42 108-11.2c31.94-33.62 25.53-86.21-11.5-108c-37.03-21.79-77.86-21-108 11.19C970.08 240.36 980.36 287.45 1011.72 316.18Z;
M997.1 295.1c31.37 28.73 71.6 26.36 103.53-7.26c31.93-33.62 30.09-78.21-2.91-105.68c-32.33-26.91-80.3-25.29-110.43 6.87C957.16 221.19 965.73 266.37 997.1 295.1Z;
M1012.36 302.73c31.37 28.73 75.42 35.87 107.35 2.25c31.93-33.62 10.68-89.12-26.35-110.86c-37.03-21.74-66.86-44.12-97-12C966.22 214.24 981 274 1012.36 302.73Z;
M1011.72 316.18c31.37 28.73 76.06 22.42 108-11.2c31.94-33.62 25.53-86.21-11.5-108c-37.03-21.79-77.86-21-108 11.19C970.08 240.36 980.36 287.45 1011.72 316.18Z"/>
</path>
<path id="shape_transform_6" d="M381,286.49c-36.89,33.78-89.45,26.37-127-13.17s-30-101.39,13.53-126.95,91.57-24.66,127,13.16S417.87,252.7,381,286.49Z" fill="#F6F6F6"/>
<path d="M130.2,108.81c-19.91,10.91-44.55,11.88-59.14-6.14a42,42,0,0,1,6.29-59.12c18.07-14.63,43.19-7.7,59.14,6.14S150.1,97.9,130.2,108.81Z" fill="#F6F6F6"/>
<path d="M56.66,231.44c-24.77,20.06-24.79,53-8.54,81.15s43.82,54.12,63.06,77.87S166,420.32,192.33,399s30.46-59.48,8.53-81.14S161.26,263.51,137.8,240,81.42,211.39,56.66,231.44Z" fill="#F6F6F6"/>
<path id="shape_transform_7" d="M367.45,304.17a13.72,13.72,0,0,1-19.62-2.06c-4.85-6-4.07-15.89,2.06-19.62s15.15-5.16,19.62,2.06S373.71,299.1,367.45,304.17Z" fill="#3AADAA"/>
<path id="shape_transform_8" d="M339.44,285.52c2.38.89,3.25,3.44,2.33,6a4.12,4.12,0,0,1-6,2.31c-2.16-1.38-3.22-3.57-2.33-6S337.07,284.63,339.44,285.52Z" fill="#3AADAA"/>
<path id="shape_transform_9" d="M161.71,120.4A22.74,22.74,0,0,1,129.2,117c-8-9.92-6.74-26.32,3.41-32.51s25.11-8.54,32.51,3.43S172.09,112,161.71,120.4Z" fill="#3AADAA"/>
<path id="shape_transform_10" d="M228.79,340.66c-6.79,5.51-19.19-1.38-26.82-8.84s-6.55-20.79,2.89-27,20.39-5.45,27.06,2.79S235.59,335.16,228.79,340.66Z" fill="#3AADAA"/>
<path d="M125.48,241c-5.7,5.22-13.81,4.07-19.61-2s-4.63-15.65,2.09-19.6,14.13-3.81,19.6,2S131.17,235.82,125.48,241Z" fill="#383E45"/>
<path d="M341.93,259.85c-1.87,1.72-4.53,1.34-6.44-.66a4.14,4.14,0,0,1,.69-6.44c2.21-1.29,4.64-1.25,6.44.67S343.8,258.14,341.93,259.85Z" fill="#383E45"/>
<path id="shape_transform_11" d="M111,253.38c-1.87,1.71-4.53,1.34-6.43-.67a4.12,4.12,0,0,1,.68-6.43c2.21-1.3,4.64-1.25,6.44.66S112.87,251.67,111,253.38Z" fill="#383E45"/>
<path d="M334.85,248.46a2.23,2.23,0,0,1-3.22-.33,2.07,2.07,0,0,1,.34-3.22,2.46,2.46,0,0,1,3.22.34A2.24,2.24,0,0,1,334.85,248.46Z" fill="#383E45"/>
<path d="M239.54,194.45c-5.7,5.21-13.81,4.07-19.61-2s-4.63-15.65,2.09-19.59,14.13-3.81,19.6,2S245.23,189.23,239.54,194.45Z" fill="#3AADAA"/>
<path d="M133.36,286.18c-1.87,1.71-4.54,1.33-6.44-.67a4.14,4.14,0,0,1,.68-6.44c2.21-1.29,4.65-1.25,6.44.67S135.23,284.46,133.36,286.18Z" fill="#383E45"/>
<path d="M242.76,201.15c1.29,2.18.37,4.71-2,6.15a4.13,4.13,0,0,1-6.15-2c-.81-2.42-.26-4.8,2-6.15S241.48,199,242.76,201.15Z" fill="#3AADAA"/>
<path d="M100.2,157.47c-5.7,5.22-13.81,4.07-19.61-2s-4.63-15.65,2.09-19.6,14.14-3.81,19.61,2S105.89,152.26,100.2,157.47Z" fill="#7C6576"/>
<path d="M201.57,150.31c-7.69,7.05-18.65,5.5-26.48-2.74s-6.26-21.15,2.82-26.48S197,116,204.39,123.84,209.26,143.27,201.57,150.31Z" fill="#F6F6F6"/>
<path id="shape_transform_12" d="M106.83,370.42c-21.08,19.3-51.11,15.07-72.57-7.53S17.11,305,42,290.35s52.33-14.09,72.57,7.52S127.91,351.11,106.83,370.42Z" fill="#7C6576"/>
<path d="M122,129.8c-3.24,1.77-7.26,1.93-9.64-1a6.86,6.86,0,0,1,1-9.65c3-2.39,7-1.25,9.65,1S125.24,128,122,129.8Z" fill="#F6F6F6"/>
<path d="M179,93.38c-2,1.08-4.41,1.17-5.85-.61a4.15,4.15,0,0,1,.62-5.85c1.78-1.45,4.27-.76,5.84.61S181,92.3,179,93.38Z" fill="#F6F6F6"/>
<path id="shape_transform_13" d="M389.44,250.08c-15.05,13.77-36.48,10.75-51.79-5.37s-12.25-41.35,5.51-51.78S380.5,182.88,395,198.3,404.48,236.3,389.44,250.08Z" fill="#383E45"/>
<path d="M374.39,161.36a4.1,4.1,0,0,1-5.86-.61c-1.45-1.79-1.22-4.75.61-5.86s4.53-1.54,5.86.62S376.26,159.85,374.39,161.36Z" fill="#3AADAA"/>
<path d="M392.78,160.47a9,9,0,0,1-12.89-1.36c-3.18-3.93-2.67-10.43,1.35-12.89s9.95-3.38,12.89,1.36S396.89,157.14,392.78,160.47Z" fill="#3AADAA"/>
<path id="shape_morph_4" d="M275.06 24.76C248 49 256 67 268.84 84c14.63 18.06 34 37.6 46 56.82c12 19.22 42.92 23 59.21 6.22c16.29-16.78 22.53-39.06 6.22-59.2C364.9367 68.8933 349.6033 49.9467 334.27 31C318.23 11.19 293.13 10.13 275.06 24.76Z" fill="#3AADAA">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M275.06 24.76C248 49 256 67 268.84 84c14.63 18.06 34 37.6 46 56.82c12 19.22 42.92 23 59.21 6.22c16.29-16.78 22.53-39.06 6.22-59.2C364.9367 68.8933 349.6033 49.9467 334.27 31C318.23 11.19 293.13 10.13 275.06 24.76Z;
M287.31 38.28c-27.31 22.72-20.31 40.72-6.23 59.21c14.64 18.06 21.71 24.08 33.77 43.3c12.06 19.22 42.92 23 59.21 6.22c16.29-16.78 22.53-39.06 6.22-59.2c-16.31-20.14-17.74-23.51-33.77-43.3C330.48 24.72 305.37 23.65 287.31 38.28Z;
M271.65 36.47C250 58 255 78 271.93 96c16.51 16.36 24.19 21.57 38.29 39.36c14.1 17.79 45.17 18.21 59.53-.28c14.36-18.49 18.14-41.28-.28-59.53c-18.42-18.25-20.2-21.42-38.29-39.35C313.09 18.27 288 20 271.65 36.47Z;
M275.06 24.76C248 49 256 67 268.84 84c14.63 18.06 34 37.6 46 56.82c12 19.22 42.92 23 59.21 6.22c16.29-16.78 22.53-39.06 6.22-59.2C364.9367 68.8933 349.6033 49.9467 334.27 31C318.23 11.19 293.13 10.13 275.06 24.76Z"/>
</path>
<path id="shape_morph_5" d="M110.84 154.87c-18.06 14.63-18.07 38.64-6.22 59.2c11.85 20.56 32 39.49 46 56.82c14 17.33 40 21.79 59.21 6.22c19.21-15.57 22.21-43.39 6.22-59.2c-15.99-15.81-28.9-39.64-46-56.82C152.95 143.91 128.91 140.24 110.84 154.87Z" fill="#7C6576">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M110.84 154.87c-18.06 14.63-18.07 38.64-6.22 59.2c11.85 20.56 32 39.49 46 56.82c14 17.33 40 21.79 59.21 6.22c19.21-15.57 22.21-43.39 6.22-59.2c-15.99-15.81-28.9-39.64-46-56.82C152.95 143.91 128.91 140.24 110.84 154.87Z;
M104.35 154.78c-15.38 17.18-6 38.14 3.7 58.95c10 21.51 23 46.4 42.58 57.16c21.59 11.89 46.35 22.86 65.57 7.3c19.22-15.56 15.85-44.47-.14-60.28c-15.99-15.81-31.19-32.24-43.84-53.28C159.73 143.84 119.86 137.46 104.35 154.78Z;
M104.35 154.78C89 172 99.64 193.83 112.76 212.64c13.59 19.47 18.08 46.18 31.43 63.57c8.4 11 41.86 19.71 61.09 4.15c19.23-15.56 15.71-35.59 14.53-58.05c-1.05-20.15-22.88-44.71-39.16-61.53C163.79 143.36 119.86 137.46 104.35 154.78Z;
M110.84 154.87c-18.06 14.63-18.07 38.64-6.22 59.2c11.85 20.56 32 39.49 46 56.82c14 17.33 40 21.79 59.21 6.22c19.21-15.57 22.21-43.39 6.22-59.2c-15.99-15.81-28.9-39.64-46-56.82C152.95 143.91 128.91 140.24 110.84 154.87Z"/>
</path>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 12 KiB

113
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/04.svg Normal file
View file

@ -0,0 +1,113 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 -250 4081 1325">
<style>
path {transform-box: fill-box;}
</style>
<defs>
<pattern id="pattern" width="14.17" height="14.17" patternTransform="translate(18.82)" fill="#FFFFFF" patternUnits="userSpaceOnUse" viewBox="0 0 14.17 14.17">
<path d="M10.41,7.61c0,1.64-2,3-3.66,3a3,3,0,0,1-3-3c0-1.64,1.34-4,3-4S10.41,6,10.41,7.61Z"/>
</pattern>
</defs>
<path id="shape_morph_1" d="M644.71,18.46C626-158.95,929.08-295,1047-219c136.91,88.15,7.26,247.14-74.67,276.67-76.77,27.66-5.44,73.34-65.61,157.52C854.46,288.3,654.55,111.69,644.71,18.46Z" fill="#3AADAA">
<animate attributeName="d" dur="25s" repeatCount="indefinite"
values="
M644.71,18.46C626-158.95,929.08-295,1047-219c136.91,88.15,7.26,247.14-74.67,276.67-76.77,27.66-5.44,73.34-65.61,157.52C854.46,288.3,654.55,111.69,644.71,18.46Z;
M658.6,84.38C598.05-78.54,855.23-240.54,1001.26-206c158.46,37.44,78.65,232.15,12,307.31-54.15,61.05,3.53,67.54-44.68,159.1C926.68,339.93,691.26,172.26,658.6,84.38Z;
M629.65,14.09C593.16-155.84,865.75-258.8,1005.3-203.66c151.44,59.84,30.23,233.59-46.54,298.39-62.36,52.63,41,115-52.87,158.48C768.05,317,649.34,105.75,629.65,14.09Z;
M644.71,18.46C626-158.95,929.08-295,1047-219c136.91,88.15,7.26,247.14-74.67,276.67-76.77,27.66-5.44,73.34-65.61,157.52C854.46,288.3,654.55,111.69,644.71,18.46Z"/>
</path>
<path id="shape_morph_2" d="M515.38 184.35c32.1-44.75 104.93-94.86 129-57.2c49.93 78.19 73.35-24.25 137.19-20.6c63.84 3.65 25.22 59.32 99 79.42C954.35 206.07 938.42 328 868.18 305.26c-70.24-22.74-62.26 25.36-97.82 37.86c-35.56 12.5-36.11-34.36-91.9-19.66c-54.87 14.45-133 41-172.14 8.59C474.43 305.7 481.68 231.32 515.38 184.35Z" fill="#383E45">
<animate attributeName="d" dur="25s" repeatCount="indefinite"
values="
M515.38 184.35c32.1-44.75 104.93-94.86 129-57.2c49.93 78.19 73.35-24.25 137.19-20.6c63.84 3.65 25.22 59.32 99 79.42C954.35 206.07 938.42 328 868.18 305.26c-70.24-22.74-62.26 25.36-97.82 37.86c-35.56 12.5-36.11-34.36-91.9-19.66c-54.87 14.45-133 41-172.14 8.59C474.43 305.7 481.68 231.32 515.38 184.35Z;
M515.38 184.35c22.14-50.42 78.31-83.08 129-57.2c82.62 42.2 77.3-5.56 141.14-1.91c63.84 3.65 43.27 23.23 95 60.73c61.92 44.86 40.1 100.27-12.35 119.29c-69.42 25.17-75.52 25.14-112.11 16.14c-35.83-8.81-20.4 9.53-77.61 2.06c-57.52-7.51-112.89 9.85-157.78-14C485.88 290.89 494.25 232.46 515.38 184.35Z;
M492.16,204.92c-12.44-53.64,75.38-54.61,129-57.2,92.67-4.47,91.56,37.61,152.37,17.84,57-18.52,37,26.25,83.81,41,72.93,23,58,81.66,5.55,100.68-69.42,25.18-109,53.4-130,34.74-27.61-24.47-40.82,13.41-94.53-7.66C591.51,316,549.42,337,497.46,330,458.39,324.7,503.24,252.74,492.16,204.92Z;
M515.38 184.35c32.1-44.75 104.93-94.86 129-57.2c49.93 78.19 73.35-24.25 137.19-20.6c63.84 3.65 25.22 59.32 99 79.42C954.35 206.07 938.42 328 868.18 305.26c-70.24-22.74-62.26 25.36-97.82 37.86c-35.56 12.5-36.11-34.36-91.9-19.66c-54.87 14.45-133 41-172.14 8.59C474.43 305.7 481.68 231.32 515.38 184.35Z"/>
</path>
<path id="shape_morph_4" d="M3522.61 697c-81.88 113.13-177.66-22.52-255.26-94.61c-77.6-72.09-115.63-251.8 26.73-310.63c97.86-40.44 150.44 17.07 228 89.16C3599.64 453.01 3596.55 594.81 3522.61 697Z" fill="#7C6576">
<animate attributeName="d" dur="15s" repeatCount="indefinite"
values="
M3522.61 697c-81.88 113.13-177.66-22.52-255.26-94.61c-77.6-72.09-115.63-251.8 26.73-310.63c97.86-40.44 150.44 17.07 228 89.16C3599.64 453.01 3596.55 594.81 3522.61 697Z;
M3522.4 712.35c-60.78 125.72-144.28-79.48-237.84-129.14c-106.25-56.39-154.4-283.27-3.27-313c99.64-19.61 149.63 43.16 227.22 115.24C3586.1 457.53 3579 595.33 3522.4 712.35Z;
M3555.88,685.38c-35,135.19-152.33-71.84-250.88-110.64-148.32-58.39-172.24-345.39-23.71-304.56,87.92,24.17,130.5,89.36,227.22,115.24C3610.82,412.8,3586.15,568.35,3555.88,685.38Z;
M3522.61 697c-81.88 113.13-177.66-22.52-255.26-94.61c-77.6-72.09-115.63-251.8 26.73-310.63c97.86-40.44 150.44 17.07 228 89.16C3599.64 453.01 3596.55 594.81 3522.61 697Z"/>
</path>
<path id="shape_morph_5" d="M3713-22c122.49-54.58 115.32 78.13 152.52 162.29c97 219.36-354.62 277.56-292.12 187.27c62.5-90.29-40.94-129.71-150.58-129.71c-186.25 0-124.59-294.36 61.94-233.07C3585.21-2.24 3590.46 32.54 3713-22Z" fill="#383E45">
<animate attributeName="d" dur="25s" repeatCount="indefinite"
values="
M3713-22c122.49-54.58 115.32 78.13 152.52 162.29c97 219.36-354.62 277.56-292.12 187.27c62.5-90.29-40.94-129.71-150.58-129.71c-186.25 0-124.59-294.36 61.94-233.07C3585.21-2.24 3590.46 32.54 3713-22Z;
M3713-22c122.49-54.58,115.32,78.13,152.52,162.29,97,219.36-287.69,297-292.12,187.27-2.46-61-89.64-100.61-150.58-129.71-168.07-80.24-124.59-294.36,61.94-233.07C3585.21-2.24,3590.46,32.54,3713-22Z;
M3728.88-47.1c122.48-54.58,128.08,117.82,165.28,202,97,219.37-299.48,278.76-278.74,152.25,9.87-60.21-20.74-136.12-176.72-134.38-160,1.78-124.6-294.37,61.94-233.07C3601.12-27.3,3606.38,7.48,3728.88-47.1Z;
M3713-22c122.49-54.58 115.32 78.13 152.52 162.29c97 219.36-354.62 277.56-292.12 187.27c62.5-90.29-40.94-129.71-150.58-129.71c-186.25 0-124.59-294.36 61.94-233.07C3585.21-2.24 3590.46 32.54 3713-22Z"/>
</path>
<path id="shape_morph_6" d="M3472.55,787.23c9.73-83.41,61.89-146.49,130.92-170.65,43.4-15.2,183.57-12.09,250.45,65.42,93.29,108.12,3.56,183.45-94.63,171.36-135.19-16.64-17.08,102.39-103.88,178.47-68.83,60.32-52-51.91-134.48-84.61C3460.21,923.16,3465,852.06,3472.55,787.23Z" fill="#383E45">
<animate attributeName="d" dur="10s" repeatCount="indefinite"
values="
M3472.55,787.23c9.73-83.41,61.89-146.49,130.92-170.65,43.4-15.2,183.57-12.09,250.45,65.42,93.29,108.12,3.56,183.45-94.63,171.36-135.19-16.64-17.08,102.39-103.88,178.47-68.83,60.32-52-51.91-134.48-84.61C3460.21,923.16,3465,852.06,3472.55,787.23Z;
M3472.55,787.23c9.73-83.41,40.71-159.42,109.74-183.59,43.4-15.19,233.53-22.88,271.63,78.36,50.3,133.65,7.87,164.59-89.74,180.73-111,18.37-22.56,97.12-112.64,145.49-80.63,43.29-40.24-25.1-119.33-65.39C3465.84,909,3465,852.06,3472.55,787.23Z;
M3472.55,787.23c9.73-83.41,61.89-146.49,130.92-170.65,43.4-15.2,183.57-12.09,250.45,65.42,93.29,108.12,3.56,183.45-94.63,171.36-135.19-16.64-17.08,102.39-103.88,178.47-68.83,60.32-52-51.91-134.48-84.61C3460.21,923.16,3465,852.06,3472.55,787.23Z"/>
</path>
<path id="shape_morph_7" d="M376.39 571.8c57 74.49 5.73 335.15-127.45 379.35C94.34 1002.46 21.48 658.63 32.47 577.85c10.99-80.78 32.13-87.42 120.88-34.1C242.1 597.07 319.41 497.31 376.39 571.8Z" fill="#3AADAA">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M376.39 571.8c57 74.49 5.73 335.15-127.45 379.35C94.34 1002.46 21.48 658.63 32.47 577.85c10.99-80.78 32.13-87.42 120.88-34.1C242.1 597.07 319.41 497.31 376.39 571.8Z;
M344.47,576.4c57,74.49-8,320.39-95.53,374.75C110.54,1037.06,45.58,655.74,44.46,574.22,43.38,495.37,86.4,487,168.69,509.35,268.59,536.54,287.49,501.91,344.47,576.4Z;
M376.39 571.8c57 74.49 5.73 335.15-127.45 379.35C94.34 1002.46 21.48 658.63 32.47 577.85c10.99-80.78 32.13-87.42 120.88-34.1C242.1 597.07 319.41 497.31 376.39 571.8Z"/>
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="15s" values="0 0;0 60;0 0" repeatCount="indefinite" additive="sum"/>
</path>
<path id="shape_morph_8" d="M614.38,457c6,91.64,91.13,82,65.07,133.94C658,633.81,513.53,832.87,450.35,745.36c-31.72-43.94-8.83-84.15-13.86-138.13-5.94-63.64-90.51-135.71-44.4-179.93C440.55,380.83,610,390,614.38,457Z" fill="#7C6576">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M614.38,457c6,91.64,91.13,82,65.07,133.94C658,633.81,513.53,832.87,450.35,745.36c-31.72-43.94-8.83-84.15-13.86-138.13-5.94-63.64-90.51-135.71-44.4-179.93C440.55,380.83,610,390,614.38,457Z;
M661.09,442.76C725.29,508.43,703.67,556,677.6,608,656.12,650.85,503.21,868.79,440,781.27c-31.72-43.93,21.38-117.11,16.34-171.09-5.93-63.64-99.89-146.65-53.77-190.87C451.07,372.84,616.35,397,661.09,442.76Z;
M614.38,457c6,91.64,91.13,82,65.07,133.94C658,633.81,513.53,832.87,450.35,745.36c-31.72-43.94-8.83-84.15-13.86-138.13-5.94-63.64-90.51-135.71-44.4-179.93C440.55,380.83,610,390,614.38,457Z"/>
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="20s" values="0;60;0" repeatCount="indefinite" additive="sum"/>
</path>
<path id="shape_morph_9" d="M3330.49,742.25c-73,101-158.44-20.11-227.62-84.47S2999.75,433,3126.7,380.43C3214,344.33,3260.85,395.68,3330,460S3396.42,651.05,3330.49,742.25Z" fill="url(#pattern)">
<animate attributeName="d" dur="20s" repeatCount="indefinite"
values="
M3330.49 742.25c-73 101-158.44-20.11-227.62-84.47C3033.69 593.42 2999.75 433 3126.7 380.43C3214 344.33 3260.85 395.68 3330 460C3399.15 524.32 3396.42 651.05 3330.49 742.25Z;
M3326.79 769.77c-73 101-131.33-62.41-200.51-126.77c-69.18-64.36-78.85-259.07 55.31-288.72c99.43-22 100.52 64.11 179 109.57C3442.34 511.22 3392.72 678.56 3326.79 769.77Z;
M3338.36 766.25c-64.72 106.51-86.37-82.18-146.7-154.9c-60.33-72.72-52.48-219.12 56.14-275.81c90.27-47.13 107 60.66 163.4 131.68C3469.34 540.44 3388.68 683.43 3338.36 766.25Z;
M3330.49 742.25c-73 101-158.44-20.11-227.62-84.47C3033.69 593.42 2999.75 433 3126.7 380.43C3214 344.33 3260.85 395.68 3330 460C3399.15 524.32 3396.42 651.05 3330.49 742.25Z"/>
</path>
<path id="shape_morph_11" d="M3726.82 815.89c-27 21.32-81.42 28.8-102.57 1.73c-21.15-27.07-1-78.46 26.75-101.62c29-22 56-26 87.18 10.43C3761 761 3756 790 3726.82 815.89Z" fill="url(#pattern)">
<animate attributeName="d" dur="6s" repeatCount="indefinite"
values="
M3726.82 815.89c-27 21.32-81.42 28.8-102.57 1.73c-21.15-27.07-1-78.46 26.75-101.62c29-22 56-26 87.18 10.43C3761 761 3756 790 3726.82 815.89Z;
M3710.51 831.73c-33.67 16.15-91 9.57-104.38-26.06c-13.38-35.63 22.25-86.82 55.9-103c33.65-16.18 71.8-.36 85.18 35.27C3760.59 773.57 3744.15 815.57 3710.51 831.73Z;
M3712.69,832.32c-31.19,16.81-71.24,4.76-95-23.53-29.93-35.69,29.46-71.11,53.53-103.61,21.08-28.48,76.71-3.81,77.17,33.11C3749,781,3743.86,815.49,3712.69,832.32Z;
M3726.82 815.89c-27 21.32-81.42 28.8-102.57 1.73c-21.15-27.07-1-78.46 26.75-101.62c29-22 56-26 87.18 10.43C3761 761 3756 790 3726.82 815.89Z"/>
</path>
<path id="shape_morph_12" d="M215.2 601.68c-5.19-40.4 71-127.26 130.79-114.92c69.4 14.32 21.77 159.44 0 187.43C324.22 702.18 314.81 700.07 293 660.72C271.19 621.37 220.39 642.08 215.2 601.68Z" fill="url(#pattern)">
<animate attributeName="d" dur="10s" repeatCount="indefinite"
values="
M215.2 601.68c-5.19-40.4 71-127.26 130.79-114.92c69.4 14.32 21.77 159.44 0 187.43C324.22 702.18 314.81 700.07 293 660.72C271.19 621.37 220.39 642.08 215.2 601.68Z;
M215.39 574.22c-5.19-40.4 97.69-88.65 145.1-104.07c67.38-21.92 14.68 194.91-7.09 222.89c-21.77 27.98-28.88-7.66-60.36-32.32C257.64 633 220.58 614.62 215.39 574.22Z;
M215.39,574.22C200.28,536.4,308,459.7,355.61,474.51c49.58,15.42-.57,167.64-3.84,200.51-3.51,35.28-61.57,43.59-106.25,20.71C205.5,675.23,257,678.29,215.39,574.22Z;
M215.2 601.68c-5.19-40.4 71-127.26 130.79-114.92c69.4 14.32 21.77 159.44 0 187.43C324.22 702.18 314.81 700.07 293 660.72C271.19 621.37 220.39 642.08 215.2 601.68Z"/>
</path>
<path id="shape_morph_14" d="M3635.36 103.29c82.3-36.59 77.49 52.38 102.49 108.81c65.17 147.06-238.31 186.08-196.31 125.55c42-60.53-27.5-87-101.19-87c-125.15 0-83.72-197.36 41.63-156.26C3549.51 116.57 3553 139.88 3635.36 103.29Z" fill="url(#pattern)">
<animate attributeName="d" dur="15s" repeatCount="indefinite"
values="
M3635.36 103.29c82.3-36.59 77.49 52.38 102.49 108.81c65.17 147.06-238.31 186.08-196.31 125.55c42-60.53-27.5-87-101.19-87c-125.15 0-83.72-197.36 41.63-156.26C3549.51 116.57 3553 139.88 3635.36 103.29Z;
M3682.11 103.36c84.86-30.2 51 78.79 71.67 137c53.75 151.61-267.05 152.32-220.55 95.17C3579.73 278.38 3478.83 260 3439 241.06c-113-53.74-68.41-203.17 53.43-152.62C3558.05 115.66 3597.24 133.57 3682.11 103.36Z;
M3716.5,88.06c69.1,11.29,46.71,81.44,64.14,140.64,45.46,154.31-237.27,176.36-225.38,83.08,9.32-73.08-50.23-78.31-89-99.39-110-59.79-57.31-206.58,61.62-149.51C3592,93.62,3627.6,73.55,3716.5,88.06Z;
M3635.36 103.29c82.3-36.59 77.49 52.38 102.49 108.81c65.17 147.06-238.31 186.08-196.31 125.55c42-60.53-27.5-87-101.19-87c-125.15 0-83.72-197.36 41.63-156.26C3549.51 116.57 3553 139.88 3635.36 103.29Z"/>
</path>
<path id="shape_transform_2" d="M336.31,220.72C295.5,270.37,268.58,370,198,321.23c-52.34-36.16-55.12-138.81-12.82-199.8s126.89-97.7,186.68-50.89C413.68,99.42,374.63,174.13,336.31,220.72Z" fill="#7C6576">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="15s" values="0 0;0 120;0 0" repeatCount="indefinite"/>
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="15s" values="0;-30;0" repeatCount="indefinite" additive="sum"/>
</path>
<path id="shape_transform_6" transform-origin="right top" d="M3934.59,55.38c-27.51,38.4-164.09,58.77-202.35,31.34S3732.51-22.7,3760-61.1s88.93-70.77,127.18-43.34S3962.1,17,3934.59,55.38Z" fill="#3AADAA">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="7s" values="0 0;0 -10;0 0" repeatCount="indefinite"/>
</path>
<path id="shape_transform_7" transform-origin="right top" d="M3981.77,906.69c19,43-25.08,132-102.38,132.65S3733.36,960,3714.32,917s52.34,5.41,117.09-30.79S3962.71,863.63,3981.77,906.69Z" fill="#7C6576">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="6s" values="0 0;0 -10;0 0" repeatCount="indefinite"/>
</path>
<path id="shape_transform_9" d="M3801.26,605c-9,7-27.09,9.49-34.14.57s-.34-25.83,8.64-32.85a20.75,20.75,0,0,1,29,3.43A20.47,20.47,0,0,1,3801.26,605Z" fill="#3AADAA">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" values="0 0;0 -30;0 0" repeatCount="indefinite"/>
</path>
<path id="shape_transform_10" d="M3514.1,858.75c16.83-10.46,37.82-1.11,48.36,15.58s27.83,51.5-7,50C3528.37,923.1,3472.47,884.62,3514.1,858.75Z" fill="#3AADAA">
<animateTransform xlink:href="#shape_transform_9" attributeName="transform" attributeType="XML" type="translate" dur="10s" values="0 0;0 -30;0 0" repeatCount="indefinite"/>
</path>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 14 KiB

138
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/05.svg Normal file
View file

@ -0,0 +1,138 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1440 450">
<style>
@keyframes snake {
0%, 100% {transform: translate(0, 0);}
50% {transform: translate(-10%, 0);}
}
@keyframes rotate {
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}
@keyframes rotate_reverse {
0% {transform: rotate(0deg);}
100% {transform: rotate(-360deg);}
}
@keyframes rotate_little {
0%, 100% {transform: rotate(0deg);}
50% {transform: rotate(45deg);}
}
.origin-center {
transform-box: fill-box;
transform-origin: center;
}
#snake {animation: snake 30s cubic-bezier(.445, .05, .55, .95) infinite;}
#circle_1 {animation: rotate 180s linear infinite;}
#circle_2,
#circle_4 {animation: rotate 60s linear infinite;}
#circle_3 {animation: rotate_reverse 60s linear infinite;}
#circle_5 {animation: rotate_little 30s cubic-bezier(.445, .05, .55, .95) infinite;}
</style>
<defs>
<g id="animations">
<animateTransform xlink:href="#line_circles_1" attributeName="transform" attributeType="XML" type="translate" dur="5s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_2" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin=".2s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_3" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin=".4s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_4" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin=".6s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_5" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin=".8s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_6" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin="1s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_7" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin="1.2s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_8" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin="1.4s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_circles_9" attributeName="transform" attributeType="XML" type="translate" dur="5s" begin="1.6s" values="0 0;0 10;0 0" repeatCount="indefinite"/>
</g>
</defs>
<path id="snake" d="M717,108.15c92.73,0,92.73,241.37,185.47,241.37s92.73-241.37,185.46-241.37,92.73,241.37,185.47,241.37,92.73-241.37,185.47-241.37,92.74,241.37,185.49,241.37,92.74-241.37,185.48-241.37" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="68"/>
<circle id="circle_1" class="origin-center" cx="282.66" cy="219.53" r="170.18" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="11" stroke-dasharray="5 36"/>
<circle id="circle_2" class="origin-center" cx="1254.38" cy="223" r="73.01" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="3" stroke-dasharray="5 14"/>
<circle id="circle_3" class="origin-center" cx="1254.38" cy="223" r="54.06" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="3" stroke-dasharray="5 14"/>
<circle id="circle_4" class="origin-center" cx="1254.38" cy="223" r="33.99" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="3" stroke-dasharray="5 14"/>
<g id="line_circles_1">
<circle cx="1144.47" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1144.47" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1144.47" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1144.47" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_2">
<circle cx="1171.95" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1171.95" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1171.95" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1171.95" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_3">
<circle cx="1199.43" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1199.43" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1199.43" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1199.43" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_4">
<circle cx="1226.9" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1226.9" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1226.9" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1226.9" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_5">
<circle cx="1254.38" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1254.38" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1254.38" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1254.38" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_6">
<circle cx="1281.86" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1281.86" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1281.86" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1281.86" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_7">
<circle cx="1309.34" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1309.34" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1309.34" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1309.34" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_8">
<circle cx="1336.82" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1336.82" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1336.82" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1336.82" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<g id="line_circles_9">
<circle cx="1364.29" cy="406.36" r="3.37" fill="#7C6576"/>
<circle cx="1364.29" cy="383.2" r="3.37" fill="#7C6576"/>
<circle cx="1364.29" cy="360.04" r="3.37" fill="#7C6576"/>
<circle cx="1364.29" cy="336.89" r="3.37" fill="#7C6576"/>
</g>
<circle id="circle_5" cx="188.47" cy="158.41" r="55.42" fill="#3AADAA" opacity=".5"/>
<circle cx="133.05" cy="102.99" r="74.45" fill="#3AADAA"/>
<g>
<circle cx="141.71" cy="109.65" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="109.65" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="109.65" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="109.65" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="128.72" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="128.72" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="128.72" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="128.72" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="147.79" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="147.79" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="147.79" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="147.79" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="166.86" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="166.86" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="166.86" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="166.86" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="185.93" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="185.93" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="185.93" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="185.93" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="205" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="205" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="205" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="205" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="224.07" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="224.07" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="224.07" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="224.07" r="4.53" fill="#F6F6F6"/>
<circle cx="141.71" cy="243.14" r="4.53" fill="#F6F6F6"/>
<circle cx="160.78" cy="243.14" r="4.53" fill="#F6F6F6"/>
<circle cx="179.85" cy="243.14" r="4.53" fill="#F6F6F6"/>
<circle cx="198.92" cy="243.14" r="4.53" fill="#F6F6F6"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 8.7 KiB

44
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/06.svg Normal file
View file

@ -0,0 +1,44 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none" width="100%" height="100%">
<defs>
<svg id="sub-svg-1" viewBox="0 0 1400 450" preserveAspectRatio="xMidYMax meet" width="100%">
<path id="shape_1" d="M1226.14 533.36c-33.48 14.93-47.84 34.29-67.2 42c-19.34 8.07-43.5 4.27-79.62 7.81c-36.14 3.16-84.43 13.87-106.41-2.52c-22.19-16.57-18.45-59.84-21.84-101.43c-3.39-41.59-14.13-81.3 2.6-104.47c16.34-23.15 59.92-30 94.72-41.44c34.59-11.67 60.19-28.21 77.87-16.5c17.48 11.51 82.46-41.3 122.35-30.19c39.69 10.93 54.1 86 87.92 100.87c33.42 14.91 30.46 62.63 3.07 91.73C1311.83 508.31 1259.61 518.42 1226.14 533.36Z" fill="#F6F6F6">
<animate class="animation" dur="20s" repeatCount="indefinite" attributeName="d" attributeType="XML"
values="
M1226.14 533.36c-33.48 14.93-47.84 34.29-67.2 42c-19.34 8.07-43.5 4.27-79.62 7.81c-36.14 3.16-84.43 13.87-106.41-2.52c-22.19-16.57-18.45-59.84-21.84-101.43c-3.39-41.59-14.13-81.3 2.6-104.47c16.34-23.15 59.92-30 94.72-41.44c34.59-11.67 60.19-28.21 77.87-16.5c17.48 11.51 82.46-41.3 122.35-30.19c39.69 10.93 54.1 86 87.92 100.87c33.42 14.91 30.46 62.63 3.07 91.73C1311.83 508.31 1259.61 518.42 1226.14 533.36Z;
M1165.2 566.05c-19.15 20.78-37.1 61.93-50.77 63.63c-13.67 1.7-23.24-35.69-62.35-51.51c-38.71-15.69-106.85-9.57-125-27.34c-18.31-17.39 13.26-58.94 26.74-105.29c13.35-46.61 8.65-98.66 33.53-112.3c24.88-13.64 79.19 10.87 126.77 6.83c47.7-3.78 88.38-36 128.25-39.25c39.59-3.14 78.25 22.42 98.94 57.72c21.1 35.43 24.11 80.34 1.85 113.06c-22.11 32.34-69.63 52.22-103.77 62.62C1205.25 544.62 1184.62 545.14 1165.2 566.05Z;
M1226.14 533.36c-33.48 14.93-47.84 34.29-67.2 42c-19.34 8.07-43.5 4.27-79.62 7.81c-36.14 3.16-84.43 13.87-106.41-2.52c-22.19-16.57-18.45-59.84-21.84-101.43c-3.39-41.59-14.13-81.3 2.6-104.47c16.34-23.15 59.92-30 94.72-41.44c34.59-11.67 60.19-28.21 77.87-16.5c17.48 11.51 82.46-41.3 122.35-30.19c39.69 10.93 54.1 86 87.92 100.87c33.42 14.91 30.46 62.63 3.07 91.73C1311.83 508.31 1259.61 518.42 1226.14 533.36Z"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
<path id="stroke_1" d="M1213.65,538.71c-33.74,8.35-50.37,24-69.72,28-19.4,4.3-41.31-3.28-75.61-6-34.25-3.09-81.11-1.15-98.89-20.11-17.94-19.17-7.22-58.93-3.45-98.31s.39-78.23,19.86-97.06c19.11-18.88,60.92-17.95,95.31-22.86,34.23-5.12,60.89-16.28,75.44-2.41,14.38,13.66,83.84-24.78,119.22-7.75C1311,329,1311.94,401.43,1341,421c28.7,19.49,18,63.54-12.44,86.13C1297.8,529.63,1247.38,530.35,1213.65,538.71Z" fill="none" stroke="#3AADAA" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5" stroke-dasharray="5 14">
<animate class="animation" dur="25s" repeatCount="indefinite" attributeName="d" attributeType="XML"
values="
M1213.65 538.71c-33.74 8.35-50.37 24-69.72 28c-19.4 4.3-41.31-3.28-75.61-6c-34.25-3.09-81.11-1.15-98.89-20.11c-17.94-19.17-7.22-58.93-3.45-98.31c3.77-39.38.39-78.23 19.86-97.06c19.11-18.88 60.92-17.95 95.31-22.86c34.23-5.12 60.89-16.28 75.44-2.41c14.38 13.66 83.84-24.78 119.22-7.75C1311 329 1311.94 401.43 1341 421c28.7 19.49 18 63.54-12.44 86.13C1297.8 529.63 1247.38 530.35 1213.65 538.71Z;
M1133 575.34c-22 18.7-45.32 58.23-59.41 58.25c-14.09.02-19.14-39.09-56.85-60c-37.32-20.73-107.21-23-123.42-43.26c-16.41-19.91 20.77-58.14 40.2-103.49c19.34-45.62 21-99 48-109.76c27-10.76 79 20.86 127.76 22.67c48.86 2.09 94.14-25.54 135-23.9c40.55 1.74 76.59 32.47 93.21 70.85c17 38.56 14.48 84.5-12.18 114.93c-26.44 30-77.11 44.32-113 50.63C1176.42 558.57 1155.29 556.54 1133 575.34Z;
M1213.65 538.71c-33.74 8.35-50.37 24-69.72 28c-19.4 4.3-41.31-3.28-75.61-6c-34.25-3.09-81.11-1.15-98.89-20.11c-17.94-19.17-7.22-58.93-3.45-98.31c3.77-39.38.39-78.23 19.86-97.06c19.11-18.88 60.92-17.95 95.31-22.86c34.23-5.12 60.89-16.28 75.44-2.41c14.38 13.66 83.84-24.78 119.22-7.75C1311 329 1311.94 401.43 1341 421c28.7 19.49 18 63.54-12.44 86.13C1297.8 529.63 1247.38 530.35 1213.65 538.71Z;"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
</svg>
<svg id="sub-svg-2" viewBox="0 0 1400 450" preserveAspectRatio="xMidYMin meet" width="100%">
<path id="shape_2" d="M465.51-83.1c36.77-3.42 94.14-22.05 110-9.87c16.24 12.48-9 56.12-6.86 101.74c1.81 45.67 31 93.31 15.94 108.5c-15.06 15.19-74-1.8-114-2.13c-40.37-.28-61.53 16.06-99.65 35.65c-37.78 19.55-92.91 42.06-139 32.45c-46.51-9.91-84.34-51.9-103.84-102.56C108.25 30.08 106.75-29.19 120.88-86c13.74-57.09 43.15-111.36 91.5-113.87c48.7-2.54 116 46.72 157.92 77.4C412.22-91.79 428.41-79.63 465.51-83.1Z" fill="#7C6576">
<animate class="animation" dur="20s" repeatCount="indefinite" attributeName="d" attributeType="XML"
values="
M465.51-83.1c36.77-3.42 94.14-22.05 110-9.87c16.24 12.48-9 56.12-6.86 101.74c1.81 45.67 31 93.31 15.94 108.5c-15.06 15.19-74-1.8-114-2.13c-40.37-.28-61.53 16.06-99.65 35.65c-37.78 19.55-92.91 42.06-139 32.45c-46.51-9.91-84.34-51.9-103.84-102.56C108.25 30.08 106.75-29.19 120.88-86c13.74-57.09 43.15-111.36 91.5-113.87c48.7-2.54 116 46.72 157.92 77.4C412.22-91.79 428.41-79.63 465.51-83.1Z;
M474.9-257.82c25.26 4.6 29.85 53.2 49 94.92c18.75 42.1 52.43 77.31 34.83 95.3C541.11-49.23 590 111.45 555.13 129.82c-35.21 18.37-132.37-15.95-158 38c-25.26 53.59-96.36 35.92-120.47 26.35c-23.73-10-142.51-73.71-185.75-125.38C47.67 17.12 108-38.57 72.37-77.23c-35.63-38.66-47.17-88-5.07-126.62C109-242.51 175.61-254.37 228-246.34c52.39 8.03 91.09 36 133.19 30.24C403.33-222.22 449.64-262 474.9-257.82Z;
M465.51-83.1c36.77-3.42 94.14-22.05 110-9.87c16.24 12.48-9 56.12-6.86 101.74c1.81 45.67 31 93.31 15.94 108.5c-15.06 15.19-74-1.8-114-2.13c-40.37-.28-61.53 16.06-99.65 35.65c-37.78 19.55-92.91 42.06-139 32.45c-46.51-9.91-84.34-51.9-103.84-102.56C108.25 30.08 106.75-29.19 120.88-86c13.74-57.09 43.15-111.36 91.5-113.87c48.7-2.54 116 46.72 157.92 77.4C412.22-91.79 428.41-79.63 465.51-83.1Z"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
<path id="stroke_2" d="M480.14-110.54c35.14-9.18 87.86-36.41 105.19-27.1c17.75 9.52.2 55.91 9.55 99.85c9 44 45 85.65 32.75 102.78c-12.25 17.13-72.07 10-111 16.1c-39.23 6.16-57.18 25.38-91.06 50.48c-33.56 25-83.49 55.63-129.79 53.64c-46.72-2.21-90.13-37-117.13-83c-27.31-46-38.21-103.26-33.54-160.64c4.25-57.61 24.15-115 70.7-125.11c46.86-10.23 120 26.88 165.62 50C427.05-110.42 444.67-101.27 480.14-110.54Z" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5" stroke-dasharray="5 14">
<animate class="animation" dur="35s" repeatCount="indefinite" attributeName="d" attributeType="XML"
values="
M480.14-110.54c35.14-9.18 87.86-36.41 105.19-27.1c17.75 9.52.2 55.91 9.55 99.85c9 44 45 85.65 32.75 102.78c-12.25 17.13-72.07 10-111 16.1c-39.23 6.16-57.18 25.38-91.06 50.48c-33.56 25-83.49 55.63-129.79 53.64c-46.72-2.21-90.13-37-117.13-83c-27.31-46-38.21-103.26-33.54-160.64c4.25-57.61 24.15-115 70.7-125.11c46.86-10.23 120 26.88 165.62 50C427.05-110.42 444.67-101.27 480.14-110.54Z;
M461.06-290.72c27.54 1.39 38.11 49.09 63.43 88.13c25 39.46 65.08 70.2 48.35 90.28C556.16-91.86 627.11 61.6 592 84.22c-35.51 22.66-143.39.76-164.52 57.57c-20.76 56.39-98.83 47.76-125.73 41.28c-26.53-6.9-160.95-55.33-213.21-101.22C36.28 35.96 94.28-26.93 51.72-60.86C9.16-94.79-9-142.31 31.54-186c40.1-43.62 109.92-63.76 166.92-62.35C255.46-246.94 300-224 344.38-235C388.68-246.39 433.56-291.73 461.06-290.72Z;
M480.14-110.54c35.14-9.18 87.86-36.41 105.19-27.1c17.75 9.52.2 55.91 9.55 99.85c9 44 45 85.65 32.75 102.78c-12.25 17.13-72.07 10-111 16.1c-39.23 6.16-57.18 25.38-91.06 50.48c-33.56 25-83.49 55.63-129.79 53.64c-46.72-2.21-90.13-37-117.13-83c-27.31-46-38.21-103.26-33.54-160.64c4.25-57.61 24.15-115 70.7-125.11c46.86-10.23 120 26.88 165.62 50C427.05-110.42 444.67-101.27 480.14-110.54Z"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
</svg>
</defs>
<svg>
<use xlink:href="#sub-svg-1"/>
<use xlink:href="#sub-svg-2"/>
</svg>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 7.9 KiB

80
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/07.svg Normal file
View file

@ -0,0 +1,80 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 675 643">
<style>
@keyframes move_1_90deg {
0% {transform: scale(1) rotate(0deg);}
1.25% {transform: scale(.5) rotate(90deg);}
2.91% {transform: scale(.5) rotate(90deg);}
4.16% {transform: scale(1) rotate(90deg);}
50% {transform: scale(1) rotate(90deg);}
51.25% {transform: scale(.5) rotate(90deg);}
52.91% {transform: scale(.5) rotate(90deg);}
54.16% {transform: scale(1) rotate(0deg);}
100% {transform: scale(1) rotate(0deg);}
}
@keyframes move_2_90deg {
0% {transform: scale(1) rotate(0deg);}
25% {transform: scale(1) rotate(0deg);}
26.25% {transform: scale(.5) rotate(90deg);}
27.91% {transform: scale(.5) rotate(90deg);}
29.16% {transform: scale(1) rotate(90deg);}
75% {transform: scale(1) rotate(90deg);}
76.25% {transform: scale(.5) rotate(90deg);}
77.91% {transform: scale(.5) rotate(90deg);}
79.16% {transform: scale(1) rotate(0deg);}
100% {transform: scale(1) rotate(0deg);}
}
@keyframes move_1_min_90deg {
0% {transform: scale(1) rotate(0deg);}
1.25% {transform: scale(.5) rotate(90deg);}
2.91% {transform: scale(.5) rotate(90deg);}
4.16% {transform: scale(1) rotate(90deg);}
50% {transform: scale(1) rotate(90deg);}
51.25% {transform: scale(.5) rotate(90deg);}
52.91% {transform: scale(.5) rotate(90deg);}
54.16% {transform: scale(1) rotate(0deg);}
100% {transform: scale(1) rotate(0deg);}
}
@keyframes move_2_min_90deg {
0% {transform: scale(1) rotate(0deg);}
25% {transform: scale(1) rotate(0deg);}
26.25% {transform: scale(.5) rotate(90deg);}
27.91% {transform: scale(.5) rotate(90deg);}
29.16% {transform: scale(1) rotate(90deg);}
75% {transform: scale(1) rotate(90deg);}
76.25% {transform: scale(.5) rotate(90deg);}
77.91% {transform: scale(.5) rotate(90deg);}
79.16% {transform: scale(1) rotate(0deg);}
100% {transform: scale(1) rotate(0deg);}
}
polygon {
transform-box: fill-box;
transform-origin: center;
}
#poly_1 {animation: move_1_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_2 {animation: move_2_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_3 {animation: move_1_min_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_4 {animation: move_2_min_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_5 {animation: move_1_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_6 {animation: move_2_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_7 {animation: move_1_min_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_8 {animation: move_2_min_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_9 {animation: move_1_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_10 {animation: move_2_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_11 {animation: move_1_min_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
#poly_12 {animation: move_2_min_90deg 24s cubic-bezier(.445, .05, .55, .95) infinite;}
</style>
<g transform="translate(0 193)">
<polygon id="poly_1" points="675 0 562.5 112.5 675 112.5 675 0" fill="#383E45"/>
<polygon id="poly_2" points="562.5 112.5 450 225 562.5 225 562.5 112.5" fill="#3AADAA"/>
<polygon id="poly_3" points="562.5 337.5 675 225 562.5 225 562.5 337.5" fill="#3AADAA"/>
<polygon id="poly_4" points="562.5 337.5 450 225 450 337.5 562.5 337.5" fill="#7C6576"/>
<polygon id="poly_5" points="337.5 337.5 450 450 450 337.5 337.5 337.5" fill="#7C6576"/>
<polygon id="poly_6" points="337.5 225 450 337.5 450 225 337.5 225" fill="#F6F6F6"/>
<polygon id="poly_7" points="225 337.5 337.5 225 225 225 225 337.5" fill="#F6F6F6"/>
<polygon id="poly_8" points="337.5 337.5 225 450 337.5 450 337.5 337.5" fill="#383E45"/>
<polygon id="poly_9" points="112.5 337.5 225 450 225 337.5 112.5 337.5" fill="#3AADAA"/>
<polygon id="poly_10" points="0 337.5 112.5 450 112.5 337.5 0 337.5" fill="#7C6576"/>
<polygon id="poly_11" points="675 337.5 562.5 450 675 450 675 337.5" fill="#383E45"/>
<polygon id="poly_12" points="675 225 562.5 112.5 675 112.5 675 225" fill="#7C6576"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 4.3 KiB

63
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/08.svg Normal file
View file

@ -0,0 +1,63 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 380 360">
<style>
@keyframes circle_scale {
0%, 100% {transform: scale(1);}
50% {transform: scale(.75);}
}
#circle_3 {animation: circle_scale 3s linear infinite;}
#circle_4 {animation: circle_scale 3s .5s linear infinite;}
#circle_5 {animation: circle_scale 3s 1s linear infinite;}
</style>
<defs>
<g id="animations">
<animate xlink:href="#snake_1" attributeName="d" dur="9s" repeatCount="indefinite"
values="
M90.71,23.29C82.07,31.93,75,24.86,66.37,33.49S64.8,49.2,56.17,57.83,40.46,59.4,31.82,68s-1.56,15.7-10.2,24.34S5.91,94-2.73,102.59;
M87.88,20.47c-8.64,8.63-10,7.22-18.68,15.85S62,46.37,53.34,55,43.29,62.23,34.65,70.86,27.43,80.92,18.79,89.55,8.74,96.78.1,105.41;
M90.71,23.29C82.07,31.93,75,24.86,66.37,33.49S64.8,49.2,56.17,57.83,40.46,59.4,31.82,68s-1.56,15.7-10.2,24.34S5.91,94-2.73,102.59"/>
<animate xlink:href="#snake_2" attributeName="d" dur="7s" repeatCount="indefinite"
values="
M235.29-40c-8.63,8.64-15.7,1.57-24.33,10.2s-1.57,15.71-10.2,24.34S185.05-3.88,176.41,4.76s-1.56,15.7-10.2,24.34-15.71,1.57-24.35,10.21;
M233.17-42.11c-8.63,8.64-11.46,5.81-20.09,14.44s-5.81,11.47-14.45,20.1-11.46,5.81-20.1,14.45S172.72,18.34,164.09,27,152.62,32.79,144,41.43;
M235.29-40c-8.63,8.64-15.7,1.57-24.33,10.2s-1.57,15.71-10.2,24.34S185.05-3.88,176.41,4.76s-1.56,15.7-10.2,24.34-15.71,1.57-24.35,10.21"/>
<animate xlink:href="#snake_3" attributeName="d" dur="8s" repeatCount="indefinite"
values="
M188.66,49.32c-7.87,7.87-14.95.8-22.82,8.67s-.8,14.94-8.67,22.81-14.94.8-22.81,8.67-.8,15-8.67,22.82-14.94.8-22.81,8.67-.8,14.94-8.68,22.81-14.94.8-22.81,8.67-.8,14.95-8.67,22.82-14.95.8-22.82,8.67-.8,14.95-8.68,22.82-14.94.81-22.82,8.68;
M190.78,51.44c-7.87,7.87-19.19-3.44-27.06,4.43s3.44,19.18-4.43,27.06-19.18-3.45-27,4.42,3.44,19.19-4.43,27.06-19.18-3.44-27,4.43,3.44,19.18-4.44,27-19.18-3.44-27,4.43,3.44,19.19-4.43,27.06-19.19-3.44-27.06,4.43,3.44,19.19-4.43,27.06-19.19-3.44-27.07,4.44;
M188.66,49.32c-7.87,7.87-14.95.8-22.82,8.67s-.8,14.94-8.67,22.81-14.94.8-22.81,8.67-.8,15-8.67,22.82-14.94.8-22.81,8.67-.8,14.94-8.68,22.81-14.94.8-22.81,8.67-.8,14.95-8.67,22.82-14.95.8-22.82,8.67-.8,14.95-8.68,22.82-14.94.81-22.82,8.68"/>
<animate xlink:href="#snake_4" attributeName="d" dur="4s" repeatCount="indefinite"
values="
M355-14.25c-8.63,8.64-15.7,1.56-24.34,10.2s-1.56,15.71-10.2,24.34-15.71,1.57-24.34,10.2-1.57,15.71-10.21,24.35S270.17,56.41,261.54,65;
M359.21-10c-8.63,8.63-24.19-6.93-32.82,1.71s6.92,24.19-1.72,32.82-24.19-6.92-32.83,1.72,6.92,24.19-1.71,32.83-24.2-6.92-32.84,1.72;
M355-14.25c-8.63,8.64-15.7,1.56-24.34,10.2s-1.56,15.71-10.2,24.34-15.71,1.57-24.34,10.2-1.57,15.71-10.21,24.35S270.17,56.41,261.54,65"/>
<animateTransform xlink:href="#line_1" attributeName="transform" attributeType="XML" type="translate" dur="8s" values="0 0;10 -10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#line_2" attributeName="transform" attributeType="XML" type="translate" dur="8s" values="0 0;10 -10;0 0" repeatCount="indefinite"/>
<animateTransform xlink:href="#circle_1" attributeName="transform" attributeType="XML" type="translate" dur="10s" values="0 0;10 -10;0 0" repeatCount="indefinite"/>
<animate xlink:href="#circle_2" attributeName="stroke-width" dur="5s" repeatCount="indefinite" values="3;6;3"/>
<animate xlink:href="#circle_6" attributeName="fill" dur="6s" repeatCount="indefinite" values="#3AADAA;#7C6576;#3AADAA"/>
</g>
</defs>
<path id="snake_1" d="M90.71,23.29C82.07,31.93,75,24.86,66.37,33.49S64.8,49.2,56.17,57.83,40.46,59.4,31.82,68s-1.56,15.7-10.2,24.34S5.91,94-2.73,102.59" fill="none" stroke="#7C6576" stroke-linecap="round" stroke-miterlimit="10" stroke-width="6"/>
<path id="snake_2" d="M235.29-40c-8.63,8.64-15.7,1.57-24.33,10.2s-1.57,15.71-10.2,24.34S185.05-3.88,176.41,4.76s-1.56,15.7-10.2,24.34-15.71,1.57-24.35,10.21" fill="none" stroke="#7C6576" stroke-linecap="round" stroke-miterlimit="10" stroke-width="6"/>
<path id="snake_3" d="M188.66,49.32c-7.87,7.87-14.95.8-22.82,8.67s-.8,14.94-8.67,22.81-14.94.8-22.81,8.67-.8,15-8.67,22.82-14.94.8-22.81,8.67-.8,14.94-8.68,22.81-14.94.8-22.81,8.67-.8,14.95-8.67,22.82-14.95.8-22.82,8.67-.8,14.95-8.68,22.82-14.94.81-22.82,8.68" fill="none" stroke="#3AADAA" stroke-linecap="round" stroke-miterlimit="10" stroke-width="8"/>
<path id="snake_4" d="M355-14.25c-8.63,8.64-15.7,1.56-24.34,10.2s-1.56,15.71-10.2,24.34-15.71,1.57-24.34,10.2-1.57,15.71-10.21,24.35S270.17,56.41,261.54,65" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="6"/>
<line id="line_1" x1="179.9" y1="-25.72" x2="110.04" y2="44.13" fill="none" stroke="#3AADAA" stroke-linecap="round" stroke-miterlimit="10" stroke-width="11"/>
<line id="line_2" x1="73.56" y1="80.62" x2="-17.89" y2="172.07" fill="none" stroke="#7C6576" stroke-linecap="round" stroke-miterlimit="10" stroke-width="11"/>
<circle id="circle_1" cx="91.8" cy="62.38" r="5.8" fill="#383E45"/>
<circle id="circle_2" cx="65.5" cy="122.74" r="8.03" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="3"/>
<circle id="circle_3" cx="102.61" cy="167.1" r="5.8" fill="#3AADAA" style="transform-box: fill-box;" transform-origin="center"/>
<circle id="circle_4" cx="89.53" cy="180.17" r="5.8" fill="#7C6576" style="transform-box: fill-box;" transform-origin="center"/>
<circle id="circle_5" cx="76.57" cy="193.13" r="5.8" fill="#383E45" style="transform-box: fill-box;" transform-origin="center"/>
<circle id="circle_6" cx="244.64" cy="80.6" r="5.8" fill="#3AADAA"/>
<line x1="33.23" y1="-3.67" x2="-0.01" y2="29.57" fill="none" stroke="#3AADAA" stroke-linecap="round" stroke-miterlimit="10" stroke-width="6"/>
<line x1="251.44" y1="-20.53" x2="218.2" y2="12.71" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="6"/>
<line x1="74.09" y1="-3.67" x2="38.95" y2="31.47" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="11"/>
<line x1="202.37" y1="100.57" x2="90.64" y2="212.3" fill="none" stroke="#7C6576" stroke-linecap="round" stroke-miterlimit="10" stroke-width="11"/>
<line x1="60.45" y1="209.25" x2="-12.63" y2="282.33" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="6"/>
<line x1="287.91" y1="-18.2" x2="118.73" y2="150.98" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="11"/>
<circle cx="202.37" cy="28.53" r="7.13" fill="#7C6576"/>
<line x1="131.34" y1="56.9" x2="82.42" y2="105.81" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/>
<line x1="51.52" y1="266.07" x2="2.61" y2="314.98" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/>
<line x1="41.06" y1="290.53" x2="-7.85" y2="339.44" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/>
<line x1="45.25" y1="142.99" x2="-3.67" y2="191.9" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 7.4 KiB

26
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/09.svg Normal file
View file

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="800 0 550 450">
<style>
@media only screen and (max-width: 300px) {
path {stroke-width:25;}
#stroke_1, #stroke_2, #stroke_3 {stroke-width:25;}
}
</style>
<defs>
<linearGradient id="gradient" x1="947.11" y1="266.23" x2="1925.97" y2="266.23" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#3AADAA"/>
<stop offset="1" stop-color="#7C6576"/>
</linearGradient>
</defs>
<path d="M1673.12,647.35c-41.78,0-89.6-6-138.28-17.3-83.64-19.45-148.16-50.23-210.55-80-8.65-4.13-17.59-8.4-26.35-12.51l-6-2.89c-33.23-15.91-64.61-30.93-85.43-47.93-25.71-21-25.11-37.53-21.71-49.58,3.93-14,15.47-31.84,27.69-50.75,16-24.73,34.11-52.76,44-84.22,11.89-37.87,9.43-72.94-7.5-107.2-29.83-60.37-110.09-125.27-174.57-177.41-37-29.88-78.84-63.75-84.06-77.45l-.1-.24c-.3-.77.49-2.2,1.21-3.27,5.74-8.48,25.84-21.65,65-33.18a429.7,429.7,0,0,1,116.14-16.69c23.39,0,44.41,2.25,62.49,6.67,14.54,3.56,27.85,7,40.72,10.27,48,12.3,85.91,22,123.34,22,25.58,0,49.72-4.41,76-13.87,30.38-10.94,66-17,100.43-17,38.9,0,65.23,7.61,74.08,15.15l.19.16c.26.32,2.52,3.49,2.51,16.9,0,11.52-1.6,26.16-3.45,43.12-5,46.15-11.91,109.37,10.18,163.39l0,.11c21.29,50.9,67.15,92.55,111.5,132.82,37.59,34.13,76.45,69.42,98,108.76,20.87,38.71,26.67,84.92,16.34,130.11-10,43.61-34.59,82.1-67.55,105.62C1782.76,635.12,1734.2,647.35,1673.12,647.35Z" fill="none" stroke-width="2" stroke="#F6F6F6"/>
<path d="M1881.84,368.1c47.36,87.8,18.65,202.14-55.75,255.16-75.45,52.53-197.37,44-294.65,21.4s-169.45-60.42-240-93.57c-69.72-33.43-136.49-63.55-121.16-118s113.55-133.54,65.16-231.46S992.39-12.28,976.29-54.54c-17.15-42.75,157-92.42,262.37-66.62S1394.25-75,1470.05-102.28c75-27,164.1-20.62,189.32.88,26,21.21-23.17,139.42,13.58,229.3C1710.76,218.27,1833.42,279.81,1881.84,368.1Z" fill="none" stroke-width="4" stroke="#F6F6F6"/>
<path d="M1673.12,695.35c-45.39,0-97-6.41-149.16-18.55-88.72-20.63-155.63-52.55-220.34-83.42-8.61-4.11-17.51-8.36-26.17-12.43l-6.27-3c-35.89-17.18-69.79-33.41-95-54-16-13-27-26.63-33.69-41.57-8.26-18.41-9.57-38-3.88-58.2,5.9-20.95,19.35-41.76,33.59-63.79,15-23.25,30.57-47.29,38.49-72.55,8.12-25.86,6.61-48.6-4.73-71.56C1180.74,165.31,1105,104.09,1044.19,54.9,986,7.83,955.07-17.95,945.56-42.52c-6.23-15.77-4.06-32.72,6.1-47.76,14.29-21.13,45-38.74,91.26-52.34a472.59,472.59,0,0,1,129.68-18.64c27.23,0,52.09,2.71,73.91,8,14.78,3.62,28.22,7.06,41.21,10.39,46.48,11.92,80.06,20.52,111.43,20.52,19.86,0,38.83-3.5,59.71-11,35.47-12.77,76.91-19.81,116.7-19.81,63.9,0,93.12,16.43,105,26.4,25,20.66,21,56.63,16.09,102.12-4.71,43.3-10.58,97.18,6.84,139.91,17.2,41,57.15,77.28,99.44,115.68,40.53,36.8,82.44,74.86,107.89,121.27l.1.2c26.42,49,33.84,107.08,20.91,163.64-12.74,55.75-43.48,103.36-86.55,134.06l-.3.2C1802,680.21,1744.23,695.35,1673.12,695.35Z" fill="none" stroke-width="6" stroke="#F6F6F6"/>
<path id="stroke_1" d="M1673.12,647.35c-41.78,0-89.6-6-138.28-17.3-83.64-19.45-148.16-50.23-210.55-80-8.65-4.13-17.59-8.4-26.35-12.51l-6-2.89c-33.23-15.91-64.61-30.93-85.43-47.93-25.71-21-25.11-37.53-21.71-49.58,3.93-14,15.47-31.84,27.69-50.75,16-24.73,34.11-52.76,44-84.22,11.89-37.87,9.43-72.94-7.5-107.2-29.83-60.37-110.09-125.27-174.57-177.41-37-29.88-78.84-63.75-84.06-77.45l-.1-.24c-.3-.77.49-2.2,1.21-3.27,5.74-8.48,25.84-21.65,65-33.18a429.7,429.7,0,0,1,116.14-16.69c23.39,0,44.41,2.25,62.49,6.67,14.54,3.56,27.85,7,40.72,10.27,48,12.3,85.91,22,123.34,22,25.58,0,49.72-4.41,76-13.87,30.38-10.94,66-17,100.43-17,38.9,0,65.23,7.61,74.08,15.15l.19.16c.26.32,2.52,3.49,2.51,16.9,0,11.52-1.6,26.16-3.45,43.12-5,46.15-11.91,109.37,10.18,163.39l0,.11c21.29,50.9,67.15,92.55,111.5,132.82,37.59,34.13,76.45,69.42,98,108.76,20.87,38.71,26.67,84.92,16.34,130.11-10,43.61-34.59,82.1-67.55,105.62C1782.76,635.12,1734.2,647.35,1673.12,647.35Z" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="5" stroke-dasharray="326.57 1088.58 0 0 0 0" stroke="url(#gradient)" stroke-dashoffset="600">
<animate attributeName="stroke-dashoffset" dur="6s" repeatCount="indefinite" values="310;1250;1250" calcMode="spline" keyTimes="0;.17;1" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
<path id="stroke_2" d="M1881.84,368.1c47.36,87.8,18.65,202.14-55.75,255.16-75.45,52.53-197.37,44-294.65,21.4s-169.45-60.42-240-93.57c-69.72-33.43-136.49-63.55-121.16-118s113.55-133.54,65.16-231.46S992.39-12.28,976.29-54.54c-17.15-42.75,157-92.42,262.37-66.62S1394.25-75,1470.05-102.28c75-27,164.1-20.62,189.32.88,26,21.21-23.17,139.42,13.58,229.3C1710.76,218.27,1833.42,279.81,1881.84,368.1Z" fill="none" stroke-linecap="round" stroke-miterlimit="10" stroke-width="10" stroke-dasharray="337.45 1124.83 0 0 0 0" stroke="url(#gradient)" stroke-dashoffset="300">
<animate attributeName="stroke-dashoffset" dur="6s" repeatCount="indefinite" values="-130;-130;800;800" calcMode="spline" keyTimes="0;.02;.14;1" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
<path id="stroke_3" d="M1673.12,695.35c-45.39,0-97-6.41-149.16-18.55-88.72-20.63-155.63-52.55-220.34-83.42-8.61-4.11-17.51-8.36-26.17-12.43l-6.27-3c-35.89-17.18-69.79-33.41-95-54-16-13-27-26.63-33.69-41.57-8.26-18.41-9.57-38-3.88-58.2,5.9-20.95,19.35-41.76,33.59-63.79,15-23.25,30.57-47.29,38.49-72.55,8.12-25.86,6.61-48.6-4.73-71.56C1180.74,165.31,1105,104.09,1044.19,54.9,986,7.83,955.07-17.95,945.56-42.52c-6.23-15.77-4.06-32.72,6.1-47.76,14.29-21.13,45-38.74,91.26-52.34a472.59,472.59,0,0,1,129.68-18.64c27.23,0,52.09,2.71,73.91,8,14.78,3.62,28.22,7.06,41.21,10.39,46.48,11.92,80.06,20.52,111.43,20.52,19.86,0,38.83-3.5,59.71-11,35.47-12.77,76.91-19.81,116.7-19.81,63.9,0,93.12,16.43,105,26.4,25,20.66,21,56.63,16.09,102.12-4.71,43.3-10.58,97.18,6.84,139.91,17.2,41,57.15,77.28,99.44,115.68,40.53,36.8,82.44,74.86,107.89,121.27l.1.2c26.42,49,33.84,107.08,20.91,163.64-12.74,55.75-43.48,103.36-86.55,134.06l-.3.2C1802,680.21,1744.23,695.35,1673.12,695.35Z" fill="none" stroke-linecap="round" stroke-miterlimit="10" stroke-width="15" stroke-dasharray="361.39 1204.62 0 0 0 0" stroke="url(#gradient)" stroke-dashoffset="1000">
<animate attributeName="stroke-dashoffset" dur="6s" repeatCount="indefinite" values="350;350;1350;1350" calcMode="spline" keyTimes="0;.02;.19;1" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 6.3 KiB

2007
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/10.svg Normal file
View file

File diff suppressed because it is too large Load diff
Side by side

After

Width:  |  Height:  |  Size: 201 KiB

259
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/11.svg Normal file
View file

@ -0,0 +1,259 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none" width="1680" height="916">
<style>
@keyframes ld-speed-dash {
0% {transform: translate(0,0);}
50% {transform: translate(420px,0);}
100% {transform: translate(0,0);}
}
.ld.ld-speed-dash { animation: ld-speed-dash 0.5s linear infinite;}
.color-1 {fill: #3AADAA;}
.color-2 {fill: #F6F6F6;}
@media only screen and (max-width: 300px) {
path {stroke-width: 7px;}
path.color-1 {stroke: #3AADAA;}
path.color-2 {stroke: #F6F6F6;}
}
</style>
<g transform="translate(840,458)">
<g style="transform:rotate(55.24338047767972deg)">
<path class="color-1 ld ld-speed-dash" d="M313.2445224481763 0 L3016.3446181725676 22.970719727734053L3016.3446181725676 -22.970719727734053z" style="animation-delay:-0.6489830890161201s"></path>
</g>
<g style="transform:rotate(210.4868856357207deg)">
<path class="color-2 ld ld-speed-dash" d="M246.44683979796605 0 L3395.193670017361 28.314006846451704L3395.193670017361 -28.314006846451704z" style="animation-delay:-1.6578847076863537s"></path>
</g>
<g style="transform:rotate(11.804271323202018deg)">
<path class="color-2 ld ld-speed-dash" d="M432.4046927974893 0 L3760.0907644539116 18.55222383241528L3760.0907644539116 -18.55222383241528z" style="animation-delay:-1.850133252333448s"></path>
</g>
<g style="transform:rotate(290.7161730335263deg)">
<path class="color-2 ld ld-speed-dash" d="M174.15158313264382 0 L2546.6645917604255 24.539259218471095L2546.6645917604255 -24.539259218471095z" style="animation-delay:-1.9766260357049634s"></path>
</g>
<g style="transform:rotate(81.41376440297725deg)">
<path class="color-1 ld ld-speed-dash" d="M247.25038624683202 0 L2307.3774339381475 29.28173657581924L2307.3774339381475 -29.28173657581924z" style="animation-delay:-0.9699037613678558s"></path>
</g>
<g style="transform:rotate(30.284589478401685deg)">
<path class="color-1 ld ld-speed-dash" d="M414.280660250802 0 L3565.7563633646746 18.23666494702347L3565.7563633646746 -18.23666494702347z" style="animation-delay:-0.923679783771481s"></path>
</g>
<g style="transform:rotate(217.14660851410417deg)">
<path class="color-1 ld ld-speed-dash" d="M173.7941720547917 0 L3223.7522335113167 17.332620232541363L3223.7522335113167 -17.332620232541363z" style="animation-delay:-1.8492032592515848s"></path>
</g>
<g style="transform:rotate(48.29907110760935deg)">
<path class="color-1 ld ld-speed-dash" d="M201.2735832417632 0 L3049.7640609564082 15.943761716463927L3049.7640609564082 -15.943761716463927z" style="animation-delay:-1.0990466564806636s"></path>
</g>
<g style="transform:rotate(146.1549253656204deg)">
<path class="color-1 ld ld-speed-dash" d="M437.39387601152345 0 L3538.469041049942 17.81595925765719L3538.469041049942 -17.81595925765719z" style="animation-delay:-1.125377682112692s"></path>
</g>
<g style="transform:rotate(73.04298076974551deg)">
<path class="color-2 ld ld-speed-dash" d="M298.5348949064443 0 L2576.1825810011146 25.847492726877142L2576.1825810011146 -25.847492726877142z" style="animation-delay:-0.9685658204106042s"></path>
</g>
<g style="transform:rotate(60.616709263655075deg)">
<path class="color-1 ld ld-speed-dash" d="M315.8408637199277 0 L2897.5535429894485 25.702663313553842L2897.5535429894485 -25.702663313553842z" style="animation-delay:-1.542523075478611s"></path>
</g>
<g style="transform:rotate(100.4615586871835deg)">
<path class="color-1 ld ld-speed-dash" d="M254.7515409111282 0 L2364.1993507673897 21.096698011404996L2364.1993507673897 -21.096698011404996z" style="animation-delay:-0.39824796640343507s"></path>
</g>
<g style="transform:rotate(65.37582262849955deg)">
<path class="color-2 ld ld-speed-dash" d="M188.3578726853288 0 L2657.0211215039385 13.060246203277037L2657.0211215039385 -13.060246203277037z" style="animation-delay:-0.06598363448004374s"></path>
</g>
<g style="transform:rotate(112.02688169934763deg)">
<path class="color-2 ld ld-speed-dash" d="M343.25986980556115 0 L2748.3233778832237 20.028083647301397L2748.3233778832237 -20.028083647301397z" style="animation-delay:-1.4258544105147384s"></path>
</g>
<g style="transform:rotate(113.13396331646763deg)">
<path class="color-1 ld ld-speed-dash" d="M284.78544752684365 0 L2717.109589385633 27.024689038603597L2717.109589385633 -27.024689038603597z" style="animation-delay:-0.7873199196462166s"></path>
</g>
<g style="transform:rotate(79.55398352468583deg)">
<path class="color-2 ld ld-speed-dash" d="M159.80425774135685 0 L2268.8444579606416 22.48999810501333L2268.8444579606416 -22.48999810501333z" style="animation-delay:-0.035573447747699216s"></path>
</g>
<g style="transform:rotate(99.83056335776561deg)">
<path class="color-2 ld ld-speed-dash" d="M211.87732702690317 0 L2304.7605938486695 23.15943581661871L2304.7605938486695 -23.15943581661871z" style="animation-delay:-1.883254016123865s"></path>
</g>
<g style="transform:rotate(57.65729453990513deg)">
<path class="color-1 ld ld-speed-dash" d="M250.34111696902914 0 L2899.7939454001926 20.19361222723075L2899.7939454001926 -20.19361222723075z" style="animation-delay:-1.4411192647494797s"></path>
</g>
<g style="transform:rotate(108.63546495122914deg)">
<path class="color-2 ld ld-speed-dash" d="M296.89071306462733 0 L2617.1568452205493 12.348376706939423L2617.1568452205493 -12.348376706939423z" style="animation-delay:-1.7756863188336487s"></path>
</g>
<g style="transform:rotate(55.114249387677305deg)">
<path class="color-1 ld ld-speed-dash" d="M198.0530895490627 0 L2903.980289863673 11.087315245696864L2903.980289863673 -11.087315245696864z" style="animation-delay:-0.5215636384353961s"></path>
</g>
<g style="transform:rotate(127.78117814251597deg)">
<path class="color-1 ld ld-speed-dash" d="M360.4110430863276 0 L3128.5363497286958 20.05221628604818L3128.5363497286958 -20.05221628604818z" style="animation-delay:-1.8027494316948762s"></path>
</g>
<g style="transform:rotate(213.9162179418826deg)">
<path class="color-2 ld ld-speed-dash" d="M254.79700423966216 0 L3354.8144945531362 27.667496579945244L3354.8144945531362 -27.667496579945244z" style="animation-delay:-0.9030241406131401s"></path>
</g>
<g style="transform:rotate(223.09230252203915deg)">
<path class="color-1 ld ld-speed-dash" d="M345.4171221030021 0 L3293.2453339702015 27.593464445601597L3293.2453339702015 -27.593464445601597z" style="animation-delay:-0.860549961144355s"></path>
</g>
<g style="transform:rotate(41.22844870034023deg)">
<path class="color-1 ld ld-speed-dash" d="M380.42487662742707 0 L3361.6149760035933 21.318882211266445L3361.6149760035933 -21.318882211266445z" style="animation-delay:-0.3320571154332974s"></path>
</g>
<g style="transform:rotate(74.73133572326748deg)">
<path class="color-2 ld ld-speed-dash" d="M315.06660598608784 0 L2549.458503918934 27.40176442431239L2549.458503918934 -27.40176442431239z" style="animation-delay:-0.5746637580825329s"></path>
</g>
<g style="transform:rotate(265.1179163644999deg)">
<path class="color-1 ld ld-speed-dash" d="M98.50424105560748 0 L2060.5452345584754 20.01812037292764L2060.5452345584754 -20.01812037292764z" style="animation-delay:-0.9777874924087229s"></path>
</g>
<g style="transform:rotate(90.83848848895639deg)">
<path class="color-1 ld ld-speed-dash" d="M259.84206537701056 0 L2114.202607300303 23.772976607270124L2114.202607300303 -23.772976607270124z" style="animation-delay:-0.20663411589934366s"></path>
</g>
<g style="transform:rotate(240.46264324666643deg)">
<path class="color-1 ld ld-speed-dash" d="M267.8816775896251 0 L2853.171812319316 21.566995901033252L2853.171812319316 -21.566995901033252z" style="animation-delay:-0.6417651916024907s"></path>
</g>
<g style="transform:rotate(262.8487057078134deg)">
<path class="color-1 ld ld-speed-dash" d="M197.36366451215005 0 L2219.5841041400668 16.470936703291976L2219.5841041400668 -16.470936703291976z" style="animation-delay:-0.8857067472574132s"></path>
</g>
<g style="transform:rotate(22.158703468812398deg)">
<path class="color-1 ld ld-speed-dash" d="M476.43043785988954 0 L3723.576448292826 24.25011230847808L3723.576448292826 -24.25011230847808z" style="animation-delay:-1.5236462382470983s"></path>
</g>
<g style="transform:rotate(96.35121086965866deg)">
<path class="color-2 ld ld-speed-dash" d="M133.94074075608765 0 L2134.9721770649735 29.250182152970723L2134.9721770649735 -29.250182152970723z" style="animation-delay:-0.6012195514386818s"></path>
</g>
<g style="transform:rotate(113.8704019517356deg)">
<path class="color-2 ld ld-speed-dash" d="M176.74423879055144 0 L2627.078844129286 27.41035869827181L2627.078844129286 -27.41035869827181z" style="animation-delay:-0.4512486157444813s"></path>
</g>
<g style="transform:rotate(318.6520639302219deg)">
<path class="color-2 ld ld-speed-dash" d="M248.77896379120511 0 L3227.866419017381 11.095039186354265L3227.866419017381 -11.095039186354265z" style="animation-delay:-0.4639335579054209s"></path>
</g>
<g style="transform:rotate(341.7454645247612deg)">
<path class="color-1 ld ld-speed-dash" d="M239.14874814015087 0 L3522.251129728406 13.52820950579158L3522.251129728406 -13.52820950579158z" style="animation-delay:-0.6387003125281372s"></path>
</g>
<g style="transform:rotate(86.98937850853238deg)">
<path class="color-1 ld ld-speed-dash" d="M165.62230687997337 0 L2077.874519080917 28.667649166329614L2077.874519080917 -28.667649166329614z" style="animation-delay:-0.06846445382861344s"></path>
</g>
<g style="transform:rotate(171.17815601058436deg)">
<path class="color-1 ld ld-speed-dash" d="M395.61814165990035 0 L3737.541876980575 16.065861238866862L3737.541876980575 -16.065861238866862z" style="animation-delay:-1.8574488306542118s"></path>
</g>
<g style="transform:rotate(300.143573836183deg)">
<path class="color-2 ld ld-speed-dash" d="M276.47134938315753 0 L2875.784887211603 21.515180675836785L2875.784887211603 -21.515180675836785z" style="animation-delay:-1.1358579567642209s"></path>
</g>
<g style="transform:rotate(79.23618930522349deg)">
<path class="color-1 ld ld-speed-dash" d="M315.7145627698534 0 L2433.0851300956774 19.29807352767049L2433.0851300956774 -19.29807352767049z" style="animation-delay:-0.7889680697480399s"></path>
</g>
<g style="transform:rotate(183.98546097847913deg)">
<path class="color-2 ld ld-speed-dash" d="M463.15940688966 0 L3819.4642736936275 29.829463048409046L3819.4642736936275 -29.829463048409046z" style="animation-delay:-0.3274586698919939s"></path>
</g>
<g style="transform:rotate(293.6806041786108deg)">
<path class="color-2 ld ld-speed-dash" d="M265.12872058026954 0 L2710.8312524926473 13.438406971430812L2710.8312524926473 -13.438406971430812z" style="animation-delay:-1.3475237097514055s"></path>
</g>
<g style="transform:rotate(136.8452855182489deg)">
<path class="color-1 ld ld-speed-dash" d="M425.64134986205437 0 L3372.331793998036 19.590918815404883L3372.331793998036 -19.590918815404883z" style="animation-delay:-1.4902275108795786s"></path>
</g>
<g style="transform:rotate(263.55944634321855deg)">
<path class="color-2 ld ld-speed-dash" d="M143.9672316106818 0 L2147.3664877144693 26.30065288602394L2147.3664877144693 -26.30065288602394z" style="animation-delay:-1.2511347005766535s"></path>
</g>
<g style="transform:rotate(113.8407201933296deg)">
<path class="color-1 ld ld-speed-dash" d="M167.76728985826 0 L2617.3779489818835 21.74535969216877L2617.3779489818835 -21.74535969216877z" style="animation-delay:-0.6243469630651299s"></path>
</g>
<g style="transform:rotate(27.52762985879408deg)">
<path class="color-2 ld ld-speed-dash" d="M467.04656209242165 0 L3654.0587179096633 23.95053466937522L3654.0587179096633 -23.95053466937522z" style="animation-delay:-1.3839630974557946s"></path>
</g>
<g style="transform:rotate(196.55175240064295deg)">
<path class="color-2 ld ld-speed-dash" d="M443.91177804318187 0 L3740.595747096498 16.84110169194345L3740.595747096498 -16.84110169194345z" style="animation-delay:-1.5320881113766567s"></path>
</g>
<g style="transform:rotate(251.7001603677825deg)">
<path class="color-1 ld ld-speed-dash" d="M262.47441366060997 0 L2574.2508258842868 13.750281635012488L2574.2508258842868 -13.750281635012488z" style="animation-delay:-1.6935172774163747s"></path>
</g>
<g style="transform:rotate(344.92538381917194deg)">
<path class="color-1 ld ld-speed-dash" d="M337.0866073970525 0 L3644.5049915685127 27.8852834296704L3644.5049915685127 -27.8852834296704z" style="animation-delay:-1.7988559066127827s"></path>
</g>
<g style="transform:rotate(270.0462656082373deg)">
<path class="color-2 ld ld-speed-dash" d="M136.5262872710875 0 L1969.7601275697086 16.62796179269232L1969.7601275697086 -16.62796179269232z" style="animation-delay:-0.3962343565941828s"></path>
</g>
<g style="transform:rotate(357.52629316704554deg)">
<path class="color-1 ld ld-speed-dash" d="M203.0081020277444 0 L3561.5842099002934 21.80803645068479L3561.5842099002934 -21.80803645068479z" style="animation-delay:-0.09004915330808227s"></path>
</g>
<g style="transform:rotate(297.6700380951448deg)">
<path class="color-2 ld ld-speed-dash" d="M230.77743933987702 0 L2772.3485205584725 17.634362824258076L2772.3485205584725 -17.634362824258076z" style="animation-delay:-1.8847482138818528s"></path>
</g>
<g style="transform:rotate(334.67458104556795deg)">
<path class="color-1 ld ld-speed-dash" d="M335.2092546395992 0 L3548.357553510144 11.752587412578528L3548.357553510144 -11.752587412578528z" style="animation-delay:-0.3468252877774507s"></path>
</g>
<g style="transform:rotate(200.03509804173376deg)">
<path class="color-1 ld ld-speed-dash" d="M410.12367162993473 0 L3677.6535902358546 20.851990632140456L3677.6535902358546 -20.851990632140456z" style="animation-delay:-1.5033160558457652s"></path>
</g>
<g style="transform:rotate(208.50821043740768deg)">
<path class="color-1 ld ld-speed-dash" d="M353.3195477450612 0 L3528.047602886495 21.779724642613296L3528.047602886495 -21.779724642613296z" style="animation-delay:-0.49278025813507353s"></path>
</g>
<g style="transform:rotate(203.37137940920567deg)">
<path class="color-2 ld ld-speed-dash" d="M249.47643114325987 0 L3484.1084560730374 17.543644210107555L3484.1084560730374 -17.543644210107555z" style="animation-delay:-1.183525013282905s"></path>
</g>
<g style="transform:rotate(94.75392540557597deg)">
<path class="color-2 ld ld-speed-dash" d="M163.22182557297185 0 L2121.8570920062657 12.884390827854148L2121.8570920062657 -12.884390827854148z" style="animation-delay:-0.5993106933731225s"></path>
</g>
<g style="transform:rotate(91.09764440491854deg)">
<path class="color-2 ld ld-speed-dash" d="M241.27121697017162 0 L2102.5421000132364 27.60948995568958L2102.5421000132364 -27.60948995568958z" style="animation-delay:-0.5701454600935785s"></path>
</g>
<g style="transform:rotate(195.49626166701324deg)">
<path class="color-1 ld ld-speed-dash" d="M280.26762318326337 0 L3584.721595208608 26.901254751248473L3584.721595208608 -26.901254751248473z" style="animation-delay:-1.7033306019751842s"></path>
</g>
<g style="transform:rotate(99.6468381262713deg)">
<path class="color-2 ld ld-speed-dash" d="M262.5474471366609 0 L2350.6016230690575 16.48956496439186L2350.6016230690575 -16.48956496439186z" style="animation-delay:-1.2772043212668458s"></path>
</g>
<g style="transform:rotate(353.51642356333923deg)">
<path class="color-2 ld ld-speed-dash" d="M302.4122813656499 0 L3652.6395967906174 29.940813512408994L3652.6395967906174 -29.940813512408994z" style="animation-delay:-0.5338704255383058s"></path>
</g>
<g style="transform:rotate(296.1023443106776deg)">
<path class="color-1 ld ld-speed-dash" d="M240.0422142252214 0 L2744.32540948797 25.12222385489084L2744.32540948797 -25.12222385489084z" style="animation-delay:-0.5725340822030076s"></path>
</g>
<g style="transform:rotate(123.81424989866738deg)">
<path class="color-1 ld ld-speed-dash" d="M379.73551970888406 0 L3062.0709890139296 15.766582448800893L3062.0709890139296 -15.766582448800893z" style="animation-delay:-0.8038374830548025s"></path>
</g>
<g style="transform:rotate(307.5133115199984deg)">
<path class="color-2 ld ld-speed-dash" d="M335.2219844735896 0 L3097.6910633392436 12.256501772505061L3097.6910633392436 -12.256501772505061z" style="animation-delay:-1.9665339756256763s"></path>
</g>
<g style="transform:rotate(197.96980504029375deg)">
<path class="color-2 ld ld-speed-dash" d="M483.1566190043299 0 L3768.6196125710753 24.37077465750347L3768.6196125710753 -24.37077465750347z" style="animation-delay:-1.3400876261784194s"></path>
</g>
<g style="transform:rotate(189.1671462122452deg)">
<path class="color-2 ld ld-speed-dash" d="M223.1400076281049 0 L3563.6240550711086 21.863396711280206L3563.6240550711086 -21.863396711280206z" style="animation-delay:-1.2079027055446052s"></path>
</g>
<g style="transform:rotate(10.29853264676965deg)">
<path class="color-2 ld ld-speed-dash" d="M472.37526258757174 0 L3807.758596999251 24.595418787187754L3807.758596999251 -24.595418787187754z" style="animation-delay:-1.9560543689958285s"></path>
</g>
<g style="transform:rotate(353.285676068699deg)">
<path class="color-2 ld ld-speed-dash" d="M481.49698916619434 0 L3831.0171260583297 21.955548694783225L3831.0171260583297 -21.955548694783225z" style="animation-delay:-1.2189052002595084s"></path>
</g>
<g style="transform:rotate(42.4184896598519deg)">
<path class="color-2 ld ld-speed-dash" d="M165.7637255254543 0 L3125.790932850129 25.504192924218245L3125.790932850129 -25.504192924218245z" style="animation-delay:-0.5061115118465103s"></path>
</g>
<g style="transform:rotate(272.26577032833677deg)">
<path class="color-2 ld ld-speed-dash" d="M103.651415171839 0 L1996.06066019413 29.55673031483032L1996.06066019413 -29.55673031483032z" style="animation-delay:-1.5586274134897886s"></path>
</g>
<g style="transform:rotate(221.51826436955614deg)">
<path class="color-2 ld ld-speed-dash" d="M338.6495499451276 0 L3314.7310804000663 27.581281361701176L3314.7310804000663 -27.581281361701176z" style="animation-delay:-0.6608791563791256s"></path>
</g>
<g style="transform:rotate(43.226821627165634deg)">
<path class="color-1 ld ld-speed-dash" d="M185.0229697206139 0 L3130.397256532069 10.477557707979717L3130.397256532069 -10.477557707979717z" style="animation-delay:-1.1972579359569604s"></path>
</g>
<g style="transform:rotate(225.99295227079088deg)">
<path class="color-2 ld ld-speed-dash" d="M414.091155497906 0 L3307.6643398105834 26.355277595234924L3307.6643398105834 -26.355277595234924z" style="animation-delay:-1.5129389750277573s"></path>
</g>
<g style="transform:rotate(120.42097927370318deg)">
<path class="color-2 ld ld-speed-dash" d="M149.1625236217494 0 L2754.864629841125 12.188449754943989L2754.864629841125 -12.188449754943989z" style="animation-delay:-1.947609317586565s"></path>
</g>
<g style="transform:rotate(3.5388204044753913deg)">
<path class="color-1 ld ld-speed-dash" d="M392.51149313030595 0 L3749.597912289889 15.888700212403197L3749.597912289889 -15.888700212403197z" style="animation-delay:-1.3332837322725055s"></path>
</g>
<g style="transform:rotate(281.72140359288227deg)">
<path class="color-1 ld ld-speed-dash" d="M205.78786359399032 0 L2348.2057740718265 15.034358480513177L2348.2057740718265 -15.034358480513177z" style="animation-delay:-0.9836557586571493s"></path>
</g>
<g style="transform:rotate(1.6261164472698475deg)">
<path class="color-2 ld ld-speed-dash" d="M234.09021214417234 0 L3593.474862112877 24.534341183066903L3593.474862112877 -24.534341183066903z" style="animation-delay:-1.5081678120290505s"></path>
</g>
<g style="transform:rotate(47.59642177815526deg)">
<path class="color-1 ld ld-speed-dash" d="M413.7388134402528 0 L3276.143327703428 11.363853837051208L3276.143327703428 -11.363853837051208z" style="animation-delay:-1.5223841980889588s"></path>
</g>
<g style="transform:rotate(230.50681744242306deg)">
<path class="color-1 ld ld-speed-dash" d="M402.6724750243132 0 L3206.459698231108 10.125852356402284L3206.459698231108 -10.125852356402284z" style="animation-delay:-0.8523546486866076s"></path>
</g>
<g style="transform:rotate(235.73899572949838deg)">
<path class="color-1 ld ld-speed-dash" d="M145.04977014661085 0 L2837.258262128088 20.589335353751L2837.258262128088 -20.589335353751z" style="animation-delay:-0.41441863349594854s"></path>
</g>
<g style="transform:rotate(66.58548349719469deg)">
<path class="color-2 ld ld-speed-dash" d="M153.5556796581544 0 L2592.752932239427 18.521882029167195L2592.752932239427 -18.521882029167195z" style="animation-delay:-0.5305769590933451s"></path>
</g>
<g style="transform:rotate(33.133383029425175deg)">
<path class="color-1 ld ld-speed-dash" d="M286.5877552678988 0 L3398.1355535365446 25.618123371944407L3398.1355535365446 -25.618123371944407z" style="animation-delay:-1.3246119075207416s"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 22 KiB

489
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/12.svg Normal file
View file

@ -0,0 +1,489 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" viewBox="0 0 2017 916">
<style>
@media only screen and (max-width: 300px) {
circle {r: 20px;}
}
</style>
<g>
<path id="path0" d="M 1641.439297189479 135.81232644366278 c 0 33.9737406989396 -8.312723788038411 9.75841488161031 -18.07113866964872 9.75841488161031 S 1605.2970198501816 169.78606714260238 1605.2970198501816 135.81232644366278 s 8.312723788038411 -9.75841488161031 18.07113866964872 -9.75841488161031 S 1641.439297189479 101.83858574472319 1641.439297189479 135.81232644366278 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.9831789292216961" fill="#7C6576">
<animateMotion begin="-3.021474187424413s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path0"/>
</animateMotion>
</circle>
<path id="path1" d="M 1702.5322381553547 20.69196831892678 c 0 36.01156949405203 -8.8113414719489 10.343748684461755 -19.155090156410655 10.343748684461755 S 1664.2220578425336 56.70353781297881 1664.2220578425336 20.69196831892678 s 8.8113414719489 -10.343748684461755 19.155090156410655 -10.343748684461755 S 1702.5322381553547 -15.319601175125253 1702.5322381553547 20.69196831892678 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.1104619943877205" fill="#383E45">
<animateMotion begin="-6.540912690228073s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path1"/>
</animateMotion>
</circle>
<path id="path2" d="M 1365.4932123027843 88.82451086688542 c 0 36.29881570111073 -8.88162511835688 10.426255573723296 -19.307880692080175 10.426255573723296 S 1326.8774509186242 125.12332656799614 1326.8774509186242 88.82451086688542 s 8.88162511835688 -10.426255573723296 19.307880692080175 -10.426255573723296 S 1365.4932123027843 52.525695165774685 1365.4932123027843 88.82451086688542 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.179787430506356" fill="#7C6576">
<animateMotion begin="-3.72635678876877s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path2"/>
</animateMotion>
</circle>
<path id="path3" d="M 980.9249222677005 153.30315585286127 c 0 22.542791481414763 -5.515789405027016 6.475057127640412 -11.990846532667428 6.475057127640412 S 956.9432292023656 175.84594733427602 956.9432292023656 153.30315585286127 s 5.515789405027016 -6.475057127640412 11.990846532667428 -6.475057127640412 S 980.9249222677005 130.7603643714465 980.9249222677005 153.30315585286127 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.7962666080720404" fill="#3AADAA">
<animateMotion begin="-9.579681416464375s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path3"/>
</animateMotion>
</circle>
<path id="path4" d="M 1059.1925100004203 731.536452804962 c 0 33.47518072078478 -8.190735708277124 9.61521148362967 -17.805947191906796 9.61521148362967 S 1023.5806156166066 765.0116335257468 1023.5806156166066 731.536452804962 s 8.190735708277124 -9.61521148362967 17.805947191906796 -9.61521148362967 S 1059.1925100004203 698.0612720841772 1059.1925100004203 731.536452804962 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.217164786624246" fill="#3AADAA">
<animateMotion begin="-0.09767102455409456s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path4"/>
</animateMotion>
</circle>
<path id="path5" d="M 1960.8606970821356 54.55150457411335 c 0 33.72649226404435 -8.252226830564043 9.6873967141404 -17.939623544704443 9.6873967141404 S 1924.9814499927265 88.2779968381577 1924.9814499927265 54.55150457411335 s 8.252226830564043 -9.6873967141404 17.939623544704443 -9.6873967141404 S 1960.8606970821356 20.825012310069 1960.8606970821356 54.55150457411335 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.043588829452329" fill="#3AADAA">
<animateMotion begin="-8.784686221624025s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path5"/>
</animateMotion>
</circle>
<path id="path6" d="M 969.699149648894 590.0278042263682 c 0 20.3601255957228 -4.981732858527918 5.848121181750166 -10.829854040278084 5.848121181750166 S 948.0394415683379 610.387929822091 948.0394415683379 590.0278042263682 s 4.981732858527918 -5.848121181750166 10.829854040278084 -5.848121181750166 S 969.699149648894 569.6676786306454 969.699149648894 590.0278042263682 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.8998749727019495" fill="#7C6576">
<animateMotion begin="-3.372726348116731s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path6"/>
</animateMotion>
</circle>
<path id="path7" d="M 1891.6496503130263 769.1654799407347 c 0 33.11815385294794 -8.103378070402155 9.512661213080792 -17.616039283482944 9.512661213080792 S 1856.4175717460605 802.2836337936826 1856.4175717460605 769.1654799407347 s 8.103378070402155 -9.512661213080792 17.616039283482944 -9.512661213080792 S 1891.6496503130263 736.0473260877868 1891.6496503130263 769.1654799407347 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.118238011238304" fill="#383E45">
<animateMotion begin="-1.1945065618803872s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path7"/>
</animateMotion>
</circle>
<path id="path8" d="M 1046.0909036581954 755.781943373798 c 0 20.911842339594713 -5.116727380964663 6.00659301243678 -11.123320393401443 6.00659301243678 S 1023.8442628713926 776.6937857133927 1023.8442628713926 755.781943373798 s 5.116727380964663 -6.00659301243678 11.123320393401443 -6.00659301243678 S 1046.0909036581954 734.8701010342032 1046.0909036581954 755.781943373798 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.300178336995682" fill="#7C6576">
<animateMotion begin="-1.5522058308081417s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path8"/>
</animateMotion>
</circle>
<path id="path9" d="M 1933.03091926479 226.8935388962186 c 0 36.107228773873835 -8.834747465947853 10.371225286112697 -19.20597275206055 10.371225286112697 S 1894.6189737606692 263.00076767009244 1894.6189737606692 226.8935388962186 s 8.834747465947853 -10.371225286112697 19.20597275206055 -10.371225286112697 S 1933.03091926479 190.78631012234476 1933.03091926479 226.8935388962186 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.3843217283910447" fill="#7C6576">
<animateMotion begin="-1.6841464438212168s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path9"/>
</animateMotion>
</circle>
<path id="path10" d="M 289.6915909952289 443.9030956087715 c 0 26.063704262487924 -6.3772893408215126 7.4863831392252544 -13.863672480046766 7.4863831392252544 S 261.9642460351354 469.9667998712594 261.9642460351354 443.9030956087715 s 6.3772893408215126 -7.4863831392252544 13.863672480046766 -7.4863831392252544 S 289.6915909952289 417.83939134628355 289.6915909952289 443.9030956087715 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.49876190816474" fill="#383E45">
<animateMotion begin="-1.147644807357336s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path10"/>
</animateMotion>
</circle>
<path id="path11" d="M 1219.5533151802713 437.96673724360915 c 0 21.357417025094055 -5.22575097422514 6.1345772306121225 -11.360328204837263 6.1345772306121225 S 1196.8326587705967 459.3241542687032 1196.8326587705967 437.96673724360915 s 5.22575097422514 -6.1345772306121225 11.360328204837263 -6.1345772306121225 S 1219.5533151802713 416.6093202185151 1219.5533151802713 437.96673724360915 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.0393952832418205" fill="#383E45">
<animateMotion begin="-0.03837145082248017s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path11"/>
</animateMotion>
</circle>
<path id="path12" d="M 1035.3508971187744 832.9224712885151 c 0 32.49068129964169 -7.949847552039988 9.332429735003466 -17.282277287043453 9.332429735003466 S 1000.7863425446874 865.4131525881568 1000.7863425446874 832.9224712885151 s 7.949847552039988 -9.332429735003466 17.282277287043453 -9.332429735003466 S 1035.3508971187744 800.4317899888734 1035.3508971187744 832.9224712885151 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.9209283487003708" fill="#7C6576">
<animateMotion begin="-0.6636934416291722s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path12"/>
</animateMotion>
</circle>
<path id="path13" d="M 1502.3748969795827 325.9553947508575 c 0 27.898301799930778 -6.826180227642637 8.013342006363096 -14.839522234005733 8.013342006363096 S 1472.6958525115713 353.8536965507883 1472.6958525115713 325.9553947508575 s 6.826180227642637 -8.013342006363096 14.839522234005733 -8.013342006363096 S 1502.3748969795827 298.05709295092674 1502.3748969795827 325.9553947508575 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.9968413843052515" fill="#7C6576">
<animateMotion begin="-4.170147100326541s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path13"/>
</animateMotion>
</circle>
<path id="path14" d="M 813.5335662826699 521.039913336714 c 0 28.184554239615544 -6.896220718203802 8.095563451804464 -14.991784170008266 8.095563451804464 S 783.5499979426534 549.2244675763295 783.5499979426534 521.039913336714 s 6.896220718203802 -8.095563451804464 14.991784170008266 -8.095563451804464 S 813.5335662826699 492.85535909709847 813.5335662826699 521.039913336714 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.412499022563109" fill="#383E45">
<animateMotion begin="-3.946996062696267s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path14"/>
</animateMotion>
</circle>
<path id="path15" d="M 502.2837217176335 559.6235237327865 c 0 23.501019370828004 -5.750249420521746 6.750292798003789 -12.500542218525535 6.750292798003789 S 477.28263728058243 583.1245431036144 477.28263728058243 559.6235237327865 s 5.750249420521746 -6.750292798003789 12.500542218525535 -6.750292798003789 S 502.2837217176335 536.1225043619585 502.2837217176335 559.6235237327865 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.46738333057688" fill="#3AADAA">
<animateMotion begin="-4.40422467730074s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path15"/>
</animateMotion>
</circle>
<path id="path16" d="M 1145.7991171113617 580.5806758045254 c 0 29.66347919197533 -7.258085334206729 8.520361044503552 -15.778446378710282 8.520361044503552 S 1114.2422243539413 610.2441549965007 1114.2422243539413 580.5806758045254 s 7.258085334206729 -8.520361044503552 15.778446378710282 -8.520361044503552 S 1145.7991171113617 550.9171966125501 1145.7991171113617 580.5806758045254 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.9976747954642025" fill="#F6F6F6">
<animateMotion begin="-0.13551491165577828s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path16"/>
</animateMotion>
</circle>
<path id="path17" d="M 759.0349178206961 726.6172921525305 c 0 23.67501247435459 -5.792822201171867 6.800269540506106 -12.593091741677974 6.800269540506106 S 733.8487343373401 750.2923046268851 733.8487343373401 726.6172921525305 s 5.792822201171867 -6.800269540506106 12.593091741677974 -6.800269540506106 S 759.0349178206961 702.9422796781759 759.0349178206961 726.6172921525305 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.7878955865201147" fill="#383E45">
<animateMotion begin="-3.707385314665143s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path17"/>
</animateMotion>
</circle>
<path id="path18" d="M 397.5713821387978 823.4782339187914 c 0 24.300998373505887 -5.945988963730163 6.980074000900628 -12.926062964630791 6.980074000900628 S 371.71925620953624 847.7792322922973 371.71925620953624 823.4782339187914 s 5.945988963730163 -6.980074000900628 12.926062964630791 -6.980074000900628 S 397.5713821387978 799.1772355452855 397.5713821387978 823.4782339187914 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.611356528203656" fill="#383E45">
<animateMotion begin="-9.046851687236238s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path18"/>
</animateMotion>
</circle>
<path id="path19" d="M 475.5690713154894 231.6610779881085 c 0 25.0032473235272 -6.117815834480059 7.181783805693984 -13.299599640174042 7.181783805693984 S 448.9698720351413 256.6643253116357 448.9698720351413 231.6610779881085 s 6.117815834480059 -7.181783805693984 13.299599640174042 -7.181783805693984 S 475.5690713154894 206.6578306645813 475.5690713154894 231.6610779881085 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.8106830195828625" fill="#3AADAA">
<animateMotion begin="-3.544659678137492s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path19"/>
</animateMotion>
</circle>
<path id="path20" d="M 355.59221707386456 243.3550164300166 c 0 27.410905586086383 -6.7069237072339005 7.87334522153545 -14.580268928769351 7.87334522153545 S 326.4316792163259 270.765922016103 326.4316792163259 243.3550164300166 s 6.7069237072339005 -7.87334522153545 14.580268928769351 -7.87334522153545 S 355.59221707386456 215.94411084393022 355.59221707386456 243.3550164300166 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.916281953083301" fill="#F6F6F6">
<animateMotion begin="-9.737093499813128s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path20"/>
</animateMotion>
</circle>
<path id="path21" d="M 1149.647013585977 199.16901432991597 c 0 34.03819497867133 -8.328494516057876 9.77692834493751 -18.105422860995386 9.77692834493751 S 1113.4361678639864 233.2072093085873 1113.4361678639864 199.16901432991597 s 8.328494516057876 -9.77692834493751 18.105422860995386 -9.77692834493751 S 1149.647013585977 165.13081935124464 1149.647013585977 199.16901432991597 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.2074430338599527" fill="#3AADAA">
<animateMotion begin="-7.464652939915359s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path21"/>
</animateMotion>
</circle>
<path id="path22" d="M 939.9551417360177 556.7365357640342 c 0 35.287049851119235 -8.634065389103641 10.135641978512973 -18.769707367616615 10.135641978512973 S 902.4157270007844 592.0235856151535 902.4157270007844 556.7365357640342 s 8.634065389103641 -10.135641978512973 18.769707367616615 -10.135641978512973 S 939.9551417360177 521.449485912915 939.9551417360177 556.7365357640342 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.693989333911327" fill="#383E45">
<animateMotion begin="-4.488884612357861s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path22"/>
</animateMotion>
</circle>
<path id="path23" d="M 1928.0291253674409 152.00018194551276 c 0 31.865499157935478 -7.7968774535374035 9.152856141109126 -16.94973359464653 9.152856141109126 S 1894.129658178148 183.86568110344825 1894.129658178148 152.00018194551276 s 7.7968774535374035 -9.152856141109126 16.94973359464653 -9.152856141109126 S 1928.0291253674409 120.13468278757729 1928.0291253674409 152.00018194551276 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.876006760166196" fill="#383E45">
<animateMotion begin="-6.10924140726082s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path23"/>
</animateMotion>
</circle>
<path id="path24" d="M 42.03568489182874 248.45584576920487 c 0 36.09172013165519 -8.830952798170948 10.366770676113724 -19.197723474284672 10.366770676113724 S 3.6402379432593968 284.54756590086004 3.6402379432593968 248.45584576920487 s 8.830952798170948 -10.366770676113724 19.197723474284672 -10.366770676113724 S 42.03568489182874 212.36412563754968 42.03568489182874 248.45584576920487 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.8552272864493404" fill="#3AADAA">
<animateMotion begin="-6.306226515186436s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path24"/>
</animateMotion>
</circle>
<path id="path25" d="M 223.90548344053792 325.80722245608274 c 0 31.71065178535696 -7.758989266629894 9.10837870430466 -16.867367970934552 9.10837870430466 S 190.17074749866885 357.5178742414397 190.17074749866885 325.80722245608274 s 7.758989266629894 -9.10837870430466 16.867367970934552 -9.10837870430466 S 223.90548344053792 294.0965706707258 223.90548344053792 325.80722245608274 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.5655790497578086" fill="#383E45">
<animateMotion begin="-5.079525688732882s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path25"/>
</animateMotion>
</circle>
<path id="path26" d="M 1959.6179250374291 426.2551646367958 c 0 26.068688754223718 -6.378508950501548 7.4878148549366 -13.866323805438148 7.4878148549366 S 1931.8852774265526 452.32385339101955 1931.8852774265526 426.2551646367958 s 6.378508950501548 -7.4878148549366 13.866323805438148 -7.4878148549366 S 1959.6179250374291 400.1864758825721 1959.6179250374291 426.2551646367958 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.636101767033566" fill="#383E45">
<animateMotion begin="-0.995932621916668s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path26"/>
</animateMotion>
</circle>
<path id="path27" d="M 693.837522204097 538.2016109442363 c 0 34.031771114669404 -8.326922719546769 9.775083192511426 -18.102005912058196 9.775083192511426 S 657.6335103799806 572.2333820589057 657.6335103799806 538.2016109442363 s 8.326922719546769 -9.775083192511426 18.102005912058196 -9.775083192511426 S 693.837522204097 504.1698398295669 693.837522204097 538.2016109442363 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.34046416881261" fill="#F6F6F6">
<animateMotion begin="-4.4619063885038965s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path27"/>
</animateMotion>
</circle>
<path id="path28" d="M 1095.9221394122799 222.91673183601898 c 0 30.848164959889367 -7.547955256143141 8.860643126776733 -16.408598382919873 8.860643126776733 S 1063.1049426464403 253.76489679590836 1063.1049426464403 222.91673183601898 s 7.547955256143141 -8.860643126776733 16.408598382919873 -8.860643126776733 S 1095.9221394122799 192.0685668761296 1095.9221394122799 222.91673183601898 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.4906263404635247" fill="#7C6576">
<animateMotion begin="-0.007746680017044248s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path28"/>
</animateMotion>
</circle>
<path id="path29" d="M 321.6214003798791 95.18801542708236 c 0 27.450343470557378 -6.716573402370422 7.8846731245218 -14.601246526892222 7.8846731245218 S 292.41890732609465 122.63835889763973 292.41890732609465 95.18801542708236 s 6.716573402370422 -7.8846731245218 14.601246526892222 -7.8846731245218 S 321.6214003798791 67.73767195652499 321.6214003798791 95.18801542708236 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.8648830751478482" fill="#F6F6F6">
<animateMotion begin="-7.659636197727301s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path29"/>
</animateMotion>
</circle>
<path id="path30" d="M 47.070735032431934 686.8031195395691 c 0 20.915929619705157 -5.117727460140624 6.00776701842595 -11.125494478566573 6.00776701842595 S 24.819746075298788 707.7190491592743 24.819746075298788 686.8031195395691 s 5.117727460140624 -6.00776701842595 11.125494478566573 -6.00776701842595 S 47.070735032431934 665.887189919864 47.070735032431934 686.8031195395691 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.273509128205961" fill="#3AADAA">
<animateMotion begin="-9.92394648065101s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path30"/>
</animateMotion>
</circle>
<path id="path31" d="M 1173.1758940659158 537.047975702882 c 0 25.377855255245308 -6.209475222028106 7.289383956293865 -13.498859178321972 7.289383956293865 S 1146.178175709272 562.4258309581273 1146.178175709272 537.047975702882 s 6.209475222028106 -7.289383956293865 13.498859178321972 -7.289383956293865 S 1173.1758940659158 511.6701204476367 1173.1758940659158 537.047975702882 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.7560615630136143" fill="#3AADAA">
<animateMotion begin="-4.601593237186019s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path31"/>
</animateMotion>
</circle>
<path id="path32" d="M 1558.9689253427953 656.2103495344043 c 0 21.031039071293772 -5.145892538720816 6.040830371541829 -11.186722910262645 6.040830371541829 S 1536.59547952227 677.241388605698 1536.59547952227 656.2103495344043 s 5.145892538720816 -6.040830371541829 11.186722910262645 -6.040830371541829 S 1558.9689253427953 635.1793104631105 1558.9689253427953 656.2103495344043 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.727736871354348" fill="#F6F6F6">
<animateMotion begin="-8.305951822193402s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path32"/>
</animateMotion>
</circle>
<path id="path33" d="M 1449.182029981675 366.3121686282825 c 0 22.58897045527407 -5.527088515652165 6.488321300982978 -12.015409816635144 6.488321300982978 S 1425.1512103484047 388.9011390835566 1425.1512103484047 366.3121686282825 s 5.527088515652165 -6.488321300982978 12.015409816635144 -6.488321300982978 S 1449.182029981675 343.7231981730084 1449.182029981675 366.3121686282825 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.6499615825286837" fill="#F6F6F6">
<animateMotion begin="-8.177204683006952s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path33"/>
</animateMotion>
</circle>
<path id="path34" d="M 1588.5116365750887 113.4769650099347 c 0 21.045122788076217 -5.149338554529287 6.044875694447424 -11.19421424897671 6.044875694447424 S 1566.1232080771351 134.52208779801092 1566.1232080771351 113.4769650099347 s 5.149338554529287 -6.044875694447424 11.19421424897671 -6.044875694447424 S 1588.5116365750887 92.43184222185849 1588.5116365750887 113.4769650099347 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.825987542437706" fill="#3AADAA">
<animateMotion begin="-7.97998479495459s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path34"/>
</animateMotion>
</circle>
<path id="path35" d="M 730.497964708406 171.3626954567077 c 0 19.564366455426935 -4.787025834838505 5.619552066984332 -10.406577901822837 5.619552066984332 S 709.6848089047603 190.92706191213466 709.6848089047603 171.3626954567077 s 4.787025834838505 -5.619552066984332 10.406577901822837 -5.619552066984332 S 730.497964708406 151.79832900128076 730.497964708406 171.3626954567077 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.2822190306932355" fill="#383E45">
<animateMotion begin="-4.4626637443319055s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path35"/>
</animateMotion>
</circle>
<path id="path36" d="M 792.6459361129461 343.0992817796117 c 0 25.976707028636678 -6.356002783602591 7.461394572055217 -13.817397355657807 7.461394572055217 S 765.0111414016304 369.0759888082484 765.0111414016304 343.0992817796117 s 6.356002783602591 -7.461394572055217 13.817397355657807 -7.461394572055217 S 792.6459361129461 317.12257475097505 792.6459361129461 343.0992817796117 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.1350283422722036" fill="#F6F6F6">
<animateMotion begin="-0.5794666752263637s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path36"/>
</animateMotion>
</circle>
<path id="path37" d="M 143.40736644007183 452.054459772904 c 0 30.25444582194688 -7.402683552178491 8.690106778644317 -16.092790330822808 8.690106778644317 S 111.2217857784262 482.3089055948509 111.2217857784262 452.054459772904 s 7.402683552178491 -8.690106778644317 16.092790330822808 -8.690106778644317 S 143.40736644007183 421.8000139509571 143.40736644007183 452.054459772904 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.439522987007082" fill="#F6F6F6">
<animateMotion begin="-8.865325150862155s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path37"/>
</animateMotion>
</circle>
<path id="path38" d="M 1316.5363113037058 388.3091909832539 c 0 19.612545504312905 -4.79881432552337 5.633390729962218 -10.43220505548559 5.633390729962218 S 1295.6719011927346 407.9217364875668 1295.6719011927346 388.3091909832539 s 4.79881432552337 -5.633390729962218 10.43220505548559 -5.633390729962218 S 1316.5363113037058 368.69664547894104 1316.5363113037058 388.3091909832539 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.9733812835888795" fill="#7C6576">
<animateMotion begin="-5.399744233321076s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path38"/>
</animateMotion>
</circle>
<path id="path39" d="M 1114.2900929897726 737.8151530416706 c 0 26.94005736051033 -6.5917161626780585 7.738101582274243 -14.329817744952303 7.738101582274243 S 1085.6304574998678 764.7552104021809 1085.6304574998678 737.8151530416706 s 6.5917161626780585 -7.738101582274243 14.329817744952303 -7.738101582274243 S 1114.2900929897726 710.8750956811602 1114.2900929897726 737.8151530416706 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.5334859087919988" fill="#F6F6F6">
<animateMotion begin="-7.610949358319377s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path39"/>
</animateMotion>
</circle>
<path id="path40" d="M 1479.4248410515354 509.1130614748536 c 0 37.46288878054348 -9.166451510132978 10.760616990156107 -19.927068500289085 10.760616990156107 S 1439.5707040509571 546.5759502553971 1439.5707040509571 509.1130614748536 s 9.166451510132978 -10.760616990156107 19.927068500289085 -10.760616990156107 S 1479.4248410515354 471.65017269431013 1479.4248410515354 509.1130614748536 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.0836869018322104" fill="#F6F6F6">
<animateMotion begin="-8.757140534548146s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path40"/>
</animateMotion>
</circle>
<path id="path41" d="M 1068.0904069587366 107.25004799168642 c 0 36.34604417060479 -8.89318102046713 10.439821197939676 -19.333002218406804 10.439821197939676 S 1029.424402521923 143.5960921622912 1029.424402521923 107.25004799168642 s 8.89318102046713 -10.439821197939676 19.333002218406804 -10.439821197939676 S 1068.0904069587366 70.90400382108163 1068.0904069587366 107.25004799168642 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.1374858169265516" fill="#383E45">
<animateMotion begin="-4.984731539159951s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path41"/>
</animateMotion>
</circle>
<path id="path42" d="M 902.8322669603498 23.206746774464495 c 0 36.82502743458512 -9.010379053143167 10.577401497168067 -19.587780550311233 10.577401497168067 S 863.6567058597274 60.031774209049615 863.6567058597274 23.206746774464495 s 9.010379053143167 -10.577401497168067 19.587780550311233 -10.577401497168067 S 902.8322669603498 -13.618280660120622 902.8322669603498 23.206746774464495 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.266869471566468" fill="#3AADAA">
<animateMotion begin="-4.483214057453645s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path42"/>
</animateMotion>
</circle>
<path id="path43" d="M 810.3059630680661 343.39541843630604 c 0 28.840577108668963 -7.0567369521211285 8.28399555249002 -15.34073250461115 8.28399555249002 S 779.6244980588438 372.235995544975 779.6244980588438 343.39541843630604 s 7.0567369521211285 -8.28399555249002 15.34073250461115 -8.28399555249002 S 810.3059630680661 314.55484132763706 810.3059630680661 343.39541843630604 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.8662383157472973" fill="#3AADAA">
<animateMotion begin="-4.862731800450764s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path43"/>
</animateMotion>
</circle>
<path id="path44" d="M 1739.0099164359935 854.6044491613983 c 0 26.451206594225656 -6.4721037411403195 7.5976870004690715 -14.069790741609392 7.5976870004690715 S 1710.8703349527746 881.055655755624 1710.8703349527746 854.6044491613983 s 6.4721037411403195 -7.5976870004690715 14.069790741609392 -7.5976870004690715 S 1739.0099164359935 828.1532425671726 1739.0099164359935 854.6044491613983 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.2794414045574216" fill="#383E45">
<animateMotion begin="-6.729965331224872s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path44"/>
</animateMotion>
</circle>
<path id="path45" d="M 1196.8241498059276 163.83262464105422 c 0 22.981325444331866 -5.623090268293967 6.601019010605961 -12.224109278899927 6.601019010605961 S 1172.3759312481277 186.8139500853861 1172.3759312481277 163.83262464105422 s 5.623090268293967 -6.601019010605961 12.224109278899927 -6.601019010605961 S 1196.8241498059276 140.85129919672235 1196.8241498059276 163.83262464105422 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.5502979030722144" fill="#F6F6F6">
<animateMotion begin="-5.317497341440651s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path45"/>
</animateMotion>
</circle>
<path id="path46" d="M 1734.6144607757808 259.30700720604665 c 0 30.070969542872234 -7.3577904200644815 8.637406145293088 -15.99519656535757 8.637406145293088 S 1702.6240676450655 289.37797674891885 1702.6240676450655 259.30700720604665 s 7.3577904200644815 -8.637406145293088 15.99519656535757 -8.637406145293088 S 1734.6144607757808 229.23603766317441 1734.6144607757808 259.30700720604665 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.474048403070991" fill="#F6F6F6">
<animateMotion begin="-4.074097328583723s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path46"/>
</animateMotion>
</circle>
<path id="path47" d="M 163.60249901698305 781.9007533762314 c 0 27.755350604468536 -6.791202807476343 7.972281556602664 -14.763484364079007 7.972281556602664 S 134.07553028882504 809.6561039806999 134.07553028882504 781.9007533762314 s 6.791202807476343 -7.972281556602664 14.763484364079007 -7.972281556602664 S 163.60249901698305 754.1454027717629 163.60249901698305 781.9007533762314 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.6814322747436212" fill="#F6F6F6">
<animateMotion begin="-7.01959725067265s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path47"/>
</animateMotion>
</circle>
<path id="path48" d="M 1342.9793383057515 523.2723319719419 c 0 35.29067554229762 -8.634952526306863 10.13668340044719 -18.771635926754055 10.13668340044719 S 1305.4360664522435 558.5630075142395 1305.4360664522435 523.2723319719419 s 8.634952526306863 -10.13668340044719 18.771635926754055 -10.13668340044719 S 1342.9793383057515 487.98165642964426 1342.9793383057515 523.2723319719419 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.323488530969774" fill="#F6F6F6">
<animateMotion begin="-7.877846979620399s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path48"/>
</animateMotion>
</circle>
<path id="path49" d="M 1135.1280961537686 535.1757364335741 c 0 26.184166683847724 -6.406764188601038 7.520984047488176 -13.927748236089215 7.520984047488176 S 1107.2725996815902 561.3599031174218 1107.2725996815902 535.1757364335741 s 6.406764188601038 -7.520984047488176 13.927748236089215 -7.520984047488176 S 1135.1280961537686 508.9915697497264 1135.1280961537686 535.1757364335741 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.7883809140464053" fill="#383E45">
<animateMotion begin="-2.6441947410654962s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path49"/>
</animateMotion>
</circle>
<path id="path50" d="M 106.90377491234571 58.110509362569644 c 0 29.15961849621388 -7.134800270350204 8.375635099976328 -15.510435370326531 8.375635099976328 S 75.88290417169264 87.27012785878352 75.88290417169264 58.110509362569644 s 7.134800270350204 -8.375635099976328 15.510435370326531 -8.375635099976328 S 106.90377491234571 28.950890866355763 106.90377491234571 58.110509362569644 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.779064527562915" fill="#3AADAA">
<animateMotion begin="-4.997798102868942s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path50"/>
</animateMotion>
</circle>
<path id="path51" d="M 1468.1200463139137 907.4913132070845 c 0 23.137734199080295 -5.661360495519646 6.645944929523064 -12.30730542504271 6.645944929523064 S 1443.5054354638285 930.6290474061649 1443.5054354638285 907.4913132070845 s 5.661360495519646 -6.645944929523064 12.30730542504271 -6.645944929523064 S 1468.1200463139137 884.3535790080042 1468.1200463139137 907.4913132070845 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.9475475721830433" fill="#383E45">
<animateMotion begin="-1.8817268485002174s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path51"/>
</animateMotion>
</circle>
<path id="path52" d="M 1846.5287639817068 799.1715641673173 c 0 20.345392984514838 -4.978128070679162 5.843889474275539 -10.8220175449547 5.843889474275539 S 1824.8847288917975 819.5169571518322 1824.8847288917975 799.1715641673173 s 4.978128070679162 -5.843889474275539 10.8220175449547 -5.843889474275539 S 1846.5287639817068 778.8261711828025 1846.5287639817068 799.1715641673173 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.5496624710686624" fill="#3AADAA">
<animateMotion begin="-6.640887292476575s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path52"/>
</animateMotion>
</circle>
<path id="path53" d="M 1594.2758807040764 231.16176224527837 c 0 35.91315131102101 -8.787260427164714 10.315479631889014 -19.102740059053726 10.315479631889014 S 1556.0704005859689 267.0749135562994 1556.0704005859689 231.16176224527837 s 8.787260427164714 -10.315479631889014 19.102740059053726 -10.315479631889014 S 1594.2758807040764 195.24861093425736 1594.2758807040764 231.16176224527837 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.091599287748378" fill="#7C6576">
<animateMotion begin="-2.6921936625397214s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path53"/>
</animateMotion>
</circle>
<path id="path54" d="M 1544.059601395901 530.451508924108 c 0 29.60851114111377 -7.244635704740602 8.504572349043316 -15.749208053783919 8.504572349043316 S 1512.5611852883333 560.0600200652218 1512.5611852883333 530.451508924108 s 7.244635704740602 -8.504572349043316 15.749208053783919 -8.504572349043316 S 1544.059601395901 500.84299778299425 1544.059601395901 530.451508924108 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.8649925375442233" fill="#3AADAA">
<animateMotion begin="-0.06875989131227678s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path54"/>
</animateMotion>
</circle>
<path id="path55" d="M 1714.0057011651077 46.919490974638336 c 0 26.96011219099617 -6.596623195669275 7.74386201230741 -14.340485207976686 7.74386201230741 S 1685.3247307491545 73.8796031656345 1685.3247307491545 46.919490974638336 s 6.596623195669275 -7.74386201230741 14.340485207976686 -7.74386201230741 S 1714.0057011651077 19.959378783642165 1714.0057011651077 46.919490974638336 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.2693784014008176" fill="#7C6576">
<animateMotion begin="-8.510610904991285s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path55"/>
</animateMotion>
</circle>
<path id="path56" d="M 836.1553631406728 762.1182300566742 c 0 36.20790410120122 -8.859380790719447 10.400142667366309 -19.259523458085756 10.400142667366309 S 797.6363162245013 798.3261341578755 797.6363162245013 762.1182300566742 s 8.859380790719447 -10.400142667366309 19.259523458085756 -10.400142667366309 S 836.1553631406728 725.9103259554729 836.1553631406728 762.1182300566742 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.3279825225822255" fill="#F6F6F6">
<animateMotion begin="-0.2249214929465437s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path56"/>
</animateMotion>
</circle>
<path id="path57" d="M 1722.6201572550215 870.044054008376 c 0 34.5260712073417 -8.447868486902756 9.917063006364106 -18.364931493266862 9.917063006364106 S 1685.8902942684879 904.5701252157177 1685.8902942684879 870.044054008376 s 8.447868486902756 -9.917063006364106 18.364931493266862 -9.917063006364106 S 1722.6201572550215 835.5179828010342 1722.6201572550215 870.044054008376 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.242396126765458" fill="#F6F6F6">
<animateMotion begin="-4.587298369671618s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path57"/>
</animateMotion>
</circle>
<path id="path58" d="M 1481.3021505226457 296.7658831081328 c 0 21.60515379378344 -5.286367417627863 6.20573566417184 -11.492103081799703 6.20573566417184 S 1458.3179443590461 318.3710369019162 1458.3179443590461 296.7658831081328 s 5.286367417627863 -6.20573566417184 11.492103081799703 -6.20573566417184 S 1481.3021505226457 275.1607293143494 1481.3021505226457 296.7658831081328 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.5295774869365877" fill="#7C6576">
<animateMotion begin="-6.165857237563325s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path58"/>
</animateMotion>
</circle>
<path id="path59" d="M 482.3796436170078 212.26542400304768 c 0 34.48757376883554 -8.438448900885291 9.906005231474039 -18.344454132359328 9.906005231474039 S 445.69073535228915 246.75299777188323 445.69073535228915 212.26542400304768 s 8.438448900885291 -9.906005231474039 18.344454132359328 -9.906005231474039 S 482.3796436170078 177.77785023421214 482.3796436170078 212.26542400304768 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.847993868148638" fill="#7C6576">
<animateMotion begin="-10.148305981350296s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path59"/>
</animateMotion>
</circle>
<path id="path60" d="M 2017.1767555075114 513.6444886249078 c 0 24.460093437962893 -5.984916479501559 7.025771519414874 -13.010687998916433 7.025771519414874 S 1991.1553795096786 538.1045820628707 1991.1553795096786 513.6444886249078 s 5.984916479501559 -7.025771519414874 13.010687998916433 -7.025771519414874 S 2017.1767555075114 489.1843951869449 2017.1767555075114 513.6444886249078 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.209485598229677" fill="#3AADAA">
<animateMotion begin="-6.218871744719912s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path60"/>
</animateMotion>
</circle>
<path id="path61" d="M 399.228030061129 388.03820338364096 c 0 19.250265086393213 -4.7101712445430195 5.5293314609852855 -10.239502705528306 5.5293314609852855 S 378.7490246500724 407.28846847003416 378.7490246500724 388.03820338364096 s 4.7101712445430195 -5.5293314609852855 10.239502705528306 -5.5293314609852855 S 399.228030061129 368.78793829724776 399.228030061129 388.03820338364096 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.401048365198956" fill="#F6F6F6">
<animateMotion begin="-8.099150589876409s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path61"/>
</animateMotion>
</circle>
<path id="path62" d="M 58.161905996719796 387.91626217986527 c 0 35.76048550664065 -8.749906028220584 10.271628815737209 -19.02153484395779 10.271628815737209 S 20.11883630880421 423.6767476865059 20.11883630880421 387.91626217986527 s 8.749906028220584 -10.271628815737209 19.02153484395779 -10.271628815737209 S 58.161905996719796 352.15577667322464 58.161905996719796 387.91626217986527 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.0956727768933474" fill="#7C6576">
<animateMotion begin="-4.817637309560551s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path62"/>
</animateMotion>
</circle>
<path id="path63" d="M 2009.6406868037898 269.3464706945508 c 0 33.59911378768501 -8.221059756561226 9.650809279441441 -17.871869036002668 9.650809279441441 S 1973.8969487317845 302.94558448223586 1973.8969487317845 269.3464706945508 s 8.221059756561226 -9.650809279441441 17.871869036002668 -9.650809279441441 S 2009.6406868037898 235.7473569068658 2009.6406868037898 269.3464706945508 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.4428452862810928" fill="#F6F6F6">
<animateMotion begin="-2.3815215662263807s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path63"/>
</animateMotion>
</circle>
<path id="path64" d="M 1444.707958029715 291.5523223076004 c 0 27.048704529897858 -6.618300044549476 7.769308747949385 -14.38760879249886 7.769308747949385 S 1415.9327404447172 318.60102683749824 1415.9327404447172 291.5523223076004 s 6.618300044549476 -7.769308747949385 14.38760879249886 -7.769308747949385 S 1444.707958029715 264.5036177777025 1444.707958029715 291.5523223076004 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.47826523483049" fill="#3AADAA">
<animateMotion begin="-5.204415346346059s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path64"/>
</animateMotion>
</circle>
<path id="path65" d="M 1152.3180430269203 428.49586858021814 c 0 20.10518426736212 -4.919353597333283 5.774893353391247 -10.69424695072453 5.774893353391247 S 1130.929549125471 448.60105284758026 1130.929549125471 428.49586858021814 s 4.919353597333283 -5.774893353391247 10.69424695072453 -5.774893353391247 S 1152.3180430269203 408.390684312856 1152.3180430269203 428.49586858021814 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.82435079415752" fill="#3AADAA">
<animateMotion begin="-5.032868859263589s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path65"/>
</animateMotion>
</circle>
<path id="path66" d="M 1217.5894751625694 151.86291578399468 c 0 29.877542696904015 -7.310462574774386 8.581847370387324 -15.89230994516171 8.581847370387324 S 1185.804855272246 181.7404584808987 1185.804855272246 151.86291578399468 s 7.310462574774386 -8.581847370387324 15.89230994516171 -8.581847370387324 S 1217.5894751625694 121.98537308709066 1217.5894751625694 151.86291578399468 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.0075179908935628" fill="#383E45">
<animateMotion begin="-9.67977373265608s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path66"/>
</animateMotion>
</circle>
<path id="path67" d="M 1809.9274649059632 797.8050634957483 c 0 31.12473731345815 -7.6156272149950786 8.940084121950745 -16.555711336945823 8.940084121950745 S 1776.8160422320714 828.9298008092064 1776.8160422320714 797.8050634957483 s 7.6156272149950786 -8.940084121950745 16.555711336945823 -8.940084121950745 S 1809.9274649059632 766.6803261822902 1809.9274649059632 797.8050634957483 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.860861767144375" fill="#383E45">
<animateMotion begin="-9.177023977955722s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path67"/>
</animateMotion>
</circle>
<path id="path68" d="M 1130.4926049859268 512.8179342245091 c 0 22.314549815681783 -5.459943040007244 6.409498351312853 -11.869441391320096 6.409498351312853 S 1106.7537222032865 535.1324840401909 1106.7537222032865 512.8179342245091 s 5.459943040007244 -6.409498351312853 11.869441391320096 -6.409498351312853 S 1130.4926049859268 490.50338440882734 1130.4926049859268 512.8179342245091 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="1.8333262734628755" fill="#383E45">
<animateMotion begin="-1.7755705022637334s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path68"/>
</animateMotion>
</circle>
<path id="path69" d="M 603.8653105346643 460.03480181064305 c 0 26.350973915118107 -6.447578723911876 7.568896762853074 -14.01647548676495 7.568896762853074 S 575.8323595611344 486.38577572576116 575.8323595611344 460.03480181064305 s 6.447578723911876 -7.568896762853074 14.01647548676495 -7.568896762853074 S 603.8653105346643 433.6838278955249 603.8653105346643 460.03480181064305 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.6600447597994012" fill="#3AADAA">
<animateMotion begin="-4.004526420626577s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path69"/>
</animateMotion>
</circle>
<path id="path70" d="M 699.8839442803879 407.13420416517295 c 0 33.47644199839344 -8.191044318755841 9.615573765495988 -17.806618084251827 9.615573765495988 S 664.2707081118843 440.6106461635664 664.2707081118843 407.13420416517295 s 8.191044318755841 -9.615573765495988 17.806618084251827 -9.615573765495988 S 699.8839442803879 373.6577621667795 699.8839442803879 407.13420416517295 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.289541105239308" fill="#7C6576">
<animateMotion begin="-3.571151628088906s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path70"/>
</animateMotion>
</circle>
<path id="path71" d="M 1264.8183821593682 204.01074051535528 c 0 32.27893566769393 -7.89803745060596 9.271609181146129 -17.169646631752087 9.271609181146129 S 1230.479088895864 236.2896761830492 1230.479088895864 204.01074051535528 s 7.89803745060596 -9.271609181146129 17.169646631752087 -9.271609181146129 S 1264.8183821593682 171.73180484766135 1264.8183821593682 204.01074051535528 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.4350953712191536" fill="#383E45">
<animateMotion begin="-0.39779697922652846s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path71"/>
</animateMotion>
</circle>
<path id="path72" d="M 388.8993056315168 806.2448539313298 c 0 26.816480054885854 -6.561479162365687 7.702605973211895 -14.264085135577583 7.702605973211895 S 360.3711353603616 833.0613339862156 360.3711353603616 806.2448539313298 s 6.561479162365687 -7.702605973211895 14.264085135577583 -7.702605973211895 S 388.8993056315168 779.428373876444 388.8993056315168 806.2448539313298 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.2150227595732304" fill="#3AADAA">
<animateMotion begin="-2.8014864178285945s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path72"/>
</animateMotion>
</circle>
<path id="path73" d="M 208.9732943057894 31.236352699519507 c 0 21.479137318521964 -5.2555335992128205 6.169539442554181 -11.425073041767002 6.169539442554181 S 186.1231482222554 52.71549001804147 186.1231482222554 31.236352699519507 s 5.2555335992128205 -6.169539442554181 11.425073041767002 -6.169539442554181 S 208.9732943057894 9.757215380997543 208.9732943057894 31.236352699519507 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.4319112539027805" fill="#7C6576">
<animateMotion begin="-7.339060438071784s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path73"/>
</animateMotion>
</circle>
<path id="path74" d="M 1412.6803462997584 630.8176312320795 c 0 29.40250778954265 -7.19423062935618 8.445401173592037 -15.639631802948218 8.445401173592037 S 1381.4010826938618 660.2201390216221 1381.4010826938618 630.8176312320795 s 7.19423062935618 -8.445401173592037 15.639631802948218 -8.445401173592037 S 1412.6803462997584 601.4151234425369 1412.6803462997584 630.8176312320795 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.381710470264919" fill="#7C6576">
<animateMotion begin="-8.470757441011793s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path74"/>
</animateMotion>
</circle>
<path id="path75" d="M 1733.0956162912278 47.95746424907484 c 0 30.30859721462064 -7.415933361024198 8.705660902071886 -16.121594263096085 8.705660902071886 S 1700.8524277650356 78.26606146369548 1700.8524277650356 47.95746424907484 s 7.415933361024198 -8.705660902071886 16.121594263096085 -8.705660902071886 S 1733.0956162912278 17.6488670344542 1733.0956162912278 47.95746424907484 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="3.4534773518084907" fill="#F6F6F6">
<animateMotion begin="-4.032918742618202s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path75"/>
</animateMotion>
</circle>
<path id="path76" d="M 274.34121609406515 152.06796170530453 c 0 21.59182717413064 -5.283106648989411 6.201907805335396 -11.485014454324807 6.201907805335396 S 251.37118718541552 173.65978887943515 251.37118718541552 152.06796170530453 s 5.283106648989411 -6.201907805335396 11.485014454324807 -6.201907805335396 S 274.34121609406515 130.4761345311739 274.34121609406515 152.06796170530453 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.7212450254539853" fill="#383E45">
<animateMotion begin="-4.003585634360808s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path76"/>
</animateMotion>
</circle>
<path id="path77" d="M 991.4601886276794 345.73774273898397 c 0 21.045991727296474 -5.149551167317222 6.045125283372392 -11.194676450689613 6.045125283372392 S 969.0708357263002 366.78373446628046 969.0708357263002 345.73774273898397 s 5.149551167317222 -6.045125283372392 11.194676450689613 -6.045125283372392 S 991.4601886276794 324.6917510116875 991.4601886276794 345.73774273898397 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.6122738778140917" fill="#383E45">
<animateMotion begin="-2.3383950513585736s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path77"/>
</animateMotion>
</circle>
<path id="path78" d="M 1170.3284620582076 566.337733670078 c 0 23.052421878782123 -5.640486204382859 6.621440326884227 -12.261926531267086 6.621440326884227 S 1145.8046089956733 589.3901555488601 1145.8046089956733 566.337733670078 s 5.640486204382859 -6.621440326884227 12.261926531267086 -6.621440326884227 S 1170.3284620582076 543.285311791296 1170.3284620582076 566.337733670078 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.4288997578781473" fill="#383E45">
<animateMotion begin="-3.864708226492081s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path78"/>
</animateMotion>
</circle>
<path id="path79" d="M 1480.0714293183908 45.705073406454 c 0 19.88255752216468 -4.864881095848805 5.710947373387728 -10.575828469236532 5.710947373387728 S 1458.9197723799177 65.58763092861868 1458.9197723799177 45.705073406454 s 4.864881095848805 -5.710947373387728 10.575828469236532 -5.710947373387728 S 1480.0714293183908 25.822515884289317 1480.0714293183908 45.705073406454 z" fill="none" stroke="none"/>
<circle cx="0" cy="0" r="2.8869593342381896" fill="#7C6576">
<animateMotion begin="-7.6966796648104205s" dur="10.34s" repeatCount="indefinite">
<mpath xlink:href="#path79"/>
</animateMotion>
</circle>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 53 KiB

92
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/13.svg Normal file
View file

@ -0,0 +1,92 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none" width="100%" height="100%">
<style>
@keyframes rotate {
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}
@keyframes rotate_reverse {
0% {transform: rotate(0deg);}
100% {transform: rotate(-360deg);}
}
@keyframes translate_up {
0%, 100% {transform: translate(0, 0);}
50% {transform: translate(0, -100%);}
}
@keyframes translate_down {
0%, 100% {transform: translate(0, 0);}
50% {transform: translate(0, 100%);}
}
@keyframes zig_01 {
0%, 100% {transform: scale(1) rotate(0deg);}
50% {transform: scale(.75) rotate(-15deg);}
}
@keyframes zig_02 {
0%, 100% {transform: translate(0, 0);}
50% {transform: translate(-30%, 0);}
}
@keyframes triangle_01 {
0%, 100% {transform: translate(0, 0) rotate(0deg);}
50% {transform: translate(-50%, 50%) rotate(-15deg);}
}
g,
g > * {
transform-box: fill-box;
transform-origin: center;
}
#half_circle_01 {animation: rotate_reverse 50s linear infinite;}
#circle_01 {animation: translate_down 10s linear infinite;}
#circle_02 {animation: translate_down 20s linear infinite;}
#circle_03 {animation: translate_up 10s linear infinite;}
#zig_01 {animation: zig_01 15s linear infinite;}
#zig_02 {animation: zig_02 30s linear infinite;}
#square_01 {animation: rotate 30s linear infinite;}
#square_02 {animation: rotate_reverse 30s linear infinite;}
#triangle_01 {animation: triangle_01 15s linear infinite;}
@media only screen and (max-width: 300px) {
path,
polyline,
polygon,
rect {transform: scale(2);}
/* Disable rotate animations on thumbnail to prevent an issue in Firefox */
#half_circle_01,
#square_02,
#square_01,
#triangle_01 {animation: none;}
}
</style>
<svg id="sub-svg-1" viewBox="0 0 400 600" preserveAspectRatio="xMinYMid meet" width="33%" height="100%">
<g id="circle_02">
<path d="M299.57,35.51a10.46,10.46,0,1,1-10.46-10.46A10.46,10.46,0,0,1,299.57,35.51Z" fill="none" stroke="#383E45" stroke-linejoin="round" stroke-width="5"/>
</g>
<g id="circle_01">
<path d="M144.3,210.89a10.46,10.46,0,1,1-10.46-10.46A10.46,10.46,0,0,1,144.3,210.89Z" fill="#3AADAA"/>
</g>
<g id="half_circle_01">
<path d="M374.08,469.72l-.14-.19a15.91,15.91,0,1,0-24.63,20.16l.16.17" fill="none" stroke="#7C6576" stroke-linejoin="round" stroke-width="5" stroke-linecap="round"/>
</g>
<g id="square_01">
<rect x="63.62" y="552.98" width="19.54" height="19.54" rx="2.92" fill="#3AADAA"/>
</g>
<g id="zig_01">
<polyline points="73.37 389.55 91.5 391.23 92.85 372.71 110.98 374.39 112.33 355.87 130.46 357.55 131.81 339.03 149.94 340.71 151.29 322.19" fill="none" stroke="#7C6576" stroke-linecap="round" stroke-linejoin="round" stroke-width="5"/>
</g>
</svg>
<svg id="sub-svg-2" viewBox="0 0 400 600" preserveAspectRatio="xMaxYMid meet" x="67%" width="33%" height="100%">
<g id="triangle_01">
<polygon points="332.66 366.71 345.06 355.73 331.9 345.76 318.74 335.78 319.51 356.74 320.27 377.7 332.66 366.71" fill="none" stroke="#7C6576" stroke-linejoin="round" stroke-width="5"/>
</g>
<g id="circle_03">
<path d="M304.21,512.1a10.46,10.46,0,1,1-10.46-10.46A10.46,10.46,0,0,1,304.21,512.1Z" fill="#3AADAA"/>
</g>
<g id="square_02">
<rect x="198.33" y="175.36" width="19.54" height="19.54" fill="none" stroke="#3AADAA" stroke-linejoin="round" stroke-width="5"/>
</g>
<g id="zig_02">
<path d="M225.4,102.39c-8.38-2.74-11.06,9.27-17.63,7.12s-1.62-13.42-10-16.17-11.06,9.28-17.63,7.13-1.62-13.43-10-16.17-11.06,9.27-17.63,7.12-1.62-13.42-10-16.17-11.06,9.28-17.63,7.13-1.62-13.43-10-16.17-11.06,9.27-17.63,7.12-1.62-13.42-10-16.17" fill="none" stroke="#7C6576" stroke-linecap="round" stroke-linejoin="round" stroke-width="5"/>
</g>
</svg>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.8 KiB

120
odoo-bringout-oca-ocb-html_builder/html_builder/static/shapes/Floats/14.svg Normal file
View file

@ -0,0 +1,120 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 600">
<style>
@keyframes shape_01 {
0%, 100% {transform: translate(0, 0) rotate(0deg);}
50% {transform: translate(10%, 5%) rotate(-15deg);}
}
@keyframes shape_02 {
0% {transform: rotate(-40deg);}
100% {transform: rotate(320deg);}
}
@keyframes shape_03 {
0%, 100% {transform: translate(0, 0) rotate(0deg);}
50% {transform: translate(10%, 0) rotate(-30deg);}
}
@keyframes shape_04 {
0%, 100% {transform: scale(1);}
50% {transform: scale(.5);}
}
@keyframes shape_11 {
0%, 100% {transform: translate(0, 0) rotate(0deg);}
50% {transform: translate(0, 50%) rotate(5deg);}
}
.shape {
transform-box: fill-box;
transform-origin: center;
}
#shape_01 {animation: shape_01 20s linear infinite;}
#shape_02 {animation: shape_01 40s linear infinite;}
#shape_03 {animation: shape_02 100s linear infinite;}
#shape_04 {animation: shape_02 200s linear infinite;}
#shape_05 {animation: shape_03 30s linear infinite;}
#shape_06 {animation: shape_03 50s linear infinite;}
#shape_07 {animation: shape_04 30s linear infinite;}
#shape_08 {animation: shape_04 60s linear infinite;}
#shape_09 {animation: shape_01 20s linear infinite;}
#shape_10 {animation: shape_03 25s linear infinite;}
#shape_11 {animation: shape_11 30s linear infinite;}
#shape_12 {animation: shape_04 20s linear infinite;}
#shape_13 {animation: shape_04 35s linear infinite;}
#shape_14 {animation: shape_04 30s linear infinite;}
</style>
<path class="shape" id="shape_01" d="M391,174,313.8,154.62a5,5,0,0,1-2.37-8.33L366.8,89.13a5,5,0,0,1,8.4,2.11L397,167.78A5,5,0,0,1,391,174Z" fill="#3AADAA"/>
<path class="shape" id="shape_02" d="M413.55,165.09l-77.19-19.37a5,5,0,0,1-2.37-8.33l55.37-57.16a5,5,0,0,1,8.4,2.11l21.81,76.53A5,5,0,0,1,413.55,165.09Z" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<rect class="shape" id="shape_03" x="91.61" y="222.65" width="88.4" height="88.4" rx="5" transform="translate(-136.72 142.84) rotate(-38.56)" fill="#3AADAA"/>
<rect class="shape" id="shape_04" x="116.13" y="231.14" width="88.4" height="88.4" rx="5" transform="translate(-136.67 159.97) rotate(-38.56)" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<path class="shape" id="shape_05" d="M1145.57,381.3l13.86-78.36a5,5,0,0,1,8.14-3l60.94,51.19a5,5,0,0,1-1.51,8.53l-74.8,27.17A5,5,0,0,1,1145.57,381.3Z" fill="#3AADAA"/>
<path class="shape" id="shape_06" d="M1163.63,384.13l13.86-78.37a5,5,0,0,1,8.14-2.95L1246.56,354a5,5,0,0,1-1.5,8.53l-74.8,27.18A5,5,0,0,1,1163.63,384.13Z" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<circle class="shape" id="shape_07" cx="1106.82" cy="149.19" r="33.06" fill="#7C6576"/>
<circle class="shape" id="shape_08" cx="1127.39" cy="128.62" r="22.06" fill="none" stroke="#383E45" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
<path class="shape" id="shape_09" d="M1050.81,547.43l-7.74-71.8a5,5,0,0,1,6.45-5.31l54.81,17a5,5,0,0,1,2.31,8l-47.06,54.78A5,5,0,0,1,1050.81,547.43Z" fill="#F6F6F6"/>
<path class="shape" id="shape_10" d="M1070.67,542.08l-7.75-71.8a5,5,0,0,1,6.46-5.31l54.81,17a5,5,0,0,1,2.3,8l-47.06,54.78A5,5,0,0,1,1070.67,542.08Z" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<g>
<path d="M1302.54,508.78a4.5,4.5,0,1,1-4.5-4.49A4.5,4.5,0,0,1,1302.54,508.78Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1319.08,508.78a4.5,4.5,0,1,1-4.5-4.49A4.49,4.49,0,0,1,1319.08,508.78Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1310.66,523a4.5,4.5,0,1,1-4.49-4.49A4.49,4.49,0,0,1,1310.66,523Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1327.2,523a4.5,4.5,0,1,1-4.49-4.49A4.49,4.49,0,0,1,1327.2,523Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1318.64,537.22a4.5,4.5,0,1,1-4.49-4.49A4.49,4.49,0,0,1,1318.64,537.22Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1335.19,537.22a4.5,4.5,0,1,1-4.5-4.49A4.5,4.5,0,0,1,1335.19,537.22Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1326.77,551.44a4.5,4.5,0,1,1-4.5-4.49A4.49,4.49,0,0,1,1326.77,551.44Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
<path d="M1343.31,551.44a4.5,4.5,0,1,1-4.5-4.49A4.49,4.49,0,0,1,1343.31,551.44Z" fill="none" stroke="#7C6576" stroke-miterlimit="10" stroke-width="2"/>
</g>
<path d="M329,457.06l64.1,33.25a5,5,0,0,1,.86,8.32l-44.5,36.25a5,5,0,0,1-8-2.52l-19.61-69.51A5,5,0,0,1,329,457.06Z" fill="#7C6576"/>
<path d="M322.43,476.56l64.11,33.25a5,5,0,0,1,.85,8.32L342.9,554.38a5,5,0,0,1-8-2.52l-19.61-69.51A5,5,0,0,1,322.43,476.56Z" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<circle cx="172.61" cy="395.03" r="18.95" transform="translate(-228.77 237.76) rotate(-45)" fill="none" stroke="#383E45" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
<g class="shape" id="shape_11">
<path d="M800.64,131l17.15-32.52A5,5,0,0,1,825.43,97l19.33,16.22a5,5,0,0,0,7-.62L878.26,81a5,5,0,0,1,7-.62l9.79,8.22a5,5,0,0,0,7-.61l23.72-28.27a5,5,0,0,1,7-.62l11.25,9.44" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/>
<circle class="shape" id="shape_12" cx="949.75" cy="73.11" r="18.95" transform="matrix(0.08, -1, 1, 0.08, 801.54, 1014.07)" fill="none" stroke="#3AADAA" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
<circle class="shape" id="shape_13" cx="882.83" cy="63.67" r="6.74" transform="translate(754.34 939.42) rotate(-85.78)" fill="#7C6576"/>
<circle class="shape" id="shape_14" cx="820.24" cy="92.39" r="11.48" transform="translate(667.72 903.61) rotate(-85.78)" fill="none" stroke="#3AADAA" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
</g>
<circle cx="421.95" cy="559.18" r="18.95" transform="translate(-181.87 204.04) rotate(-22.5)" fill="#3AADAA"/>
<circle cx="1330.69" cy="225.12" r="18.95" transform="translate(836.02 1480.79) rotate(-78.1)" fill="#F6F6F6"/>
<g>
<path d="M81,494.61a4.5,4.5,0,1,1-5.37-3.42A4.5,4.5,0,0,1,81,494.61Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M95.58,484a4.5,4.5,0,1,1-5.37-3.42A4.49,4.49,0,0,1,95.58,484Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M113.29,487.45a4.5,4.5,0,1,1-5.37-3.42A4.51,4.51,0,0,1,113.29,487.45Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M131,490.73a4.5,4.5,0,1,1-5.37-3.42A4.51,4.51,0,0,1,131,490.73Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M145.59,480.3a4.5,4.5,0,1,1-5.37-3.42A4.51,4.51,0,0,1,145.59,480.3Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M157.93,467.6a4.5,4.5,0,1,1-5.36-3.42A4.5,4.5,0,0,1,157.93,467.6Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M84.63,508.37A4.5,4.5,0,1,1,79.27,505,4.49,4.49,0,0,1,84.63,508.37Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M99.22,497.76a4.5,4.5,0,1,1-5.36-3.42A4.5,4.5,0,0,1,99.22,497.76Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M116.93,501.21a4.5,4.5,0,1,1-5.37-3.42A4.48,4.48,0,0,1,116.93,501.21Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M134.6,504.49a4.5,4.5,0,1,1-5.37-3.42A4.49,4.49,0,0,1,134.6,504.49Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M149.23,494.05a4.5,4.5,0,1,1-5.37-3.42A4.5,4.5,0,0,1,149.23,494.05Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M161.57,481.36a4.5,4.5,0,1,1-5.36-3.42A4.49,4.49,0,0,1,161.57,481.36Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M88.27,522.12a4.5,4.5,0,1,1-5.36-3.41A4.5,4.5,0,0,1,88.27,522.12Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M102.87,511.52a4.5,4.5,0,1,1-5.37-3.42A4.51,4.51,0,0,1,102.87,511.52Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M120.57,515a4.5,4.5,0,1,1-5.36-3.42A4.49,4.49,0,0,1,120.57,515Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M138.24,518.25a4.5,4.5,0,1,1-5.36-3.42A4.49,4.49,0,0,1,138.24,518.25Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M152.87,507.81a4.5,4.5,0,1,1-5.36-3.42A4.48,4.48,0,0,1,152.87,507.81Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M165.22,495.12a4.5,4.5,0,1,1-5.37-3.42A4.5,4.5,0,0,1,165.22,495.12Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M91.92,535.88a4.5,4.5,0,1,1-5.37-3.42A4.51,4.51,0,0,1,91.92,535.88Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M106.51,525.28a4.5,4.5,0,1,1-5.37-3.42A4.49,4.49,0,0,1,106.51,525.28Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M124.22,528.72a4.5,4.5,0,1,1-5.37-3.41A4.51,4.51,0,0,1,124.22,528.72Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M141.89,532a4.5,4.5,0,1,1-5.37-3.41A4.51,4.51,0,0,1,141.89,532Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M156.52,521.57a4.5,4.5,0,1,1-5.37-3.42A4.51,4.51,0,0,1,156.52,521.57Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M168.86,508.87a4.5,4.5,0,1,1-5.36-3.41A4.5,4.5,0,0,1,168.86,508.87Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M95.56,549.64a4.5,4.5,0,1,1-5.36-3.42A4.48,4.48,0,0,1,95.56,549.64Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M110.15,539a4.5,4.5,0,1,1-5.36-3.42A4.49,4.49,0,0,1,110.15,539Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M127.86,542.48a4.5,4.5,0,1,1-5.37-3.42A4.5,4.5,0,0,1,127.86,542.48Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M145.53,545.76a4.5,4.5,0,1,1-5.37-3.42A4.5,4.5,0,0,1,145.53,545.76Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M160.16,535.33a4.5,4.5,0,1,1-5.37-3.42A4.49,4.49,0,0,1,160.16,535.33Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
<path d="M172.5,522.63a4.5,4.5,0,1,1-5.36-3.42A4.5,4.5,0,0,1,172.5,522.63Z" fill="none" stroke="#3AADAA" stroke-miterlimit="10" stroke-width="2"/>
</g>
<circle cx="149.31" cy="92.57" r="18.95" transform="translate(25.15 216.85) rotate(-76.83)" fill="#F6F6F6"/>
<circle cx="177.78" cy="120.6" r="10.74" transform="translate(19.83 266.22) rotate(-76.83)" fill="#3AADAA"/>
<rect x="1215.55" y="458.74" width="24.23" height="37.26" rx="2" transform="translate(-65.65 227.62) rotate(-10.32)" fill="#3AADAA"/>
<rect x="1292.24" y="67.52" width="42.42" height="36.18" rx="3" transform="matrix(-0.62, -0.78, 0.78, -0.62, 2065.2, 1166.04)" fill="#3AADAA"/>
<rect x="1317.73" y="62.12" width="42.42" height="36.18" rx="3" transform="translate(2110.8 1177.21) rotate(-128.56)" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<rect x="202.76" y="394.65" width="14.32" height="14.32" rx="2" transform="translate(-234.07 493.38) rotate(-74.07)" fill="#3AADAA"/>
<rect x="192.61" y="416.3" width="9.18" height="9.18" transform="translate(-172.23 138.84) rotate(-27.53)" fill="#F6F6F6"/>
<circle cx="1218.69" cy="493.05" r="11.03" transform="translate(536.79 1617.03) rotate(-80.78)" fill="#7C6576"/>
<circle cx="338.27" cy="277.38" r="33.06" fill="#F6F6F6"/>
<circle cx="338.27" cy="277.38" r="33.06" fill="#F6F6F6"/>
<circle cx="314.34" cy="301.31" r="16.53" fill="#7C6576"/>
<rect x="516.17" y="41.4" width="34.93" height="34.93" transform="translate(49.14 290.15) rotate(-31.81)" fill="#F6F6F6"/>
<circle cx="530.9" cy="74.95" r="16.08" fill="none" stroke="#383E45" stroke-miterlimit="10" stroke-width="4"/>
<line x1="327.96" y1="281.87" x2="384.04" y2="338.82" fill="none" stroke="#383E45" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 13 KiB