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

[REF] web_editor: transform border-like move handles into button handle

Browse Source 
Part of https://github.com/odoo/odoo/pull/36515
This commit is contained in:
qsm-odoo
2019-09-10 11:49:34 +00:00
parent 092409edc1
commit fb6b7013c9
2 changed files with 36 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/scss/wysiwyg_snippets.scss
+34 -29
View File
@@ -467,31 +467,8 @@ body.editor_enable.editor_has_snippets {
@include o-position-absolute(-$o-we-handles-offset-to-hide, 0, auto, 0);
border-color: inherit;
> .o_handle, > .o_move_handle {
position: relative;
&.w {
@include o-position-absolute($o-we-handles-offset-to-hide, auto, -$o-we-handles-offset-to-hide, 0);
width: $o-we-handle-edge-size;
}
&.e {
@include o-position-absolute($o-we-handles-offset-to-hide, 0, -$o-we-handles-offset-to-hide, auto);
width: $o-we-handle-edge-size;
}
&.n {
@include o-position-absolute($o-we-handles-offset-to-hide, 0, auto, 0);
height: $o-we-handle-edge-size;
}
&.s {
@include o-position-absolute(auto, 0, -$o-we-handles-offset-to-hide, 0);
height: $o-we-handle-edge-size;
}
}
> .o_handle {
position: relative;
border: 0 dashed transparent;
border-color: inherit;
transition: background 300ms ease 0s;
@@ -507,6 +484,8 @@ body.editor_enable.editor_has_snippets {
}
&.w {
@include o-position-absolute($o-we-handles-offset-to-hide, auto, -$o-we-handles-offset-to-hide, 0);
width: $o-we-handle-edge-size;
border-width: $o-we-handle-border-width-preview;
border-right-width: 0;
cursor: e-resize;
@@ -523,6 +502,8 @@ body.editor_enable.editor_has_snippets {
}
}
&.e {
@include o-position-absolute($o-we-handles-offset-to-hide, 0, -$o-we-handles-offset-to-hide, auto);
width: $o-we-handle-edge-size;
border-right-width: $o-we-handle-border-width-preview;
cursor: w-resize;
@@ -536,6 +517,8 @@ body.editor_enable.editor_has_snippets {
}
}
&.n {
@include o-position-absolute($o-we-handles-offset-to-hide, 0, auto, 0);
height: $o-we-handle-edge-size;
border-top-width: $o-we-handle-border-width-preview;
cursor: ns-resize;
@@ -549,6 +532,8 @@ body.editor_enable.editor_has_snippets {
}
}
&.s {
@include o-position-absolute(auto, 0, -$o-we-handles-offset-to-hide, 0);
height: $o-we-handle-edge-size;
border-bottom-width: $o-we-handle-border-width-preview;
cursor: ns-resize;
@@ -574,11 +559,6 @@ body.editor_enable.editor_has_snippets {
}
}
}
> .o_move_handle {
cursor: pointer;
cursor: move;
}
}
&.o_we_sticky {
@@ -668,6 +648,31 @@ body.editor_enable.editor_has_snippets {
border-bottom-width: $o-we-handle-border-width;
}
}
> .o_move_handle {
@include o-position-absolute($o-we-handles-offset-to-hide, $left: 50%);
transform: translate(-50%, -110%);
padding: 2px 4px;
border: 1px solid $o-we-color-text-normal;
border-radius: 20%;
color: $o-we-color-text-normal;
opacity: 0.5;
transition: opacity 400ms ease 0;
cursor: pointer;
cursor: move;
&::before, &::after {
content: '\f141';
display: block;
font-family: FontAwesome;
font-size: 0.8em;
line-height: 0.35em;
}
&:hover {
opacity: 1;
}
}
}
}
}
addons/web_editor/static/src/xml/snippets.xml
+2 -5
View File
@@ -9,11 +9,8 @@
<div class="o_handle w readonly"/>
<div class="o_handle s readonly"/>
<!-- Invisible overlay borders which allow to drag and drop -->
<div class="o_move_handle n"/>
<div class="o_move_handle e"/>
<div class="o_move_handle w"/>
<div class="o_move_handle s"/>
<!-- Overlay button-like handle to drag and drop -->
<div class="o_move_handle"/>
</div>
</div>
</t>