diff options
| author | Younn Olivier <yol@odoo.com> | 2021-02-05 15:38:23 +0000 |
|---|---|---|
| committer | qsm-odoo <qsm@odoo.com> | 2021-04-06 09:52:17 +0000 |
| commit | a99ed0f4a261fba44b31e3fe7a5840d81727b6d0 (patch) | |
| tree | 94cb0053938e29ebe65ea51dba9528c7a4916b4d /addons/web_editor/static/src | |
| parent | 2824930893aff81c7b60424a001354c99b957ff2 (diff) | |
[FIX] web_editor: make dropdown menus scrollable
The user was not able to select some options of the color and style
pickers on the website editor.
The menus were displayed either at the top, behind the top actions bar,
or overflowing the bottom of the page on some small screens.
The solution was to display the widget dropdown menus below the
options (remove the transform that was displaying them at the top), and
make the container scrollable with overflow-y and a flex display.
Part of https://github.com/odoo/odoo/pull/65575
task-2446852
Diffstat (limited to 'addons/web_editor/static/src')
| -rw-r--r-- | addons/web_editor/static/src/scss/wysiwyg.scss | 2 | ||||
| -rw-r--r-- | addons/web_editor/static/src/scss/wysiwyg_snippets.scss | 9 |
2 files changed, 7 insertions, 4 deletions
diff --git a/addons/web_editor/static/src/scss/wysiwyg.scss b/addons/web_editor/static/src/scss/wysiwyg.scss index 623420927dc..7ffce40308a 100644 --- a/addons/web_editor/static/src/scss/wysiwyg.scss +++ b/addons/web_editor/static/src/scss/wysiwyg.scss @@ -125,8 +125,10 @@ $o-we-zindex: $o-we-overlay-zindex + 1 !default; outline: none !important; } .dropdown-menu { + transform: none !important; margin-top: $o-we-dropdown-spacing; padding: 0; + margin-top: $o-we-toolbar-height; border: $o-we-dropdown-border-width solid $o-we-dropdown-border-color; background-color: $o-we-dropdown-bg; box-shadow: $o-we-dropdown-shadow; diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss index 3e4eb922d3a..f4d51c4095f 100644 --- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss +++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss @@ -46,8 +46,12 @@ body.editor_enable.editor_has_snippets { $-text-tools-header-height: 35px; padding: $-text-tools-header-height $o-we-sidebar-content-padding-base 0 $o-we-sidebar-content-indent; + margin-bottom: $o-we-sidebar-content-padding-base; box-shadow: $o-we-item-standup-top rgba($o-we-item-standup-color-light, .2); z-index: $o-we-zindex; + display: flex; + flex: 1; + overflow-y: auto; .popover { position: static !important; @@ -132,10 +136,7 @@ body.editor_enable.editor_has_snippets { position: static; } .dropdown-menu { // Drop up - top: auto; - bottom: 100%; - margin-top: 0; - margin-bottom: $dropdown-spacer; + margin-top: $o-we-dropdown-spacing; } } .note-popover ~ .note-popover, |