wbrawner/server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix drag shadow not visible when dragging a file on a narrow screen

Browse source 
When a file from the file list is dragged a drag shadow (a copy of the
file row that follows the cursor position) is created. The drag shadow
element is created as a direct child of the body element, so it needs a
higher "z-index" than the one used for the file list to be visible.

In narrow screens the "#app-content" uses a "z-index" of 1000 in order
to be visible over the "#navigation-bar" when they overlap, so the
"z-index" of the drag shadow must be at least 1000 to be visible over
the file list.

Instead of updating the hardcoded "z-index" it was removed and replaced
by CSS rules for ".dragshadow" elements to ease theming.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
This commit is contained in:
Daniel Calviño Sánchez 2017-12-14 04:05:49 +01:00
parent 2943b54f98
commit 39c549fa27
3 changed files with 6 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
apps/files/css/files.scss
View file

@ -649,6 +649,7 @@ table tr.summary td {
table.dragshadow {
width:auto;
z-index: 100;
}
table.dragshadow td.filename {
padding-left:60px;

5
apps/files/css/mobile.scss
View file

@ -69,4 +69,9 @@ table td.filename .nametext .innernametext {
display: block !important;
}
/* ensure that it is visible over #app-content */
table.dragshadow {
z-index: 1000;
}
}

1
apps/files/js/files.js
View file

@ -383,7 +383,6 @@ var dragOptions={
revert: 'invalid',
revertDuration: 300,
opacity: 0.7,
zIndex: 100,
appendTo: 'body',
cursorAt: { left: 24, top: 18 },
helper: createDragShadow,