[FIX] note,web(_editor): fix html field style
Commit [1] added a div around the `.note-editable` node of the html editor. This broke some css rules. For instance, the html field in form view's notebooks should have a transparent bottom border when focused, this was no longer the case (e.g. crm lead form view). Moreover, we sometimes want to control the height of the editor (e.g. in Notes or in the mail full composer). That was broken as well due to the added div. This commit fixes those issues. We also ensure to set the border-radius to 0 when the editor only has a bottom border. In notes, we do not want to have borders, but the rule didn't apply due to selector precedence, we fix that as well. Finally, we fix a typo in a selector in the web_editor addon. [1] https://github.com/odoo/odoo/commit/60ac6be0d3545# closes odoo/odoo#107740 Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
This commit is contained in:
@@ -28,7 +28,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.note-editable {
|
||||
.o_field_html .note-editable {
|
||||
border: none;
|
||||
padding: $o-sheet-vpadding $o-horizontal-padding 10px !important;
|
||||
min-height: 300px;
|
||||
|
||||
@@ -524,7 +524,7 @@
|
||||
> .tab-pane {
|
||||
padding: $o-horizontal-padding 0;
|
||||
|
||||
> .o_field_html > .note-editable {
|
||||
> .o_field_html .note-editable {
|
||||
min-height: 180px;
|
||||
&:hover, &:focus {
|
||||
border-color: transparent;
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<div t-ref="readonlyElement" class="o_readonly" t-out="markupValue" />
|
||||
</t>
|
||||
</t>
|
||||
<div t-else="" t-ref="spellcheck">
|
||||
<div t-else="" class="h-100" t-ref="spellcheck">
|
||||
<t t-if="state.showCodeView">
|
||||
<textarea t-ref="codeView" class="o_codeview" t-att-value="markupValue"/>
|
||||
<div t-ref="codeViewButton" id="codeview-btn-group" class="btn-group" t-on-click="toggleCodeView">
|
||||
|
||||
@@ -39,10 +39,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
.o_form_view:not(o_field_highlight) {
|
||||
.o_form_view:not(.o_field_highlight) {
|
||||
.o_field_html .note-editable {
|
||||
border: $input-border-width solid transparent;
|
||||
border-width: 0 0 $input-border-width 0;
|
||||
border-radius: 0;
|
||||
|
||||
&:hover, &:focus {
|
||||
border-color: var(--o-input-border-color);
|
||||
|
||||
@@ -569,7 +569,7 @@ img::selection {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.oe-bordered-editor>.note-editable {
|
||||
.oe-bordered-editor .note-editable {
|
||||
border-width: 1px;
|
||||
padding: 4px;
|
||||
min-height: 180px;
|
||||
|
||||
Reference in New Issue
Block a user