[FIX] web: show the form status indicator with long breadcrumb
Since commit, odoo/odoo@f2b71d51aa the text ellipsis is working again with long breadcrumb. But in form view when there is a long breadcrumb, the 'form status indicator' (save, discard) is not visible anymore. In this commit, we move the 'form status indicator' outside the breadcrumb, so it can't be hidden anymore. Note: we also changed the `align-items` to `flex-start` to keep all buttons aligned on the top ('form status indicator', action menu, pager, create button, send message, ...). Steps to reproduce: * Go to Sales * Select a Quotation * Click on the customer (to go to customer form view) * Change its name to have a long breadcrumb * Go back to the home menu * Go to Sales * Select the same Quotation as before * Click on the customer (to go to customer form view) * Change some data in the customer form => BUG 'form status indicator' isn't visible closes odoo/odoo#104476 X-original-commit: df41c270b2372cd28226a16e089b71db32307159 Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com> Signed-off-by: Romeo Fragomeli (rfr) <rfr@odoo.com>
This commit is contained in:
@@ -5,10 +5,10 @@
|
||||
<nav class="o_pager align-items-center d-flex gap-2" aria-label="Pager">
|
||||
<span class="o_pager_counter" t-on-click.stop="">
|
||||
<t t-if="state.isEditing">
|
||||
<input type="text" class="o_pager_value o_input d-inline-block w-auto text-end" size="7" t-ref="autofocus" t-att-value="value" t-on-blur="onInputBlur" t-on-change="onInputChange" t-on-keydown.stop="onInputKeydown" />
|
||||
<input type="text" class="o_pager_value o_input d-inline-block w-auto text-end mb-n1" size="7" t-ref="autofocus" t-att-value="value" t-on-blur="onInputBlur" t-on-change="onInputChange" t-on-keydown.stop="onInputKeydown" />
|
||||
</t>
|
||||
<t t-else="">
|
||||
<span class="o_pager_value d-inline-block border-bottom border-transparent" t-esc="value" t-on-click="onValueClick" />
|
||||
<span class="o_pager_value d-inline-block border-bottom border-transparent mb-n1" t-esc="value" t-on-click="onValueClick" />
|
||||
</t>
|
||||
<span> / </span>
|
||||
<t t-if="props.updateTotal">
|
||||
|
||||
@@ -89,6 +89,7 @@
|
||||
@include media-breakpoint-down(md) {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
> li {
|
||||
margin: 0;
|
||||
@@ -98,6 +99,7 @@
|
||||
}
|
||||
|
||||
&.o_back_button {
|
||||
flex-shrink: 0;
|
||||
&, & ~ li {
|
||||
margin: auto 0;
|
||||
}
|
||||
@@ -191,11 +193,13 @@
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
align-items: flex-start;
|
||||
column-gap: $o-horizontal-padding;
|
||||
@include media-breakpoint-down(md) {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
> .o_cp_pager {
|
||||
margin: auto 0 auto auto;
|
||||
padding-left: 5px;
|
||||
text-align: center;
|
||||
user-select: none;
|
||||
|
||||
@@ -14,10 +14,10 @@
|
||||
<t t-call="web.Breadcrumbs" t-if="!env.config.noBreadcrumbs"/>
|
||||
</t>
|
||||
</t>
|
||||
<t t-slot="control-panel-status-indicator" />
|
||||
</t>
|
||||
</div>
|
||||
<div class="o_cp_bottom_right w-auto flex-shrink-0">
|
||||
<t t-slot="control-panel-status-indicator" />
|
||||
<t t-slot="control-panel-action-menu" t-if="display['bottom-left']"/>
|
||||
<div t-if="pagerProps and pagerProps.total > 0" class="o_cp_pager" role="search">
|
||||
<Pager t-props="pagerProps"/>
|
||||
|
||||
@@ -2,11 +2,11 @@
|
||||
<templates xml:space="preserve">
|
||||
|
||||
<t t-name="web.FormStatusIndicator" owl="1">
|
||||
<div class="o_form_status_indicator ms-2 d-flex align-items-center" t-att-class="{ o_form_status_indicator_new_record: props.model.root.isVirtual }">
|
||||
<div class="o_form_status_indicator" t-att-class="{ o_form_status_indicator_new_record: props.model.root.isVirtual }">
|
||||
<div class="o_form_status_indicator_buttons d-flex" t-att-class="{ invisible: !(props.model.root.isVirtual or displayButtons) }">
|
||||
<button
|
||||
type="button"
|
||||
class="o_form_button_save btn btn-light btn-sm"
|
||||
class="o_form_button_save btn btn-light"
|
||||
t-att-disabled="props.isDisabled"
|
||||
data-hotkey="s"
|
||||
t-on-click.stop="save"
|
||||
@@ -16,7 +16,7 @@
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="o_form_button_cancel btn btn-light btn-sm"
|
||||
class="o_form_button_cancel btn btn-light"
|
||||
t-att-disabled="props.isDisabled"
|
||||
data-hotkey="j"
|
||||
t-on-click.stop="discard"
|
||||
|
||||
Reference in New Issue
Block a user