From 76f979049654e2140625550d36a88c250c8dbb09 Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hnategh@gmail.com>
Date: Wed, 8 Feb 2017 10:39:42 +0100
Subject: [PATCH] * Filemanager/Mobile theme: Improve navigation bar to be able
 to navigate through folders with single-touch

---
 filemanager/templates/mobile/app.css   | 22 +++++++++++++++++++---
 filemanager/templates/mobile/app.less  | 16 +++++++++++++---
 filemanager/templates/mobile/index.xet | 14 +++++++-------
 3 files changed, 39 insertions(+), 13 deletions(-)

diff --git a/filemanager/templates/mobile/app.css b/filemanager/templates/mobile/app.css
index 65602942c4..7a7ce5a491 100644
--- a/filemanager/templates/mobile/app.css
+++ b/filemanager/templates/mobile/app.css
@@ -435,10 +435,11 @@ div#stylite-filemanager-upload .dialogFooterToolbar button:active {
     overflow: auto;
     width: 100%;
     padding-top: 5px;
+    height: auto;
   }
   #filemanager-index_nm .buttons img {
-    width: 32px;
-    height: 32px;
+    width: 24px;
+    height: 24px;
     padding-left: 15px;
   }
   #filemanager-index_nm #filemanager-index_tarp {
@@ -454,12 +455,27 @@ div#stylite-filemanager-upload .dialogFooterToolbar button:active {
   #filemanager-index_nm .nextmatch_header.nm_header_hide .filtersContainer {
     display: none;
   }
+  #filemanager-index_nm .nextmatch_header .nextmatch_header_row {
+    padding-bottom: 0px;
+  }
   #filemanager-index_nm .nextmatch_header .filemanager_navigation {
     height: auto;
   }
   #filemanager-index_nm .nextmatch_header .filemanager_navigation #filemanager-index_path {
     height: 50px;
-    width: 99%;
+    width: calc(100% - 90px);
+    display: inline-block;
+    border: none;
+    background: white;
+  }
+  #filemanager-index_nm .nextmatch_header .filemanager_navigation #filemanager-index_path:focus {
+    outline: none;
+  }
+  #filemanager-index_nm .nextmatch_header .filemanager_navigation #filemanager-index_up {
+    width: 24px;
+    height: 100%;
+    margin-left: 22px;
+    margin-right: 22px;
   }
   #filemanager-index_nm .nextmatch_header div.filtersContainer {
     margin-top: 0px;
diff --git a/filemanager/templates/mobile/app.less b/filemanager/templates/mobile/app.less
index 52066972ef..b15ef91d2f 100644
--- a/filemanager/templates/mobile/app.less
+++ b/filemanager/templates/mobile/app.less
@@ -48,10 +48,11 @@
 			width:100%;
 			padding-top:5px;
 			img{
-				width: 32px;
-				height: 32px;
+				width: 24px;
+				height: 24px;
 				padding-left: 15px;
 			}
+			height: auto;
 		}
 
 		#filemanager-index_tarp {display: none !important;}
@@ -61,9 +62,18 @@
 			.header_row_right, .filtersContainer {display:none;}
 		}
 		.nextmatch_header {
+			.nextmatch_header_row {padding-bottom:0px;}
 			.filemanager_navigation {
 				height: auto;
-				#filemanager-index_path {height:50px;width:99%;}
+				#filemanager-index_path {
+					height:50px;
+					width:~"calc(100% - 90px)";
+					display: inline-block;
+					border: none;
+					&:focus {outline: none;}
+					background: white;
+				}
+				#filemanager-index_up {width:24px;height: 100%;margin-left:22px;margin-right:22px;}
 			}
 			div.filtersContainer {margin-top:0px;border-bottom: 1px solid silver;}
 		}
diff --git a/filemanager/templates/mobile/index.xet b/filemanager/templates/mobile/index.xet
index e8fc8da1de..9c4cd911ed 100644
--- a/filemanager/templates/mobile/index.xet
+++ b/filemanager/templates/mobile/index.xet
@@ -38,18 +38,18 @@
 			<buttononly label="Paste" id="button[paste]" onclick="app.filemanager.paste('paste');" options="editpaste,editpaste_disabled"/>
 			<buttononly label="Paste link" id="button[linkpaste]" onclick="app.filemanager.paste('linkpaste');" options="linkpaste,linkpaste_disabled"/>
 			<buttononly label="Mail paste" id="button[mailpaste]" onclick="app.filemanager.paste('mailpaste');" options="mailpaste,mailpaste_disabled"/>
+			<image label="Go to your home directory" src="gohome" onclick="app.filemanager.change_dir('~',widget);" id="home"/>
+			<buttononly label="Tile view" id="button[change_view]" onclick="app.filemanager.change_view" options="list_tile"/>
+			<button label="File a file" onclick="window.open(egw::link('/index.php','menuaction=stylite.stylite_filemanager.upload'),'_blank','dependent=yes,width=550,height=350,scrollbars=yes,status=yes'); return false;" image="upload"/>
 		</hbox>
 	</template>
 	<template id="filemanager.index.header_left" template="" lang="" group="0" version="1.9.002">
-		<vbox span="all" class="filemanager_navigation">
-			<vfs-name id="path" onchange="if(widget.getValue() == '') { app.filemanager.change_dir('~',widget);} return true;" size="80" class="address"/>
-			<hbox class="buttons">
+		<hbox span="all" class="filemanager_navigation">
+			<hbox>
 				<image label="Up" src="goup" onclick="app.filemanager.change_dir('..',widget);" id="up"/>
-				<image label="Go to your home directory" src="gohome" onclick="app.filemanager.change_dir('~',widget);" id="home"/>
-				<buttononly label="Tile view" id="button[change_view]" onclick="app.filemanager.change_view" options="list_tile"/>
-				<button label="File a file" onclick="window.open(egw::link('/index.php','menuaction=stylite.stylite_filemanager.upload'),'_blank','dependent=yes,width=550,height=350,scrollbars=yes,status=yes'); return false;" image="upload"/>
 			</hbox>
-		</vbox>
+			<vfs-name id="path" onchange="if(widget.getValue() == '') { app.filemanager.change_dir('~',widget);} return true;" size="80" class="address"/>
+		</hbox>
 	</template>
 	<template id="filemanager.index" template="" lang="" group="0" version="1.9.003">
 		<nextmatch id="nm" template="filemanager.index.rows" header_left="filemanager.index.header_left" header_right="filemanager.index.header_right" />