[IMP] web_editor, *: move the left panel to the right
*: website, mass_mailing See parent commit for information about the scrollbar moved to the '#wrapwrap' element, which was necessary to achieve this right panel design. Note: in the future, having the scroll on the #wrapwrap may not be necessary anymore as the edition might be done in an iframe. Part of https://github.com/odoo/odoo/pull/57975 task-2344227 X-original-commit: 2abe8517063b2696cc89e9a453dcc3921fb3b8c7
This commit is contained in:
@@ -175,10 +175,10 @@ body.o_force_mail_theme_choice {
|
||||
}
|
||||
|
||||
body.editor_enable.o_basic_theme.o_in_iframe {
|
||||
padding-left: 0px !important;
|
||||
padding-right: 0px !important;
|
||||
|
||||
#web_editor-top-edit .note-popover .popover {
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
|
||||
#oe_snippets {
|
||||
@@ -201,7 +201,7 @@ body.editor_enable.o_basic_theme.o_in_iframe {
|
||||
width: 100%;
|
||||
@media (max-width: map-get($grid-breakpoints, 'lg')) {
|
||||
width: auto;
|
||||
margin-left: $o-we-sidebar-width;
|
||||
margin-right: $o-we-sidebar-width;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1893,7 +1893,7 @@ var SnippetsMenu = Widget.extend({
|
||||
stop: async function (ev, ui) {
|
||||
$toInsert.removeClass('oe_snippet_body');
|
||||
|
||||
if (!dropped && ui.position.top > 3 && ui.position.left > self.el.getBoundingClientRect().right) {
|
||||
if (!dropped && ui.position.top > 3 && ui.position.left + ui.helper.outerHeight() < self.el.getBoundingClientRect().left) {
|
||||
var $el = $.nearest({x: ui.position.left, y: ui.position.top}, '.oe_drop_zone', {container: document.body}).first();
|
||||
if ($el.length) {
|
||||
scrollValue = $el.offset().top;
|
||||
|
||||
@@ -429,7 +429,7 @@ img::selection {
|
||||
top: 40px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: $o-we-sidebar-width;
|
||||
right: $o-we-sidebar-width;
|
||||
width: auto;
|
||||
height: auto;
|
||||
|
||||
|
||||
@@ -4,10 +4,10 @@
|
||||
|
||||
// OVERRIDES FOR EDITOR WITH SNIPPETS
|
||||
body.editor_enable.editor_has_snippets {
|
||||
padding-left: $o-we-sidebar-width !important;
|
||||
padding-right: $o-we-sidebar-width !important;
|
||||
|
||||
#web_editor-top-edit .note-popover .popover {
|
||||
left: $o-we-sidebar-width !important;
|
||||
right: $o-we-sidebar-width !important;
|
||||
}
|
||||
|
||||
.modal:not(.o_technical_modal) {
|
||||
@@ -33,7 +33,7 @@ body.editor_enable.editor_has_snippets {
|
||||
// Mobile fix for mass mailing
|
||||
@include media-breakpoint-down(md) {
|
||||
body.editor_enable.editor_has_snippets {
|
||||
padding-left: inherit !important;
|
||||
padding-right: inherit !important;
|
||||
|
||||
#web_editor-top-edit {
|
||||
position: initial !important;
|
||||
@@ -42,7 +42,7 @@ body.editor_enable.editor_has_snippets {
|
||||
left: initial !important;
|
||||
|
||||
.note-popover .popover {
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -198,14 +198,14 @@ body.editor_enable.editor_has_snippets {
|
||||
#oe_snippets {
|
||||
@include o-w-preserve-btn;
|
||||
|
||||
@include o-position-absolute(var(--o-we-toolbar-height), auto, 0, 0);
|
||||
@include o-position-absolute(var(--o-we-toolbar-height), 0, 0, auto);
|
||||
position: fixed;
|
||||
z-index: $o-we-zindex;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
width: $o-we-sidebar-width;
|
||||
|
||||
border-right: $o-we-sidebar-border-width solid $o-we-sidebar-border-color;
|
||||
border-left: $o-we-sidebar-border-width solid $o-we-sidebar-border-color;
|
||||
background-color: $o-we-sidebar-bg;
|
||||
color: $o-we-sidebar-color;
|
||||
font-family: $o-we-font-family;
|
||||
@@ -213,7 +213,7 @@ body.editor_enable.editor_has_snippets {
|
||||
font-weight: 400;
|
||||
|
||||
transition: transform 400ms ease 0s;
|
||||
transform: translateX(-100%);
|
||||
transform: translateY(-100%);
|
||||
|
||||
&.o_loaded {
|
||||
transform: none;
|
||||
@@ -1742,5 +1742,5 @@ we-select.o_we_shape_menu {
|
||||
// be over the content being reloaded (with a covering similar to the editor
|
||||
// overlay covering).
|
||||
position: fixed;
|
||||
left: $o-we-sidebar-width;
|
||||
right: $o-we-sidebar-width;
|
||||
}
|
||||
|
||||
@@ -167,7 +167,7 @@ body.editor_enable.editor_has_snippets {
|
||||
|
||||
.editor_has_snippets {
|
||||
.o_header_affixed {
|
||||
left: $o-we-sidebar-width !important;
|
||||
right: $o-we-sidebar-width !important;
|
||||
top: var(--o-we-toolbar-height) !important;
|
||||
}
|
||||
}
|
||||
@@ -176,14 +176,14 @@ body.editor_enable.editor_has_snippets {
|
||||
@if o-website-value('header-template') == 'sidebar' {
|
||||
#wrapwrap > header {
|
||||
@if o-website-value('hamburger-position') != 'right' {
|
||||
left: $o-we-sidebar-width;
|
||||
right: $o-we-sidebar-width;
|
||||
}
|
||||
}
|
||||
}
|
||||
@if o-website-value('hamburger-type') == 'off-canvas' {
|
||||
#top_menu_collapse {
|
||||
&.collapsing, &.show {
|
||||
left: $o-we-sidebar-width;
|
||||
right: $o-we-sidebar-width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -21,9 +21,10 @@
|
||||
|
||||
// EDITOR TOP BAR AND POPOVER
|
||||
#web_editor-top-edit .o_we_website_top_actions {
|
||||
@include o-position-absolute($top: 0, $left: 0);
|
||||
@include o-position-absolute($top: 0, $right: 0);
|
||||
z-index: $zindex-popover + 5;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: $o-we-sidebar-width;
|
||||
height: $o-we-sidebar-top-height;
|
||||
background-color: $o-we-sidebar-tabs-bg;
|
||||
|
||||
Reference in New Issue
Block a user