diff --git a/apps/files/css/files.css b/apps/files/css/files.css
index 86fb0dc604..50aa58b53d 100644
--- a/apps/files/css/files.css
+++ b/apps/files/css/files.css
@@ -147,14 +147,14 @@ a.action>img { max-height:16px; max-width:16px; vertical-align:text-bottom; }
display:none;
}
#fileList tr:hover a.action, #fileList a.action.permanent {
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=.5)";
- filter: alpha(opacity=.5);
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+ filter: alpha(opacity=50);
opacity: .5;
display:inline;
}
#fileList tr:hover a.action:hover {
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
- filter: alpha(opacity=1);
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+ filter: alpha(opacity=100);
opacity: 1;
display:inline;
}
diff --git a/apps/files/js/fileactions.js b/apps/files/js/fileactions.js
index de67d13559..5027211b53 100644
--- a/apps/files/js/fileactions.js
+++ b/apps/files/js/fileactions.js
@@ -123,14 +123,11 @@ var FileActions = {
img = img(file);
}
if (typeof trashBinApp !== 'undefined' && trashBinApp) {
- var html = '';
+ var html = '';
} else {
- var html = '';
+ var html = '';
}
var element = $(html);
- if (img) {
- element.append($('
'));
- }
element.data('action', actions['Delete']);
element.on('click', {a: null, elem: parent, actionFunc: actions['Delete']}, actionHandler);
parent.parent().children().last().append(element);
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index f7cc3767b2..10801af3ea 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -15,7 +15,7 @@ var FileList={
// filename td
td = $('
| ').attr({
"class": "filename",
- "style": 'background-image:url('+iconurl+')'
+ "style": 'background-image:url('+iconurl+'); background-size: 16px;'
});
td.append('');
var link_elem = $('').attr({
@@ -371,9 +371,7 @@ var FileList={
}
for (var i=0; i';
- deleteAction.html(newHTML);
+ deleteAction.removeClass('delete-icon').addClass('progress-icon');
}
// Finish any existing actions
if (FileList.lastAction) {
@@ -395,8 +393,8 @@ var FileList={
checkTrashStatus();
} else {
$.each(files,function(index,file) {
- var deleteAction = $('tr').filterAttr('data-file',file).children("td.date").children(".move2trash");
- deleteAction.html(oldHTML);
+ var deleteAction = $('tr').filterAttr('data-file',files[i]).children("td.date").children(".action.delete");
+ deleteAction.removeClass('progress-icon').addClass('delete-icon');
});
}
});
diff --git a/core/css/styles.css b/core/css/styles.css
index 1b58899eef..c3d3425385 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -833,9 +833,25 @@ div.crumb:active {
}
/* icons */
+.folder-icon, .delete-icon, .edit-icon, .progress-icon {
+ background-repeat: no-repeat;
+ background-position: center;
+}
.folder-icon { background-image: url('../img/places/folder.svg'); }
.delete-icon { background-image: url('../img/actions/delete.svg'); }
+.delete-icon:hover, .delete-icon:focus {
+ background-image: url('../img/actions/delete-hover.svg');
+}
.edit-icon { background-image: url('../img/actions/rename.svg'); }
+.progress-icon {
+ background-image: url('../img/loading.gif');
+ background-size: 16px;
+ /* force show the loading icon, not only on hover */
+ -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+ filter:alpha(opacity=100);
+ opacity: 1 !important;
+ display: inline !important;
+}
/* buttons */
button.loading {
@@ -855,6 +871,10 @@ button.loading {
::-moz-focus-inner {
border: 0;
}
+.lte8 .delete-icon { background-image: url('../img/actions/delete.png'); }
+.lte8 .delete-icon:hover, .delete-icon:focus {
+ background-image: url('../img/actions/delete-hover.png');
+}
/* IE8 needs background to be set to same color to make transparency look good. */
.lte9 #body-login form input[type="text"] {
diff --git a/core/img/actions/delete-hover.png b/core/img/actions/delete-hover.png
new file mode 100644
index 0000000000..99f549faf9
Binary files /dev/null and b/core/img/actions/delete-hover.png differ
diff --git a/core/img/actions/delete-hover.svg b/core/img/actions/delete-hover.svg
new file mode 100644
index 0000000000..568185c5c7
--- /dev/null
+++ b/core/img/actions/delete-hover.svg
@@ -0,0 +1,12 @@
+
diff --git a/core/img/actions/delete.png b/core/img/actions/delete.png
index 99f549faf9..0d8c89a56e 100644
Binary files a/core/img/actions/delete.png and b/core/img/actions/delete.png differ
diff --git a/core/img/actions/delete.svg b/core/img/actions/delete.svg
index 568185c5c7..ef564bfd48 100644
--- a/core/img/actions/delete.svg
+++ b/core/img/actions/delete.svg
@@ -1,12 +1,6 @@
+
diff --git a/core/js/js.js b/core/js/js.js
index 60a29342f2..c2b81ae327 100644
--- a/core/js/js.js
+++ b/core/js/js.js
@@ -762,7 +762,6 @@ $(document).ready(function(){
$('.password .action').tipsy({gravity:'se', fade:true, live:true});
$('#upload').tipsy({gravity:'w', fade:true});
$('.selectedActions a').tipsy({gravity:'s', fade:true, live:true});
- $('a.delete').tipsy({gravity: 'e', fade:true, live:true});
$('a.action').tipsy({gravity:'s', fade:true, live:true});
$('td .modified').tipsy({gravity:'s', fade:true, live:true});