[IMP] website, web_editor: redesign the drop zone
This commit adapts the drop zone to maintain consistency with the style of web editor. task-3368793 Part-of: odoo/odoo#132653
This commit is contained in:
@@ -2050,19 +2050,22 @@ we-select.o_we_border_preview_aligned_select {
|
||||
// DROPZONES
|
||||
@keyframes dropZoneInsert {
|
||||
to {
|
||||
background-color: rgba($o-brand-odoo, 0.3);
|
||||
box-shadow: inset 0 0 $o-we-dropzone-size 0 rgba($o-we-handles-accent-color, .5);
|
||||
}
|
||||
}
|
||||
|
||||
.oe_drop_zone {
|
||||
background-color: rgba($o-brand-odoo, 0.15);
|
||||
background: rgba(lighten($o-we-handles-accent-color, 50%), .95);
|
||||
animation: dropZoneInsert 1s linear 0s infinite alternate;
|
||||
|
||||
&.oe_insert {
|
||||
position: relative;
|
||||
z-index: $o-we-overlay-zindex;
|
||||
width: 100%;
|
||||
border: 2px dashed $o-we-border-color;
|
||||
border-radius: $border-radius-lg;
|
||||
outline: $o-we-dropzone-border-width dashed $o-we-handles-accent-color;
|
||||
outline-offset: -$o-we-dropzone-border-width;
|
||||
backdrop-filter: blur(2px);
|
||||
z-index: $o-we-overlay-zindex;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
$-editor-messages-margin-x: 2%;
|
||||
%o-editor-messages {
|
||||
border: 2px dashed #999999;
|
||||
background: rgba(lighten($o-we-handles-accent-color, 50%), .95);
|
||||
text-align: center;
|
||||
color: white;
|
||||
color: $o-we-handles-accent-color;
|
||||
outline: $o-we-dropzone-border-width dashed $o-we-handles-accent-color;
|
||||
outline-offset: -$o-we-dropzone-border-width;
|
||||
backdrop-filter: blur(2px);
|
||||
|
||||
&:before {
|
||||
content: attr(data-editor-message);
|
||||
@@ -87,7 +90,6 @@ $-editor-messages-margin-x: 2%;
|
||||
> .oe_drop_zone.oe_insert:not(.oe_vertical) {
|
||||
@extend %o-editor-messages;
|
||||
height: auto;
|
||||
text-shadow: -1px -1px 0 $o-brand-odoo, 1px -1px 0 $o-brand-odoo, -1px 1px 0 $o-brand-odoo, 1px 1px 0 $o-brand-odoo;
|
||||
|
||||
// Empty editable element during drag & drop
|
||||
&:only-child {
|
||||
@@ -111,13 +113,12 @@ $-editor-messages-margin-x: 2%;
|
||||
@extend %o-editor-messages;
|
||||
padding: 112px 0px;
|
||||
margin: 20px $-editor-messages-margin-x;
|
||||
color: #999999;
|
||||
border-radius: $border-radius-lg;
|
||||
}
|
||||
|
||||
// Exception 2: empty wrap during drag & drop (override of base case)
|
||||
&#wrap > .oe_drop_zone.oe_insert:not(.oe_vertical):only-child {
|
||||
padding: 112px 0px;
|
||||
color: #999999;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user