From 361aaf0c95ef17dfdf79c5e1f11efc005e2babcf Mon Sep 17 00:00:00 2001
From: Abijeet <abijeetpatro@gmail.com>
Date: Sat, 30 Dec 2017 12:21:50 +0530
Subject: Fixes the delete icon not appearing on certain resolutions.

Fixes #7539

Also fixes overlap of text on mobile devices by resorting to just icons on lower resolutions.

Signed-off-by: Abijeet <abijeetpatro@gmail.com>
---
 apps/files/css/files.scss     |  4 ++++
 apps/files/css/mobile.scss    | 12 +++++++++++-
 apps/files/templates/list.php |  4 ++++
 3 files changed, 19 insertions(+), 1 deletion(-)

(limited to 'apps/files')

diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss
index 8e81bf84b4f..dce5008ad19 100644
--- a/apps/files/css/files.scss
+++ b/apps/files/css/files.scss
@@ -542,6 +542,10 @@ a.action > img {
 	vertical-align: text-bottom;
 	margin-bottom: -1px;
 }
+/* hide the delete icon in name column normal resolutions */
+table th#headerName .selectedActions .delete-selected {
+	display: none;
+}
 
 #fileList td a {
 	a.action {
diff --git a/apps/files/css/mobile.scss b/apps/files/css/mobile.scss
index 10fa29e7a38..5653d5841bc 100644
--- a/apps/files/css/mobile.scss
+++ b/apps/files/css/mobile.scss
@@ -12,7 +12,6 @@
 	min-width: initial !important;
 }
 
-/* hide size and date columns */
 table th#headerSize,
 table td.filesize,
 table th#headerDate,
@@ -52,6 +51,11 @@ table td.filename .nametext .innernametext {
 	max-width: calc(100% - 175px) !important;
 }
 
+/* show the delete icon in name column in lower resolutions */
+table th#headerName .selectedActions .delete-selected {
+	display: inline;
+}
+
 /* proper notification area for multi line messages */
 #notification-container {
 	display: flex;
@@ -75,3 +79,9 @@ table.dragshadow {
 }
 
 }
+@media only screen and (max-width: 480px)  {
+	/* Only show icons */
+	table th .selectedActions a span:not(.icon) {
+		display: none;
+	}
+}
diff --git a/apps/files/templates/list.php b/apps/files/templates/list.php
index 92f64a52a28..fd5423c334f 100644
--- a/apps/files/templates/list.php
+++ b/apps/files/templates/list.php
@@ -59,6 +59,10 @@
 							<span class="icon icon-download"></span>
 							<span><?php p($l->t('Download'))?></span>
 						</a>
+						<a href="" class="delete-selected">
+							<span class="icon icon-delete"></span>
+							<span><?php p($l->t('Delete'))?></span>
+						</a>
 					</span>
 				</div>
 			</th>
-- 
cgit v1.2.3


From 64c0874a153a9acbc55e761e4c8de6e47f4b7a6d Mon Sep 17 00:00:00 2001
From: Daniel Calviño Sánchez <danxuliu@gmail.com>
Date: Wed, 3 Jan 2018 01:32:39 +0100
Subject: Increase touch area for header icons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

On narrow screens only the action icons are shown in the multiselect
header of the file list. In that case the padding of those icons is
increased to provide a larger touch area (the padding used is the same
as in the inline actions of the file list).

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 apps/files/css/mobile.scss | 5 +++++
 1 file changed, 5 insertions(+)

(limited to 'apps/files')

diff --git a/apps/files/css/mobile.scss b/apps/files/css/mobile.scss
index 5653d5841bc..aadbe2ada25 100644
--- a/apps/files/css/mobile.scss
+++ b/apps/files/css/mobile.scss
@@ -84,4 +84,9 @@ table.dragshadow {
 	table th .selectedActions a span:not(.icon) {
 		display: none;
 	}
+
+	/* Increase touch area for the icons */
+	table th .selectedActions a {
+		padding: 17px 14px;
+	}
 }
-- 
cgit v1.2.3


From c500b197622e7524b1e6bd250cbc65145ccccda4 Mon Sep 17 00:00:00 2001
From: Daniel Calviño Sánchez <danxuliu@gmail.com>
Date: Wed, 3 Jan 2018 02:22:00 +0100
Subject: Remove margin for selected files summary
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The selected files summary shown in the multiselect header has a margin
to align it with the names of the files in the contents of the file
list. However, on very narrow screens, and depending on the verbosity of
the language, the summary can overlap with the actions when the
selection contains files and folders. To try to mitigate this, besides
showing only the icons for the actions, the summary margin is removed
too in very narrow screens.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 apps/files/css/mobile.scss | 5 +++++
 1 file changed, 5 insertions(+)

(limited to 'apps/files')

diff --git a/apps/files/css/mobile.scss b/apps/files/css/mobile.scss
index aadbe2ada25..703ae499835 100644
--- a/apps/files/css/mobile.scss
+++ b/apps/files/css/mobile.scss
@@ -89,4 +89,9 @@ table.dragshadow {
 	table th .selectedActions a {
 		padding: 17px 14px;
 	}
+
+	/* Remove the margin to reduce the overlap between the name and the icons */
+	table.multiselect th .columntitle.name {
+		margin-left: 0;
+	}
 }
-- 
cgit v1.2.3