1 files changed, 73 insertions, 50 deletions

diff --git a/apps/files/css/files.css b/apps/files/css/files.css
index 7e3318a962b..26ba86b28c8 100644
--- a/apps/files/css/files.css
+++ b/apps/files/css/files.css
@@ -249,8 +249,8 @@ table th.column-last, table td.column-last {
 	box-sizing: border-box;
 	position: relative;
 	/* this can not be just width, both need to be set … table styling */
-	min-width: 176px;
-	max-width: 176px;
+	min-width: 130px;
+	max-width: 130px;
 }
 
 /* Multiselect bar */
@@ -326,14 +326,7 @@ table td.filename .nametext, .uploadtext, .modified, .column-last>span:first-chi
 	position: relative;
 	overflow: hidden;
 	text-overflow: ellipsis;
-	width: 90%;
-}
-/* ellipsize long modified dates to make room for showing delete button */
-#fileList tr:hover .modified,
-#fileList tr:focus .modified,
-#fileList tr:hover .column-last>span:first-child,
-#fileList tr:focus .column-last>span:first-child {
-	width: 75%;
+	width: 110px;
 }
 
 /* TODO fix usability bug (accidental file/folder selection) */
@@ -372,45 +365,27 @@ table td.filename .nametext .innernametext {
 
 @media only screen and (min-width: 1366px) {
 	table td.filename .nametext .innernametext {
-		max-width: 760px;
-	}
-
-	table tr:hover td.filename .nametext .innernametext,
-	table tr:focus td.filename .nametext .innernametext {
-		max-width: 480px;
+		max-width: 660px;
 	}
 }
-
 @media only screen and (min-width: 1200px) and (max-width: 1366px) {
 	table td.filename .nametext .innernametext {
-		max-width: 600px;
-	}
-
-	table tr:hover td.filename .nametext .innernametext,
-	table tr:focus td.filename .nametext .innernametext {
-		max-width: 320px;
+		max-width: 500px;
 	}
 }
-
-@media only screen and (min-width: 1000px) and (max-width: 1200px) {
+@media only screen and (min-width: 1100px) and (max-width: 1200px) {
 	table td.filename .nametext .innernametext {
 		max-width: 400px;
 	}
-
-	table tr:hover td.filename .nametext .innernametext,
-	table tr:focus td.filename .nametext .innernametext {
-		max-width: 120px;
+}
+@media only screen and (min-width: 1000px) and (max-width: 1100px) {
+	table td.filename .nametext .innernametext {
+		max-width: 310px;
 	}
 }
-
 @media only screen and (min-width: 768px) and (max-width: 1000px) {
 	table td.filename .nametext .innernametext {
-		max-width: 320px;
-	}
-
-	table tr:hover td.filename .nametext .innernametext,
-	table tr:focus td.filename .nametext .innernametext {
-		max-width: 40px;
+		max-width: 240px;
 	}
 }
 
@@ -517,6 +492,23 @@ table td.filename .uploadtext {
 	font-size: 11px;
 }
 
+.busy .fileactions, .busy .action {
+	visibility: hidden;
+}
+
+/* fix position of bubble pointer for Files app */
+.bubble,
+#app-navigation .app-navigation-entry-menu {
+	border-top-right-radius: 3px;
+}
+.bubble:after,
+#app-navigation .app-navigation-entry-menu:after {
+	right: 6px;
+}
+.bubble:before,
+#app-navigation .app-navigation-entry-menu:before {
+	right: 6px;
+}
 
 /* force show the loading icon, not only on hover */
 #fileList .icon-loading-small {
@@ -527,21 +519,15 @@ table td.filename .uploadtext {
 }
 
 #fileList img.move2trash { display:inline; margin:-8px 0; padding:16px 8px 16px 8px !important; float:right; }
-#fileList a.action.delete {
-	position: absolute;
-	right: 15px;
-	padding: 17px 14px;
-}
 
 #fileList .action.action-share-notification span, #fileList a.name {
 	cursor: default !important;
 }
 
-a.action>img {
-	max-height:16px;
-	max-width:16px;
-	vertical-align:text-bottom;
-	margin-bottom: -1px;
+a.action > img {
+	max-height: 16px;
+	max-width: 16px;
+	vertical-align: text-bottom;
 }
 
 /* Actions for selected files */
@@ -578,10 +564,6 @@ a.action>img {
 	display:none;
 }
 
-#fileList a.action[data-action="Rename"] {
-	padding: 16px 14px 17px !important;
-}
-
 .ie8 #fileList a.action img,
 #fileList tr:hover a.action,
 #fileList a.action.permanent,
@@ -693,3 +675,44 @@ table.dragshadow td.size {
 .mask.transparent{
 	opacity: 0;
 }
+
+.fileActionsMenu {
+	padding: 4px 12px;
+}
+.fileActionsMenu li {
+	padding: 5px 0;
+}
+#fileList .fileActionsMenu a.action img {
+	padding: initial;
+}
+#fileList .fileActionsMenu a.action {
+	padding: 10px;
+	margin: -10px;
+}
+
+.fileActionsMenu.hidden {
+	display: none;
+}
+
+#fileList .fileActionsMenu .action {
+	display: block;
+	line-height: 30px;
+	padding-left: 5px;
+	color: #000;
+	padding: 0;
+}
+
+.fileActionsMenu .action img,
+.fileActionsMenu .action .no-icon {
+	display: inline-block;
+	width: 16px;
+	margin-right: 5px;
+}
+
+.fileActionsMenu .action {
+	opacity: 0.5;
+}
+
+.fileActionsMenu li:hover .action {
+	opacity: 1;
+}