Jan-Christoph Borchardt
commit
d2773982d5
|
|
@ -63,8 +63,12 @@
|
|||
}
|
||||
#filestable { position: relative; top:37px; width:100%; }
|
||||
tbody tr { background-color:#fff; height:2.5em; }
|
||||
tbody tr:hover, tbody tr:active, tbody tr.selected { background-color:#f8f8f8; }
|
||||
tbody tr.selected { background-color:#eee; }
|
||||
tbody tr:hover, tbody tr:active {
|
||||
background-color: rgb(240,240,240);
|
||||
}
|
||||
tbody tr.selected {
|
||||
background-color: rgb(230,230,230);
|
||||
}
|
||||
tbody a { color:#000; }
|
||||
span.extension, span.uploading, td.date { color:#999; }
|
||||
span.extension { text-transform:lowercase; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70); opacity:.7; -webkit-transition:opacity 300ms; -moz-transition:opacity 300ms; -o-transition:opacity 300ms; transition:opacity 300ms; }
|
||||
|
|
@ -81,7 +85,12 @@ table th#headerDate, table td.date { min-width:11em; padding:0 .1em 0 1em; text-
|
|||
/* Multiselect bar */
|
||||
#filestable.multiselect { top:63px; }
|
||||
table.multiselect thead { position:fixed; top:82px; z-index:1; -moz-box-sizing: border-box; box-sizing: border-box; left: 0; padding-left: 64px; width:100%; }
|
||||
table.multiselect thead th { background:rgba(230,230,230,.8); color:#000; font-weight:bold; border-bottom:0; }
|
||||
table.multiselect thead th {
|
||||
background-color: rgba(210,210,210,.7);
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
border-bottom: 0;
|
||||
}
|
||||
table.multiselect #headerName { width: 100%; }
|
||||
table td.selection, table th.selection, table td.fileaction { width:2em; text-align:center; }
|
||||
table td.filename a.name { display:block; height:1.5em; vertical-align:middle; margin-left:3em; }
|
||||
|
|
@ -115,10 +124,12 @@ table td.filename form { font-size:.85em; margin-left:3em; margin-right:3em; }
|
|||
}
|
||||
#fileList .name { position:relative; /* Firefox needs to explicitly have this default set … */ }
|
||||
#fileList tr:hover .fileactions { /* background to distinguish when overlaying with file names */
|
||||
background:rgba(248,248,248,.9); box-shadow:-5px 0 7px rgba(248,248,248,.9);
|
||||
background-color: rgba(240,240,240,0.898);
|
||||
box-shadow: -5px 0 7px rgba(240,240,240,0.898);
|
||||
}
|
||||
#fileList tr.selected:hover .fileactions, #fileList tr.mouseOver .fileactions { /* slightly darker color for selected rows */
|
||||
background:rgba(238,238,238,.9); box-shadow:-5px 0 7px rgba(238,238,238,.9);
|
||||
background-color: rgba(230,230,230,.9);
|
||||
box-shadow: -5px 0 7px rgba(230,230,230,.9);
|
||||
}
|
||||
#fileList .fileactions a.action img { position:relative; top:.2em; }
|
||||
#fileList a.action { display:inline; margin:-.5em 0; padding:1em .5em 1em .5em !important; }
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@ var FileList={
|
|||
}else{
|
||||
simpleSize=t('files', 'Pending');
|
||||
}
|
||||
var sizeColor = Math.round(200-Math.pow((size/(1024*1024)),2));
|
||||
var sizeColor = Math.round(160-Math.pow((size/(1024*1024)),2));
|
||||
var lastModifiedTime = Math.round(lastModified.getTime() / 1000);
|
||||
td = $('<td></td>').attr({
|
||||
"class": "filesize",
|
||||
|
|
|
|||
|
|
@ -3,12 +3,12 @@
|
|||
<?php foreach($_['files'] as $file):
|
||||
$simple_file_size = OCP\simple_file_size($file['size']);
|
||||
// the bigger the file, the darker the shade of grey; megabytes*2
|
||||
$simple_size_color = intval(200-$file['size']/(1024*1024)*2);
|
||||
$simple_size_color = intval(160-$file['size']/(1024*1024)*2);
|
||||
if($simple_size_color<0) $simple_size_color = 0;
|
||||
$relative_modified_date = OCP\relative_modified_date($file['mtime']);
|
||||
// the older the file, the brighter the shade of grey; days*14
|
||||
$relative_date_color = round((time()-$file['mtime'])/60/60/24*14);
|
||||
if($relative_date_color>200) $relative_date_color = 200;
|
||||
if($relative_date_color>160) $relative_date_color = 160;
|
||||
$name = rawurlencode($file['name']);
|
||||
$name = str_replace('%2F', '/', $name);
|
||||
$directory = rawurlencode($file['directory']);
|
||||
|
|
|
|||
|
|
@ -141,7 +141,7 @@ input[type="submit"].enabled { background:#66f866; border:1px solid #5e5; -moz-b
|
|||
padding:0 70px 0 0.5em; margin:0;
|
||||
-moz-box-sizing:border-box; box-sizing:border-box;
|
||||
-moz-box-shadow:0 -3px 7px #000; -webkit-box-shadow:0 -3px 7px #000; box-shadow:0 -3px 7px #000;
|
||||
background:#f7f7f7; border-bottom:1px solid #eee; z-index:50;
|
||||
background:#eee; border-bottom:1px solid #e7e7e7; z-index:50;
|
||||
}
|
||||
#controls .button { display:inline-block; }
|
||||
|
||||
|
|
@ -355,14 +355,27 @@ tr .action { width:16px; height:16px; }
|
|||
tr:hover .action:hover, .selectedActions a:hover, .header-action:hover { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; }
|
||||
tbody tr:hover, tr:active { background-color:#f8f8f8; }
|
||||
|
||||
#body-settings .personalblock, #body-settings .helpblock { padding:.5em 1em; margin:1em; background:#f8f8f8; color:#555; text-shadow:#fff 0 1px 0; -moz-border-radius:.5em; -webkit-border-radius:.5em; border-radius:.5em; }
|
||||
#body-settings .personalblock, #body-settings .helpblock {
|
||||
padding: .5em 1em;
|
||||
margin: 1em;
|
||||
background-color: rgb(240,240,240);
|
||||
color: #555;
|
||||
text-shadow: #fff 0 1px 0;
|
||||
-moz-border-radius: .5em; -webkit-border-radius: .5em; border-radius: .5em;
|
||||
}
|
||||
#body-settings .personalblock#quota { position:relative; padding:0; }
|
||||
#body-settings #controls+.helpblock { position:relative; margin-top:3em; }
|
||||
.personalblock > legend { margin-top:2em; }
|
||||
.personalblock > legend, th, dt, label { font-weight:bold; }
|
||||
code { font-family:"Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", monospace; }
|
||||
|
||||
#quota div, div.jp-play-bar, div.jp-seek-bar { padding:0; background:#e6e6e6; font-weight:normal; white-space:nowrap; -moz-border-radius-bottomleft:.4em; -webkit-border-bottom-left-radius:.4em; border-bottom-left-radius:.4em; -moz-border-radius-topleft:.4em; -webkit-border-top-left-radius:.4em; border-top-left-radius:.4em; }
|
||||
#quota div, div.jp-play-bar, div.jp-seek-bar {
|
||||
padding: 0;
|
||||
background-color: rgb(220,220,220);
|
||||
font-weight: normal;
|
||||
white-space: nowrap;
|
||||
-moz-border-radius-bottomleft: .4em; -webkit-border-bottom-left-radius: .4em; border-bottom-left-radius:.4em;
|
||||
-moz-border-radius-topleft: .4em; -webkit-border-top-left-radius: .4em; border-top-left-radius: .4em; }
|
||||
#quotatext {padding:.6em 1em;}
|
||||
div.jp-play-bar, div.jp-seek-bar { padding:0; }
|
||||
|
||||
|
|
@ -427,12 +440,22 @@ span.ui-icon {float: left; margin: 3px 7px 30px 0;}
|
|||
.help-includes {overflow: hidden; width: 100%; height: 100%; -moz-box-sizing: border-box; box-sizing: border-box; padding-top: 2.8em; }
|
||||
.help-iframe {width: 100%; height: 100%; margin: 0;padding: 0; border: 0; overflow: auto;}
|
||||
|
||||
|
||||
/* ---- BREADCRUMB ---- */
|
||||
div.crumb { float:left; display:block; background:url('../img/breadcrumb.svg') no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em; -moz-box-sizing:border-box; box-sizing:border-box; }
|
||||
div.crumb:first-child { padding:10px 20px 10px 5px; }
|
||||
div.crumb.last { font-weight:bold; background:none; padding-right:10px; }
|
||||
div.crumb a{ padding: 0.9em 0 0.7em 0; }
|
||||
|
||||
/* some feedback for hover/tap on breadcrumbs */
|
||||
div.crumb:hover,
|
||||
div.crumb:focus,
|
||||
div.crumb:active {
|
||||
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
|
||||
filter:alpha(opacity=70);
|
||||
opacity:.7;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* ---- APP STYLING ---- */
|
||||
|
|
|
|||
Loading…
Reference in New Issue