pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] web: fix field selector popover style

Browse Source 
Before this commit, the popover was incorrectly
positionned because of the style of the legacy widget.
The legacy widget added some rules to add margin and an arrow
that the new component does not need.

closes odoo/odoo#101097

X-original-commit: bd4862774264c5169aa2dcf4cd80908c2f4c71bb
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
This commit is contained in:
Michael (mcm)
2022-09-26 12:39:54 +02:00
committed by Aaron Bohy
parent 2c26a810c8
commit a87ac2ac36
3 changed files with 54 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web/static/src/core/model_field_selector/model_field_selector.scss
+42
View File
@@ -0,0 +1,42 @@
.o_field_selector:not(.o_legacy_field_selector) {
position: relative;
> .o_field_selector_value {
display: flex;
flex-flow: row wrap;
align-items: center;
height: 100%;
min-height: 20px; // needed when there is no value in it and used standalone
&:active, &:focus, &:active:focus {
outline: none;
}
> .o_field_selector_chain_part {
padding: 0px 1px;
border: 1px solid darken($o-brand-lightsecondary, 10%);
background: $o-brand-lightsecondary;
margin-bottom: 1px;
}
> i {
align-self: center;
margin: 0 2px;
font-size: 10px;
}
}
> .o_field_selector_controls {
@include o-position-absolute(0, 0, 1px);
display: flex;
align-items: center;
cursor: pointer;
}
&.o_edit_mode {
> .o_field_selector_controls::after {
@include o-caret-down;
}
> .o_field_selector_popover {
@include o-position-absolute($top: 100%, $left: 0);
}
}
}
addons/web/static/src/core/model_field_selector/model_field_selector_popover.scss
+10 -1
View File
@@ -1,7 +1,11 @@
.o_popover_field_selector .popover-arrow::after {
border-bottom-color: map-get($theme-colors, 'primary');
}
.o_field_selector_popover {
.o_field_selector_popover:not(.o_legacy_field_selector_popover) {
width: 265px;
background: white;
--o-input-background-color: white;
&:focus {
outline: none;
@@ -22,7 +26,10 @@
.o_field_selector_search {
padding-right: 0.4rem;
> .o_input {
font-size: 13px;
padding: 5px 0.4rem;
text-align: left;
line-height: normal;
}
}
.o_field_selector_popover_option {
@@ -77,7 +84,9 @@
padding: 5px 0.4em;
> input {
font-size: 13px;
width: 100%;
padding: 0 0.4rem;
}
}
}
addons/web/static/src/legacy/xml/base.xml
+2 -2
View File
@@ -909,13 +909,13 @@
</t>
</div>
</div>
<div aria-atomic="true" t-name="ModelFieldSelector" t-attf-class="o_field_selector#{!widget.options.readonly ? ' o_edit_mode o_input' : ''}">
<div aria-atomic="true" t-name="ModelFieldSelector" t-attf-class="o_field_selector o_legacy_field_selector#{!widget.options.readonly ? ' o_edit_mode o_input' : ''}">
<div class="o_field_selector_value" tabindex="0"/>
<div class="o_field_selector_controls" tabindex="0">
<i role="alert" class="fa fa-exclamation-triangle o_field_selector_warning d-none" title="Invalid field chain" aria-label="Invalid field chain"/>
</div>
</div>
<div t-name="ModelFieldSelector.popover" class="o_field_selector_popover d-none" tabindex="0">
<div t-name="ModelFieldSelector.popover" class="o_field_selector_popover o_legacy_field_selector_popover d-none" tabindex="0">
<div class="o_field_selector_popover_header text-center">
<i class="fa fa-arrow-left o_field_selector_popover_option o_field_selector_prev_page" title="Previous" role="img" aria-label="Previous"/>
<div class="o_field_selector_title"/>