Skip to content
Permalink
Browse files

[FIX] account, portal, sale: odd sidebar on IE11

Open a quotation from the portal using IE11. The sidebar is rendered as
it did not have any width.

What we are trying to achieve on large screens is to create a sidebar
with a fix width the size of its children and to let the rest of the
content (right to the sidebar) expands. On small screens we want to
invert the direction from left-to-right to up-to-bottom.

The classes `col-12`, `col-lg` and `flex-lg-grow-0` are used to fulfill
that purpose.

The problem is due to the rule `flex-grow: 0 !important` applied by the
selector `.flex-lg-grow-0` on the sidebar. On Chrome/Firefox the dom
element takes the width of his children as minimal width, the
`flex-grow: 0` does not shrink the element below that minimal width.
IE11 does not set a minimal width based on the child elements of the
node, the width is equal to 0 and the `flex-grow: 0` forbid it from
growing.

The solution is to replace the said classes by the `col-lg-auto` class
that does exactly what we want and is cross-browser.

opw-1944188
opw-1935087
  • Loading branch information...
Julien00859 authored and nim-odoo committed Apr 8, 2019
1 parent 77a2411 commit d37948b4a64c0f7bd16ed8d53adf7ada69c41160
@@ -83,7 +83,7 @@
<div class="row mt16 o_portal_invoice_sidebar">
<!-- Sidebar -->
<t t-call="portal.portal_record_sidebar">
<t t-set="classes" t-value="'col-12 col-lg flex-lg-grow-0 d-print-none'"/>
<t t-set="classes" t-value="'col-lg-auto d-print-none'"/>
<t t-set="title">
<h2 class="mb-0">
<b t-if="invoice.residual > 0" t-field="invoice.residual"/>
@@ -174,7 +174,7 @@
</template>

<template id="portal_record_sidebar" name="My Portal Record Sidebar">
<div t-attf-class="col-12 col-lg flex-lg-grow-0 #{classes}">
<div t-attf-class="#{classes}">
<div class="card bg-white mb-4" id="sidebar_content">
<div t-if="title" class="card-body text-center pb-2 pt-3">
<t t-raw="title"/>
@@ -124,7 +124,7 @@
<div class="row mt16 o_portal_sale_sidebar">
<!-- Sidebar -->
<t t-call="portal.portal_record_sidebar">
<t t-set="classes" t-value="'col-12 col-lg flex-lg-grow-0 d-print-none'"/>
<t t-set="classes" t-value="'col-lg-auto d-print-none'"/>

<t t-set="title">
<h2 class="mb-0"><b t-field="sale_order.amount_total"/> </h2>

0 comments on commit d37948b

Please sign in to comment.
You can’t perform that action at this time.