Merge pull request #2070 from overleaf/pr-fix-light-drag-and-drop

Change hover highlights and draggable helper when moving files

GitOrigin-RevId: b7a6e9cd1484115fa5fbf1ed40127a6aba525cbd
This commit is contained in:
Eric Mc Sween
2019-08-20 12:59:30 +00:00
committed by sharelatex
parent c5da705fa0
commit 4d69b63993
4 changed files with 27 additions and 12 deletions
@@ -15,7 +15,7 @@ define(['base'], App =>
if (draggable) {
return element.draggable({
delay: 250,
opacity: 0.7,
opacity: 0.95,
scroll: true,
helper: scope.$eval(attrs.draggableHelper)
})
@@ -59,6 +59,24 @@
}
}
li .entity-name.droppable-hover when (@is-overleaf = true) {
font-weight: bold;
background-color: @file-tree-item-hover-bg;
.fake-full-width-bg(@file-tree-item-hover-bg);
}
li .entity-name.droppable-hover when (@is-overleaf-light = true) {
// color: @file-tree-item-selected-color;
}
ul.droppable-hover li div.entity-name:hover when (@is-overleaf = true) {
background-color: transparent;
.fake-full-width-bg(transparent);
&.droppable-hover {
background-color: @file-tree-item-hover-bg;
.fake-full-width-bg(@file-tree-item-hover-bg);
}
}
ul.file-tree-list {
margin: 0;
overflow-x: hidden;
@@ -98,12 +116,6 @@
&.droppable-hover when (@is-overleaf = false) {
background-color: fade(@file-tree-droppable-bg-color, 60%);
}
&.droppable-hover when (@is-overleaf = true) {
background-color: @file-tree-droppable-bg-color;
.fake-full-width-bg(@file-tree-droppable-bg-color);
}
}
i.fa {
@@ -234,9 +246,12 @@
ul.droppable-hover.file-tree-list when (@is-overleaf = false) {
background-color: fade(@file-tree-droppable-bg-color, 60%);
}
ul.droppable-hover.file-tree-list when (@is-overleaf = true) {
background-color: @file-tree-droppable-bg-color;
.fake-full-width-bg(@file-tree-droppable-bg-color);
.ui-draggable-dragging when (@is-overleaf = true) {
background-color: fade(@file-tree-item-selected-bg, 60%);
color: @file-tree-item-selected-color;
width: 75%;
padding-left: @line-height-computed;
}
}
@@ -53,7 +53,7 @@
@file-tree-item-selected-bg : @ol-green;
@file-tree-multiselect-bg : @ol-blue;
@file-tree-multiselect-hover-bg : @ol-dark-blue;
@file-tree-droppable-bg-color : tint(@ol-green, 5%);
@file-tree-droppable-bg-color : @ol-blue-gray-2;
@content-alt-bg-color : @ol-blue-gray-0;
@@ -265,7 +265,7 @@
@file-tree-item-selected-bg : @ol-green;
@file-tree-multiselect-bg : @ol-blue;
@file-tree-multiselect-hover-bg : @ol-dark-blue;
@file-tree-droppable-bg-color : tint(@ol-green, 5%);
@file-tree-droppable-bg-color : @ol-blue-gray-2;
// Editor resizers
@editor-resizer-bg-color : @ol-blue-gray-5;