From 25c48e6aed35084d3bd49e5b577a4ace9f640bc8 Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <JanCBorchardt@fsfe.org>
Date: Thu, 28 Jul 2011 00:21:11 +0200
Subject: [PATCH] lots of small style fixes for the file list
---
core/css/styles.css | 4 ++-
files/css/files.css | 65 ++++++++-------------------------------
files/js/files.js | 32 ++++++++++---------
files/templates/index.php | 6 ++--
4 files changed, 37 insertions(+), 70 deletions(-)
diff --git a/core/css/styles.css b/core/css/styles.css
index 7a26c2f670..f5f54a1c9f 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -5,7 +5,9 @@ body { background:#fefefe url('../img/body_background.jpg') repeat-y left top; f
#owncloud { float:left; margin:0 0 0 2em; }
h1 { margin:1em 3em 1em 0; border-bottom:1px solid #666; text-transform:uppercase; font-weight:normal; font-style:italic; color:#666; }
p.center { text-align:center; }
-a { color:#000; text-decoration:none; }
+a { color:#000; text-decoration:none; outline:0; }
+table { white-space:nowrap; }
+input { background:#fff; cursor:pointer; }
form#user_settings { max-width:600px; }
form#user_settings p label { display:block; float:left; width:35%; padding:0.4em 0.5em 0 0; text-align:right; }
diff --git a/files/css/files.css b/files/css/files.css
index 590c7bac36..c00b595fd2 100644
--- a/files/css/files.css
+++ b/files/css/files.css
@@ -17,7 +17,6 @@
.file_upload_form, #file_newfolder_form {
display: inline;
- margin-left:3em;
}
#fileSelector, #file_upload_submit, #file_newfolder_submit {
@@ -37,14 +36,14 @@
#file_newfolder_name {
background-image:url("../img/folder.png"); font-weight:bold;
- width: 14em;
+ width: 11em;
}
.file_upload_start, .file_upload_filename{
position:absolute;
top:0px;
left:0px;
- width:30ex;
+ width:11em;
font-size: 0.9em;
}
@@ -54,7 +53,7 @@
left:-2em;
display: -moz-inline-box; /* fallback for older firefox versions*/
display: inline-block;
- width:30ex;
+ width:12em;
}
#file_newfolder_submit, #file_upload_submit {
@@ -76,39 +75,6 @@ table {
tbody tr:hover, tbody tr:active, tbody tr.selected { background-color:#eee; }
tbody a { color:#000; }
-table td.filesize, table td.date
-{
- width: 7em;
- padding: 0.5em 1em;
- text-align: right;
-}
-#headerSize{
- text-align:right;
-}
-
-table td.date
-{
- width: 11em;
-}
-
-table td.selection, table th.selection, table td.fileaction
-{
- width: 2em;
- text-align: center;
-}
-
-td.filename{
- position:relative;
-}
-
-.dropArrow{
- height:16px;
- width:16px;
- display: -moz-inline-box; /* fallback for older firefox versions*/
- display: inline-block;
- background-image:url('../img/drop-arrow.png');
-}
-
span.extention{
color:#999;
}
@@ -118,23 +84,23 @@ div.crumb{
display:block;
background-repeat:no-repeat;
background-position:right 0px;
- font-size:20px;
+ font-weight:bold;
padding-top:8px;
padding-left:8px;
height:28px; /*36-8*/
}
table tr.mouseOver td { background-color:#eee; }
-table th, table td { padding:0; border-bottom:1px solid #ddd; text-align:left; font-style:italic; }
-table th { padding:0.5em; }
+table th { padding:.5em; }
+table th .name { float:left; margin-left:.5em; }
+table th, table td { border-bottom:1px solid #ddd; text-align:left; font-weight:normal; }
table td { border-bottom:1px solid #eee; font-style:normal; }
-table td.date { width:11em; }
+table th#headerSize, table td.filesize, table th#headerDate, table td.date { width:4em; padding:0 1em; text-align:right; cursor:help; }
table td.selection, table th.selection, table td.fileaction { width:2em; text-align:center; }
table td.filename a { display:block; background-image:url('../img/file.png'); text-decoration:none; }
-table td.filename a, table td.login, table td.logout, table td.download, table td.upload, table td.create, table td.delete { padding:0.5em 0.5em 0.5em 3em; background-position:1em center; background-repeat:no-repeat; }
+table td.filename a, table td.login, table td.logout, table td.download, table td.upload, table td.create, table td.delete { padding:.5em .5em .5em 3em; background-position:1em center; background-repeat:no-repeat; }
table td.filename a:hover, table td.filename a:focus { outline:0; }
table td.filename a:active { outline:0; }
-table em { font-weight:bold; }
table td.filename a.folder-up { background-image:url('../img/back.png'); font-style:italic; }
table td.filename a.folder { background-image:url('../img/folder.png'); }
table td.filename a.folder-home { background-image:url('../img/home.png'); }
@@ -151,16 +117,11 @@ table td.download { background-image:url('../img/download.png'); }
table td.upload { background-image:url('../img/upload.png'); }
table td.create { background-image:url('../img/folder-new.png'); }
table td.delete { background-image:url('../img/delete.png'); }
-#fileList tr input[type=checkbox] { display:none; float:left; margin:0.7em; margin-left:1em; }
-#fileList tr input[type=checkbox]:checked { display:inline; }
-#fileList tr:hover input[type=checkbox] { display:inline; }
-#fileList tr:hover td.filename a{background-image:none !important}
-#fileList tr.selected td.filename a{background-image:none !important}
+#fileList tr input[type=checkbox] { display:none; float:left; margin:.7em 0 0 1em; /* bigger clickable area doesn’t work in FF width:2.8em; height:2.4em;*/ }
+#fileList tr input[type=checkbox]:checked, #fileList tr:hover input[type=checkbox] { display:inline; }
+#fileList tr.selected td.filename a, #fileList tr:hover td.filename a{background-image:none !important}
#select_all{float:left; margin:0.2em; margin-left:0.6em; }
-#selectedActions{
- float:right;
- display:none;
-}
+#selectedActions { float:right; display:none; }
#uploadsize-message{display:none}
/* add breadcrumb divider to the File item in navigation panel */
diff --git a/files/js/files.js b/files/js/files.js
index e1ac4e172f..23d4c0205f 100644
--- a/files/js/files.js
+++ b/files/js/files.js
@@ -328,7 +328,9 @@ function procesSelection(){
var selectedFolders=selected.filter(function(el){return el.type=='dir'});
if(selectedFiles.length==0 && selectedFolders.length==0){
$('#headerName>span.name').text('Name');
- $('#headerSize').text('Size (MB)');
+ $('#headerSize').text('Size MB');
+ $('#headerDate').text('Modified');
+ $('th').css({background:'#fff',fontWeight:'normal'});
$('#selectedActions').hide();
}else{
$('#selectedActions').show();
@@ -347,26 +349,28 @@ function procesSelection(){
totalSize= '>1000';
}
}
- $('#headerSize').text(totalSize+' (MB)');
+ $('#headerSize').text(totalSize+' MB');
var selection='';
- if(selectedFiles.length>0){
- if(selectedFiles.length==1){
- selection+='1 File';
+ if(selectedFolders.length>0){
+ if(selectedFolders.length==1){
+ selection+='1 folder';
}else{
- selection+=selectedFiles.length+' Files';
+ selection+=selectedFolders.length+' folders';
}
- if(selectedFolders.length>0){
- selection+=' ,';
+ if(selectedFiles.length>0){
+ selection+=' & ';
}
}
- if(selectedFolders.length>0){
- if(selectedFolders.length==1){
- selection+='1 Folder';
+ if(selectedFiles.length>0){
+ if(selectedFiles.length==1){
+ selection+='1 file';
}else{
- selection+=selectedFolders.length+' Folders';
+ selection+=selectedFiles.length+' files';
}
}
- $('#headerName>span.name').text(selection+' Selected');
+ $('#headerName>span.name').text(selection);
+ $('#headerDate').text('');
+ $('th').css({background:'#ddd', fontWeight:'bold'});
}
}
@@ -396,4 +400,4 @@ function getSelectedFiles(property){
}
});
return files;
-}
\ No newline at end of file
+}
diff --git a/files/templates/index.php b/files/templates/index.php
index b0d4f556f4..e0c4fd39c1 100644
--- a/files/templates/index.php
+++ b/files/templates/index.php
@@ -34,8 +34,8 @@
<a href="" title="" class="delete">Delete</a>
</span>
</th>
- <th id='headerSize'><?php echo $l->t( 'Size (MB)' ); ?></th>
- <th><?php echo $l->t( 'Modified' ); ?></th>
+ <th id='headerSize'><?php echo $l->t( 'Size MB' ); ?></th>
+ <th id='headerDate'><?php echo $l->t( 'Modified' ); ?></th>
</tr>
</thead>
<tbody id="fileList">
@@ -43,7 +43,7 @@
</tbody>
</table>
-<div id="uploadsize-message" title="Upload to large">
+<div id="uploadsize-message" title="Upload too large">
<p>
<?php echo $l->t( 'The files you are trying to upload exceed the maximum size for file uploads on this server.' ); ?>
</p>
--
GitLab