NextERP/design-themes
2
0
Fork 0
mirror of https://github.com/odoo/design-themes.git synced 2025-10-07 01:18:52 +07:00
Code Issues Packages Projects Releases Wiki Activity

[FIX] theme_*: fix svg previews readability on safari

Browse Source 
In Safari (14+) the CSS workaround to make block "readable" over any bg
is broken. By replacing the current CSS workaround by an appropriate
SVG filter in each themes svg, the problem will be fixed.
This commit will add the svg filter.

task-2667028

closes odoo/design-themes#522

Related: odoo/odoo#78617
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
xlu-odoo
2021-10-14 14:09:40 +00:00
committed by qsm-odoo
parent 208f6134a6
commit 545cf002ea
27 changed files with 1068 additions and 714 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme_avantgarde/static/description/theme_avantgarde.svg
+35 -21
View File
@@ -34,6 +34,20 @@
<pattern width="1" height="1" patternunits="objectBoundingBox" id="theme_avantgarde_s_text_image_default_image_id">
<image preserveAspectRatio="xMidYMid slice" width="193.0843" height="192.9226" href="#s_text_image_default_image_url"/>
</pattern>
<!-- Filter -->
<filter id="filter_readability_avantgarde">
<feColorMatrix in="SourceGraphic" type="saturate" values="0"/>
<feComponentTransfer>
<feFuncR type="table" tableValues="1 0"/>
<feFuncG type="table" tableValues="1 0"/>
<feFuncB type="table" tableValues="1 0"/>
</feComponentTransfer>
<feComponentTransfer>
<feFuncR type="linear" slope="10000" intercept="-4999.5"/>
<feFuncG type="linear" slope="10000" intercept="-4999.5"/>
<feFuncB type="linear" slope="10000" intercept="-4999.5"/>
</feComponentTransfer>
</filter>
</defs>
<g class="theme_avantgarde">
@@ -43,16 +57,16 @@
<!-- Menu Background -->
<rect width="700" height="37" fill="#MENU_COLOR" class="svgc_menu_bg"/>
<!-- Logo -->
<path class="svgc_text" opacity="1" d="M76.35,23V21.48H72.6V14.27H70.76V23Zm4.68.12a4.18,4.18,0,0,0,2.08-.53,3.82,3.82,0,0,0,1.46-1.52,5.07,5.07,0,0,0,.54-2.43,5.07,5.07,0,0,0-.54-2.43,3.78,3.78,0,0,0-1.46-1.53A4.19,4.19,0,0,0,81,14.15a4.12,4.12,0,0,0-2.08.53,3.66,3.66,0,0,0-1.46,1.53,5.07,5.07,0,0,0-.54,2.43,5,5,0,0,0,.54,2.42,3.71,3.71,0,0,0,1.46,1.53,4.12,4.12,0,0,0,2.08.53Zm0-1.63a2.09,2.09,0,0,1-1.17-.33,2.15,2.15,0,0,1-.78-1,4,4,0,0,1-.27-1.56,4,4,0,0,1,.27-1.56,2.12,2.12,0,0,1,.78-1A2.05,2.05,0,0,1,81,15.79a2.14,2.14,0,0,1,1.17.32,2.19,2.19,0,0,1,.78,1,4,4,0,0,1,.27,1.56A4,4,0,0,1,83,20.2a2.15,2.15,0,0,1-.78,1,2.09,2.09,0,0,1-1.17.33Zm9.27,1.63a4.07,4.07,0,0,0,2-.45,3.16,3.16,0,0,0,1.34-1.27,3.74,3.74,0,0,0,.49-2v-1.1H90.43v1.39H92.3v.13a1.88,1.88,0,0,1-.15.64l-.08.14a1.59,1.59,0,0,1-.68.63,2.32,2.32,0,0,1-1.07.23,2.09,2.09,0,0,1-1.2-.34,2.12,2.12,0,0,1-.78-1,4.43,4.43,0,0,1,0-3.1,2.16,2.16,0,0,1,.79-1,2,2,0,0,1,1.17-.33,2.29,2.29,0,0,1,.66.09,1.85,1.85,0,0,1,.53.25,1.9,1.9,0,0,1,.39.41,2,2,0,0,1,.25.55H94a3.32,3.32,0,0,0-.41-1.18,3.15,3.15,0,0,0-.81-.93,3.54,3.54,0,0,0-1.13-.61,4.39,4.39,0,0,0-1.39-.22,4.18,4.18,0,0,0-1.6.31,3.74,3.74,0,0,0-1.3.88,3.88,3.88,0,0,0-.87,1.41,5.37,5.37,0,0,0-.31,1.9A5.07,5.07,0,0,0,86.7,21a3.73,3.73,0,0,0,1.45,1.55,4.19,4.19,0,0,0,2.15.54Zm9,0a4.15,4.15,0,0,0,2.08-.53,3.78,3.78,0,0,0,1.47-1.52,5.07,5.07,0,0,0,.54-2.43,5.07,5.07,0,0,0-.54-2.43,3.74,3.74,0,0,0-1.47-1.53,4.37,4.37,0,0,0-4.17,0,3.78,3.78,0,0,0-1.46,1.53,5.07,5.07,0,0,0-.54,2.43,5,5,0,0,0,.54,2.42,3.78,3.78,0,0,0,1.46,1.53A4.16,4.16,0,0,0,99.26,23.12Zm0-1.63a2.06,2.06,0,0,1-1.17-.33,2.13,2.13,0,0,1-.77-1A4,4,0,0,1,97,18.64a4,4,0,0,1,.28-1.56,2,2,0,0,1,1.94-1.29,2.14,2.14,0,0,1,1.17.32,2.1,2.1,0,0,1,.77,1,4,4,0,0,1,.28,1.56,4,4,0,0,1-.28,1.56,2,2,0,0,1-1.94,1.29Z" fill="#MENU_COLOR"/>
<path class="svgc_text" opacity="1" d="M76.35,23V21.48H72.6V14.27H70.76V23Zm4.68.12a4.18,4.18,0,0,0,2.08-.53,3.82,3.82,0,0,0,1.46-1.52,5.07,5.07,0,0,0,.54-2.43,5.07,5.07,0,0,0-.54-2.43,3.78,3.78,0,0,0-1.46-1.53A4.19,4.19,0,0,0,81,14.15a4.12,4.12,0,0,0-2.08.53,3.66,3.66,0,0,0-1.46,1.53,5.07,5.07,0,0,0-.54,2.43,5,5,0,0,0,.54,2.42,3.71,3.71,0,0,0,1.46,1.53,4.12,4.12,0,0,0,2.08.53Zm0-1.63a2.09,2.09,0,0,1-1.17-.33,2.15,2.15,0,0,1-.78-1,4,4,0,0,1-.27-1.56,4,4,0,0,1,.27-1.56,2.12,2.12,0,0,1,.78-1A2.05,2.05,0,0,1,81,15.79a2.14,2.14,0,0,1,1.17.32,2.19,2.19,0,0,1,.78,1,4,4,0,0,1,.27,1.56A4,4,0,0,1,83,20.2a2.15,2.15,0,0,1-.78,1,2.09,2.09,0,0,1-1.17.33Zm9.27,1.63a4.07,4.07,0,0,0,2-.45,3.16,3.16,0,0,0,1.34-1.27,3.74,3.74,0,0,0,.49-2v-1.1H90.43v1.39H92.3v.13a1.88,1.88,0,0,1-.15.64l-.08.14a1.59,1.59,0,0,1-.68.63,2.32,2.32,0,0,1-1.07.23,2.09,2.09,0,0,1-1.2-.34,2.12,2.12,0,0,1-.78-1,4.43,4.43,0,0,1,0-3.1,2.16,2.16,0,0,1,.79-1,2,2,0,0,1,1.17-.33,2.29,2.29,0,0,1,.66.09,1.85,1.85,0,0,1,.53.25,1.9,1.9,0,0,1,.39.41,2,2,0,0,1,.25.55H94a3.32,3.32,0,0,0-.41-1.18,3.15,3.15,0,0,0-.81-.93,3.54,3.54,0,0,0-1.13-.61,4.39,4.39,0,0,0-1.39-.22,4.18,4.18,0,0,0-1.6.31,3.74,3.74,0,0,0-1.3.88,3.88,3.88,0,0,0-.87,1.41,5.37,5.37,0,0,0-.31,1.9A5.07,5.07,0,0,0,86.7,21a3.73,3.73,0,0,0,1.45,1.55,4.19,4.19,0,0,0,2.15.54Zm9,0a4.15,4.15,0,0,0,2.08-.53,3.78,3.78,0,0,0,1.47-1.52,5.07,5.07,0,0,0,.54-2.43,5.07,5.07,0,0,0-.54-2.43,3.74,3.74,0,0,0-1.47-1.53,4.37,4.37,0,0,0-4.17,0,3.78,3.78,0,0,0-1.46,1.53,5.07,5.07,0,0,0-.54,2.43,5,5,0,0,0,.54,2.42,3.78,3.78,0,0,0,1.46,1.53A4.16,4.16,0,0,0,99.26,23.12Zm0-1.63a2.06,2.06,0,0,1-1.17-.33,2.13,2.13,0,0,1-.77-1A4,4,0,0,1,97,18.64a4,4,0,0,1,.28-1.56,2,2,0,0,1,1.94-1.29,2.14,2.14,0,0,1,1.17.32,2.1,2.1,0,0,1,.77,1,4,4,0,0,1,.28,1.56,4,4,0,0,1-.28,1.56,2,2,0,0,1-1.94,1.29Z" fill="#MENU_COLOR" filter="url(#filter_readability_avantgarde)"/>
<!-- Contents -->
<g opacity="0.574000000953674">
<rect x="538.91" y="13.75" width="15.52" height="1.36" fill="#MENU_COLOR" class="svgc_text"/>
<rect x="538.91" y="17.82" width="15.52" height="1.36" fill="#MENU_COLOR" class="svgc_text"/>
<rect x="538.91" y="21.89" width="15.52" height="1.36" fill="#MENU_COLOR" class="svgc_text"/>
<rect x="513.63" y="13.47" width="10.62" height="10.34" rx="5.17" fill="#MENU_COLOR" class="svgc_text"/>
<rect x="538.91" y="13.75" width="15.52" height="1.36" fill="#MENU_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="538.91" y="17.82" width="15.52" height="1.36" fill="#MENU_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="538.91" y="21.89" width="15.52" height="1.36" fill="#MENU_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="513.63" y="13.47" width="10.62" height="10.34" rx="5.17" fill="#MENU_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
</g>
<!-- Menu Button -->
<path class="svgc_text" opacity="1" d="M571.42,8.73h57.51a1.35,1.35,0,0,1,1.28,1.41V27a1.35,1.35,0,0,1-1.28,1.41H571.42A1.35,1.35,0,0,1,570.15,27V10.14A1.35,1.35,0,0,1,571.42,8.73Z" style="fill:none;stroke:#MENU_COLOR;stroke-miterlimit:10;stroke-width:2px;fill-rule:evenodd"/>
<path class="svgc_text" opacity="1" d="M571.42,8.73h57.51a1.35,1.35,0,0,1,1.28,1.41V27a1.35,1.35,0,0,1-1.28,1.41H571.42A1.35,1.35,0,0,1,570.15,27V10.14A1.35,1.35,0,0,1,571.42,8.73Z" style="fill:none;stroke:#MENU_COLOR;stroke-miterlimit:10;stroke-width:2px;fill-rule:evenodd" filter="url(#filter_readability_avantgarde)"/>
</g>
<!-- Cover -->
@@ -187,21 +201,21 @@
<rect class="svgc_footer_bg" y="1713" width="700" height="137" fill="#FOOTER_COLOR"/>
<!-- Contents -->
<g opacity="0.55">
<circle cx="561.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text"/>
<circle cx="581.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text"/>
<circle cx="601.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="337.12" y="1779.26" width="173.79" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="337.12" y="1784.26" width="153.89" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="337.12" y="1789.26" width="104.8" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="337.12" y="1794.26" width="120.72" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<circle cx="621.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="70.61" y="1779.26" width="205.45" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="70.61" y="1753.01" width="155.02" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="70.61" y="1784.26" width="181.92" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="70.61" y="1789.26" width="197.08" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="70.61" y="1794.26" width="123.76" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="553.85" y="1779.26" width="65.58" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<rect x="553.85" y="1784.26" width="75.54" height="2" fill="#FOOTER_COLOR" class="svgc_text"/>
<circle cx="561.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<circle cx="581.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<circle cx="601.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="337.12" y="1779.26" width="173.79" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="337.12" y="1784.26" width="153.89" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="337.12" y="1789.26" width="104.8" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="337.12" y="1794.26" width="120.72" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<circle cx="621.35" cy="1802.49" r="7.5" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="70.61" y="1779.26" width="205.45" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="70.61" y="1753.01" width="155.02" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="70.61" y="1784.26" width="181.92" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="70.61" y="1789.26" width="197.08" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="70.61" y="1794.26" width="123.76" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="553.85" y="1779.26" width="65.58" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
<rect x="553.85" y="1784.26" width="75.54" height="2" fill="#FOOTER_COLOR" class="svgc_text" filter="url(#filter_readability_avantgarde)"/>
</g>
</g>
</g>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 18 KiB