align filemanager list

filemanager/templates/default/app.css

@@ -22,13 +22,14 @@
  * Get path input to take all remaining width
  */
 #filemanager-index_filemanager-index-header_left {
+	float: left;
 	width: 100%;
+	margin-bottom: 1px;
 }
 div.filemanager_navigation {
 	position: relative;
 	width: 100%;
 	white-space: normal;
-	margin: 5px 0 0 5px;
 }
 div.filemanager_navigation > * {
 	vertical-align: middle;
@@ -39,16 +40,13 @@ div.filemanager_navigation > img {
 #filemanager-index_buttons {
 	float: right;
 }
-#filemanager-index_buttons > * {
+img#filemanager-index_tarp {
-	vertical-align: middle;
+	height: 22px;
-	padding-left: 5px;
-	margin:0;
 }
 div.filemanager_navigation > label {
 	position: absolute;
-	left: 50px;
+	left: 56px;
-	right: 422px;
+	right: 475px;
-	padding-top: 3px;
 	font-size: 140%;
 	white-space: nowrap;
 }
@@ -56,8 +54,18 @@ div.filemanager_navigation > label > input {
 	width: 100%;
 }
 #filemanager-index_buttons div.et2_file {
+	margin: 2px 0 0 0;
+	vertical-align: top;
+	padding-right: 7px;
+}
+#filemanager-index_buttons div.et2_file span, #filemanager-index_buttons div.et2_file input {
 	width: 130px;
-	margin-top: 2px;
+	height: 16px;
+	top: 0;
+	background-position: 3px 3px;
+	margin: 0;
+	text-indent: 22px;
+	color: #666666;
 }
 #filemanager-index_buttons div.et2_file .progress {
   width:auto;

filemanager/templates/default/index.xet

@@ -46,20 +46,20 @@
 	</template>
 	<template id="filemanager.index.header_left" template="" lang="" group="0" version="1.9.002">
 		<hbox span="all" class="filemanager_navigation">
-			<image label="Up" src="goup" onclick="app.filemanager.change_dir('..',widget);" id="up"/>
+			<buttononly id="up" statustext="Up" image="goup" background_image="true" onclick="app.filemanager.change_dir('..',widget);"/>
-			<image label="Go to your home directory" src="gohome" onclick="app.filemanager.change_dir('~',widget);" id="home"/>
+			<buttononly id="home" statustext="Go to your home directory" image="gohome" background_image="true" onclick="app.filemanager.change_dir('~',widget);"/>
 			<vfs-name label="Path" id="path" onchange="if(widget.getValue() == '') { app.filemanager.change_dir('~',widget);} return true;" size="80" class="address"/>
 			<hbox id="buttons">
-				<button label="Go to" id="button[go]" image="key_enter"/>
+				<button statustext="Go to" id="button[go]" image="key_enter" background_image="true"/>
-				<buttononly label="Tile view" id="button[change_view]" onclick="app.filemanager.change_view" options="list_tile"/>
+				<buttononly statustext="Tile view" id="button[change_view]" onclick="app.filemanager.change_view" image="list_tile" background_image="true"/>
 				<image id="tarp" src="buttonseparator"/>
-				<buttononly statustext="Rename, change permissions or ownership" label="Edit settings" id="button[edit]" onclick="app.filemanager.editprefs();" options="edit"/>
+				<buttononly statustext="Rename, change permissions or ownership" id="button[edit]" onclick="app.filemanager.editprefs();" image="edit" background_image="true"/>
-				<buttononly label="Create directory" id="button[createdir]" onclick="app.filemanager.createdir();" options="button_createdir,createdir_disabled"/>
+				<buttononly statustext="Create directory" id="button[createdir]" onclick="app.filemanager.createdir();" image="button_createdir" ro_image="createdir_disabled" background_image="true"/>
-				<buttononly label="Create a link" id="button[symlink]" onclick="app.filemanager.symlink();" options="link,link_disabled"/>
+				<buttononly statustext="Create a link" id="button[symlink]" onclick="app.filemanager.symlink();" image="link" ro_image="link_disabled" background_image="true"/>
-				<buttononly label="Paste" id="button[paste]" onclick="app.filemanager.paste('paste');" options="editpaste,editpaste_disabled"/>
+				<buttononly statustext="Paste" id="button[paste]" onclick="app.filemanager.paste('paste');" image="editpaste" ro_image="editpaste_disabled" background_image="true"/>
-				<buttononly label="Paste link" id="button[linkpaste]" onclick="app.filemanager.paste('linkpaste');" options="linkpaste,linkpaste_disabled"/>
+				<buttononly statustext="Paste link" id="button[linkpaste]" onclick="app.filemanager.paste('linkpaste');" image="linkpaste" ro_image="linkpaste_disabled" background_image="true"/>
-				<buttononly label="Mail paste" id="button[mailpaste]" onclick="app.filemanager.paste('mailpaste');" options="mailpaste,mailpaste_disabled"/>
+				<buttononly statustext="Mail paste" id="button[mailpaste]" onclick="app.filemanager.paste('mailpaste');" image="mailpaste" ro_image="mailpaste_disabled" background_image="true"/>
-				<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"/>
+				<buttononly statustext="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');" image="upload" background_image="true"/>
 				<file statustext="Select file to upload in current directory" id="upload" progress_dropdownlist = "true" drop_target ="divAppbox" multiple="true" onFinishOne="app.filemanager.uploadOnOne"/>
 			</hbox>
 		</hbox>

filemanager/templates/pixelegg/app.css

@@ -51,13 +51,14 @@
  * Get path input to take all remaining width
  */
 #filemanager-index_filemanager-index-header_left {
+  float: left;
   width: 100%;
+  margin-bottom: 1px;
 }
 div.filemanager_navigation {
   position: relative;
   width: 100%;
   white-space: normal;
-  margin: 5px 0 0 5px;
 }
 div.filemanager_navigation > * {
   vertical-align: middle;
@@ -68,16 +69,13 @@ div.filemanager_navigation > img {
 #filemanager-index_buttons {
   float: right;
 }
-#filemanager-index_buttons > * {
+img#filemanager-index_tarp {
-  vertical-align: middle;
+  height: 22px;
-  padding-left: 5px;
-  margin: 0;
 }
 div.filemanager_navigation > label {
   position: absolute;
-  left: 50px;
+  left: 56px;
-  right: 422px;
+  right: 475px;
-  padding-top: 3px;
   font-size: 140%;
   white-space: nowrap;
 }
@@ -85,8 +83,19 @@ div.filemanager_navigation > label > input {
   width: 100%;
 }
 #filemanager-index_buttons div.et2_file {
+  margin: 2px 0 0 0;
+  vertical-align: top;
+  padding-right: 7px;
+}
+#filemanager-index_buttons div.et2_file span,
+#filemanager-index_buttons div.et2_file input {
   width: 130px;
-  margin-top: 2px;
+  height: 16px;
+  top: 0;
+  background-position: 3px 3px;
+  margin: 0;
+  text-indent: 22px;
+  color: #666666;
 }
 #filemanager-index_buttons div.et2_file .progress {
   width: auto;
@@ -199,168 +208,6 @@ input.displayNone {
 */
 /*//******************************************************************
 // iframe*/
-#filemanager-index_filemanager-index-header_left {
-  float: left;
-  height: 36px;
-  width: 98%;
-}
-/*Up img*/
-img#filemanager-index_up {
-  position: relative;
-  top: 5px;
-  width: 16px;
-  height: 16px;
-  padding: 4px;
-  background-color: #e6e6e6;
-}
-/*Home img*/
-img#filemanager-index_home {
-  position: relative;
-  top: 5px;
-  width: 16px;
-  height: 16px;
-  padding: 4px;
-  background-color: #e6e6e6;
-}
-#filemanager-index_nm img.vfsMimeIcon[src*="/etemplate/thumbnail.php"] {
-  height: auto;
-}
-div.filemanager_navigation {
-  position: relative;
-  width: 100%;
-  margin-top: -12px !important;
-  margin-left: 6px !important;
-}
-div.filemanager_navigation img {
-  width: 16px;
-  height: 16px;
-  /*.background_color_10_gray;*/
-  -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-  -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-  box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  padding: 0.2em;
-}
-div.filemanager_navigation img:hover {
-  /*.background_color_20_gray;*/
-  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-  border: 1px solid rgba(0, 0, 0, 0.5);
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-}
-div.filemanager_navigation label {
-  float: left;
-  left: 74px;
-  right: 421px;
-  font-size: 140%;
-  top: 5px;
-}
-div.filemanager_navigation label input {
-  width: 99%;
-}
-/*div.filemanager_navigation > label > input {
-    width: 95%;
-}*/
-/*Buttons / Tarp / FileUpload*/
-#filemanager-index_buttons {
-  top: -3px;
-  float: left;
-  position: absolute;
-  right: 0;
-}
-#filemanager-index_buttons img {
-  width: 16px;
-  height: 16px;
-  padding: 4px;
-}
-#filemanager-index_buttons div.et2_file {
-  /*.background_color_10_gray;*/
-  -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-  -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-  box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  padding: 0em;
-  margin: 0;
-  width: 16.5em;
-  background-color: #e6e6e6;
-  height: 24px;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-}
-#filemanager-index_buttons div.et2_file:hover {
-  background-color: #1aa200 !important;
-}
-#filemanager-index_buttons div.et2_file:active {
-  background-color: #1aa200 !important;
-}
-#filemanager-index_buttons div.et2_file span.et2_file_span {
-  background-size: 16px 16px;
-  padding: 3px 0px 0px 10px;
-  width: 14em;
-  border: none;
-  cursor: pointer;
-  margin: 3px 0 0 2px;
-  background-color: #e6e6e6;
-}
-#filemanager-index_buttons div.et2_file span.et2_file_span:hover {
-  background-color: #1aa200 !important;
-}
-#filemanager-index_buttons div.et2_file span.et2_file_span:active {
-  background-color: #1aa200 !important;
-}
-#filemanager-index_buttons div.et2_file input#filemanager-index_upload {
-  color: #ffffff;
-  cursor: pointer;
-  background-color: transparent;
-  /*                &:hover {background-color: @color_positive_action_active !important;}
-                &:active {background-color: @color_positive_action_active !important;}*/
-}
-#filemanager-index_buttons div.et2_file div.progress {
-  z-index: 1;
-  width: auto;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-#filemanager-index_buttons > * {
-  padding-left: 3px;
-  vertical-align: middle;
-  margin-right: 0.2em;
-  background-color: #e6e6e6;
-}
-#filemanager-index {
-  width: auto;
-}
-#filemanager-index #filemanager-index_tarp {
-  width: 32px !important;
-  height: 32px !important;
-  position: relative;
-  top: 0px;
-  background-color: #cdcdcd;
-  border: none;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-}
-#filemanager-index #filemanager-index_tarp:hover {
-  border: none;
-  -webkit-box-shadow: none;
-  -moz-box-shadow: none;
-  box-shadow: none;
-  background-color: #cccccc;
-}
-#filemanager-index .filters {
-  vertical-align: center;
-}
-#filemanager-index .filters #filemanager-index_filter {
-  margin-top: 0.5em;
-}
 table.egwGridView_grid img {
   /*filter grey*/
   filter: none;

filemanager/templates/pixelegg/app.less

@@ -26,200 +26,13 @@
 /*//******************************************************************
 // iframe*/
 
-#filemanager-index_filemanager-index-header_left {
-    float: left;
-    height: 36px;
-    width: 98%;
-}
-
-
-
-
-// UP / Home / Path _______ / Go / #TARP# / BUTTONS ----- / UPLOAD
-
- /*Up img*/
- img#filemanager-index_up {position: relative; top: 5px; .dimension_width_height_s; padding: 4px; background-color: @gray_10;}
-
-  /*Home img*/
- img#filemanager-index_home {position: relative; top: 5px; .dimension_width_height_s; padding: 4px; background-color: @gray_10;}
-
-#filemanager-index_nm img.vfsMimeIcon[src*="/etemplate/thumbnail.php"] {
-	height: auto;
-}
-
-// Pfad
-div.filemanager_navigation{
-        position: relative;
-        width: 100%;
-        margin-top: -12px !important;
-        margin-left: 6px !important;
-
-
-        img {
-                .dimension_width_height_s;
-                .Complete_Button_Icon_normal;
-                padding: 0.2em;
-
-                &:hover {.Complete_Button_Icon_hover;}
-            }
-
-        label {
-
-            float: left;
-            left: 74px;
-            right: 421px;
-            font-size: 140%;
-            top: 5px;
-
-        input {width: 99%;}
-
-
-
-
-    }
-
-}
-
-/*div.filemanager_navigation > label > input {
-    width: 95%;
-}*/
-
-
-/*Buttons / Tarp / FileUpload*/
-#filemanager-index_buttons {
-    top: -3px;
-    float: left;
-    position: absolute;
-    right: 0;
-
-    img {.dimension_width_height_s; padding: 4px;}
-
-
-    // choose data area
-    div.et2_file{
-        .Complete_Button_Icon_normal;
-        padding: 0em;
-        margin:0;
-        width: 16.5em;
-        background-color: @gray_10;
-        .dimension_height_m;
-        .rounded(3px);
-
-
-                        &:hover {background-color: @color_positive_action_active !important;}
-                        &:active {background-color: @color_positive_action_active !important;}
-
-        // Text: Datei wählen
-        span.et2_file_span {
-            background-size: 16px 16px;
-            padding: 3px 0px 0px 10px;;
-            width: 14em;
-            border: none;
-            cursor: pointer;
-            margin: 3px 0 0 2px;
-            background-color: @gray_10;
-
-                        &:hover {background-color: @color_positive_action_active !important;}
-                        &:active {background-color: @color_positive_action_active !important;}
-        }
-
-       // Upload Fläche
-       input#filemanager-index_upload {
-                color: @gray_0;
-                cursor: pointer;
-                background-color: transparent;
-
-/*                &:hover {background-color: @color_positive_action_active !important;}
-                &:active {background-color: @color_positive_action_active !important;}*/
-
-        }
-
-
-        // Progress Bar
-        div.progress {z-index: 1;width:auto;overflow: hidden;text-overflow: ellipsis;}
-  }
-
-}
-
-#filemanager-index_buttons > * {
-    padding-left: 3px;
-    vertical-align: middle;
-    margin-right: 0.2em;
-    background-color: @gray_10;
-
-
-
-}
-
-
-
-
-
-
-#filemanager-index{
-    width: auto;
-
-
-
-
-    // Tarp
-    #filemanager-index_tarp {
-        width: 32px !important;
-        height: 32px !important;
-        position: relative;
-        top: 0px;
-        background-color: @gray_20;
-
-        border: none;
-         -webkit-box-shadow: none;
-         -moz-box-shadow: none;
-         box-shadow: none;
-                &:hover {
-                        border: none;
-                        -webkit-box-shadow: none;
-                        -moz-box-shadow: none;
-                        box-shadow: none;
-                        .background_color_20_gray;
-               }
-    }
-
-
-
-
-
-
-
-
-    .filters{
-
-        vertical-align: center;
-
-        #filemanager-index_filter{ margin-top: 0.5em;}
-    }
-
-
-}
-
-
-
 // images .... uploaded files
 table.egwGridView_grid img {
-
     .img_filter_none;
-
 }
 
-
-
-
 // iframe
 
-
-
-
-
-
-
 /*// #####################################################*/
 /*Dialog filemanager*/