[IMP] website: add a way for css to detect if flex can be used
Website content is not supposed to use flex as it is not supported by some old browsers. This commit provides a way to use flex only for browsers which support it. When designing a snippet, you can use flex to design elements and then write other style for when flex is not supported. Using flex should however still be avoided when possible. But hopefully, this commit will allow to build greater snippets whose ugly non-flex style can be disabled on demand or dropped in a future odoo version.
This commit is contained in:
@@ -23,6 +23,12 @@ odoo.define('website.website', function (require) {
|
||||
if (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase())) browser += ",mobile";
|
||||
document.documentElement.setAttribute('data-browser', browser);
|
||||
|
||||
/* --- Add no-flex attr into the dom if flex is not supported for css selectors --- */
|
||||
var htmlStyle = document.documentElement.style;
|
||||
var isFlexSupported = (('flexWrap' in htmlStyle) || ('WebkitFlexWrap' in htmlStyle) || ('msFlexWrap' in htmlStyle));
|
||||
if (!isFlexSupported) {
|
||||
document.documentElement.setAttribute('data-no-flex', '');
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------
|
||||
Helpers
|
||||
|
||||
Reference in New Issue
Block a user