From b0b9df8e50e1f0af703fa963c0d4411c2efcc754 Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hnategh@gmail.com>
Date: Wed, 25 Mar 2020 17:42:07 +0100
Subject: [PATCH] Sharing UI improvement

---
 filemanager/templates/default/index.xet     |   2 +-
 filemanager/templates/default/sharing.css   |   3 +-
 filemanager/templates/pixelegg/sharing.css  |  95 +++++++++++++++++--
 filemanager/templates/pixelegg/sharing.less | 100 +++++++++++++++++++-
 4 files changed, 189 insertions(+), 11 deletions(-)

diff --git a/filemanager/templates/default/index.xet b/filemanager/templates/default/index.xet
index ec0e7bd764..8558d1c102 100644
--- a/filemanager/templates/default/index.xet
+++ b/filemanager/templates/default/index.xet
@@ -45,7 +45,7 @@
 		</grid>
 	</template>
 	<template id="filemanager.index.header_left" template="" lang="" group="0" version="1.9.002">
-		<file statustext="Select file to upload in current directory" id="upload" progress_dropdownlist = "true" drop_target ="divAppbox" multiple="true" onFinishOne="app.filemanager.uploadOnOne"/>
+		<file label="Upload" statustext="Select file to upload in current directory" id="upload" progress_dropdownlist = "true" drop_target ="divAppbox" multiple="true" onFinishOne="app.filemanager.uploadOnOne"/>
 	</template>
 	<template id="filemanager.index.header_row" template="" lang="" group="0" version="1.9.002">
 		<buttononly id="home" statustext="Go to your home directory" image="gohome" background_image="true" onclick="app.filemanager.change_dir('~',widget);"/>
diff --git a/filemanager/templates/default/sharing.css b/filemanager/templates/default/sharing.css
index 1100c449b6..ac5c743a84 100644
--- a/filemanager/templates/default/sharing.css
+++ b/filemanager/templates/default/sharing.css
@@ -57,8 +57,7 @@ div.et2_nextmatch  thead{
 	display: none;
 }
 div.nextmatch_header {
-	padding-bottom: 10px !important;
-	padding-top: 10px !important;
+
 }
 
 div.search {
diff --git a/filemanager/templates/pixelegg/sharing.css b/filemanager/templates/pixelegg/sharing.css
index 54ed08fdea..7917306069 100644
--- a/filemanager/templates/pixelegg/sharing.css
+++ b/filemanager/templates/pixelegg/sharing.css
@@ -54,10 +54,6 @@ div.et2_nextmatch div.nextmatch_header_row {
 div.et2_nextmatch thead {
   display: none;
 }
-div.nextmatch_header {
-  padding-bottom: 10px !important;
-  padding-top: 10px !important;
-}
 div.search {
   position: relative;
   width: 35%;
@@ -92,11 +88,12 @@ div#popupMainDiv:before {
   background-position: 15px;
   background-size: 40px;
   height: 45px;
-  background-color: #0c5da5;
+  background-color: #e8e8e8;
   display: inline-block;
   position: absolute;
   top: 0;
   left: 0;
+  border-bottom: 1px solid silver;
 }
 form#filemanager-index {
   margin-left: 200px !important;
@@ -106,9 +103,95 @@ form#filemanager-index:after {
   content: ' ';
   width: 100%;
   height: 45px;
-  background: #0c5da5;
+  background: #e8e8e8;
   display: inline-block;
   position: absolute;
   bottom: 0;
   left: 0;
 }
+form#filemanager-index .et2_toolbar .et2_toolbar_actionlist button.et2_button_with_image,
+form#filemanager-index .nextmatch_header_row .et2_button {
+  width: 45px;
+  height: 45px;
+  background-size: 18px auto;
+  margin: 0;
+  border: 0;
+  border-right: 1px solid silver;
+  padding: 0;
+  border-radius: 0;
+  outline: none;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_button\[createdir\] {
+  background-color: white;
+  border-left: 1px solid silver;
+  border-right: 1px solid silver;
+}
+form#filemanager-index .nextmatch_header_row .et2_searchbox .flex input {
+  height: 45px;
+  border: 0px;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+  margin: 0;
+  padding: 0px 0px 0px 5px;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_path {
+  width: calc(100% - 165px);
+  display: inline-block;
+  padding-right: 30px;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_row {
+  width: calc(45% - 115px);
+  min-width: 250px;
+  background-color: #fefefe;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_row .et2_vfsPath input.et2_textbox.et2_vfs {
+  height: 45px;
+  border-radius: 0;
+  padding: 0px 29px 0px 0px;
+  border: 0;
+  border-right: 1px solid silver;
+  margin: 0;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_row .et2_vfsPath li.vfsPath.et2_clickable:last-child:hover {
+  background: #c0c0c054;
+  border-radius: 0;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_row .et2_vfsPath li,
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_row .et2_vfsPath li.vfsPath.et2_clickable:last-child:before {
+  line-height: 35px;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_right #filemanager-index_new_wrapper {
+  margin: 0;
+  border-left: 1px solid silver;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_right #filemanager-index_new_wrapper .et2_dropdown button {
+  height: 45px;
+  border: 0;
+  border-radius: 0;
+  outline: none;
+  margin: 0;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_left .et2_file {
+  width: 100px;
+  margin: 0;
+  padding: 0px;
+  height: 45px;
+}
+form#filemanager-index .nextmatch_header_row #filemanager-index_filemanager-index-header_left .et2_file span {
+  width: 100px;
+  text-indent: 35px;
+  color: #1b1b1b;
+  line-height: 45px;
+  box-shadow: none !important;
+  background-color: #fcc318c7;
+}
+form#filemanager-index .nextmatch_header_row .et2_file_span.et2_button.et2_file_ro {
+  background-color: #fcc318c7 !important;
+}
+form#filemanager-index .nextmatch_header_row .et2_button_ro {
+  background-color: #fafafa !important;
+}
+form#filemanager-index table.egwGridView_grid tbody {
+  border-bottom: none;
+}
diff --git a/filemanager/templates/pixelegg/sharing.less b/filemanager/templates/pixelegg/sharing.less
index af50b9d1c1..595bf1885f 100644
--- a/filemanager/templates/pixelegg/sharing.less
+++ b/filemanager/templates/pixelegg/sharing.less
@@ -24,11 +24,12 @@ div#popupMainDiv {
 		background-position: 15px;
 		background-size: 40px;
 		height: 45px;
-		background-color: #0c5da5;
+		background-color: #e8e8e8;
 		display: inline-block;
 		position: absolute;
 		top: 0;
 		left: 0;
+		border-bottom: 1px solid silver;
 	}
 }
 form#filemanager-index {
@@ -36,7 +37,7 @@ form#filemanager-index {
 		content: ' ';
 		width: 100%;
 		height: 45px;
-		background: #0c5da5;
+		background: #e8e8e8;
 		display: inline-block;
 		position: absolute;
 		bottom: 0;
@@ -44,4 +45,99 @@ form#filemanager-index {
 	}
 	margin-left: 200px !important;
 	margin-right: 200px !important;
+	.et2_toolbar .et2_toolbar_actionlist button.et2_button_with_image, .nextmatch_header_row .et2_button {
+		width: 45px;
+		height: 45px;
+		background-size: 18px auto;
+		margin: 0;
+		border: 0;
+		border-right: 1px solid silver;
+		padding: 0;
+		border-radius: 0;
+		outline: none;
+	}
+	.nextmatch_header_row {
+		.header_row_right {
+
+		}
+		#filemanager-index_button\[createdir\] {
+			background-color: white;
+			border-left: 1px solid silver;
+			border-right: 1px solid silver;
+		}
+		.et2_searchbox .flex input {
+			height: 45px;
+			border: 0px;
+			-webkit-border-radius: 0;
+			-moz-border-radius: 0;
+			border-radius: 0;
+			margin: 0;
+			padding: 0px 0px 0px 5px;
+		}
+		#filemanager-index_path {
+			width: calc(100% - 165px);
+			display: inline-block;
+			padding-right: 30px;
+		}
+		#filemanager-index_filemanager-index-header_row {
+			width: ~"calc(45% - 115px)";
+			min-width: 250px;
+			background-color: #fefefe;
+			.et2_vfsPath {
+				input.et2_textbox.et2_vfs {
+					height: 45px;
+					border-radius: 0;
+					padding: 0px 29px 0px 0px;
+					border: 0;
+					border-right: 1px solid silver;
+					margin: 0;
+				}
+				li.vfsPath.et2_clickable:last-child:hover {
+					background: #c0c0c054;
+					border-radius: 0;
+				}
+				li, li.vfsPath.et2_clickable:last-child:before {line-height: 35px;}
+
+			}
+		}
+		#filemanager-index_filemanager-index-header_right {
+			#filemanager-index_new_wrapper {
+				margin: 0;
+				border-left: 1px solid silver;
+				.et2_dropdown button {
+					height: 45px;
+					border: 0;
+					border-radius: 0;
+					outline: none;
+					margin: 0;
+				}
+			}
+		}
+		#filemanager-index_filemanager-index-header_left .et2_file
+		{
+			width: 100px;
+			margin: 0;
+			padding: 0px;
+			height: 45px;
+			span {
+				width: 100px;
+				text-indent: 35px;
+				color: #1b1b1b;
+				line-height: 45px;
+				box-shadow: none !important;
+				background-color: #fcc318c7;
+			}
+		}
+		.et2_file_span.et2_button.et2_file_ro {
+			background-color: #fcc318c7 !important;
+		}
+		.et2_button_ro {
+			background-color: #fafafa !important;
+		}
+	}
+	table.egwGridView_grid tbody {
+		border-bottom: none;
+	}
 }
+
+