nextcloud/apps/files/css/files.css

93 lines
7.7 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* Copyright (c) 2011, Jan-Christoph Borchardt, http://jancborchardt.net
This file is licensed under the Affero General Public License version 3 or later.
See the COPYING-README file. */
/* FILE MENU */
.actions { padding:.3em; float:left; height:2em; width:10em; }
.actions input, .actions button, .actions .button { margin:0; }
#file_menu { right:0; position:absolute; top:0; }
#file_menu a { display:block; float:left; background-image:none; text-decoration:none; }
.file_upload_form, #file_newfolder_form { display:inline; float: left; margin-left:0; }
#fileSelector, #file_upload_submit, #file_newfolder_submit { display:none; }
.file_upload_wrapper, #file_newfolder_name { background-repeat:no-repeat; background-position:.5em .5em; padding-left:2em; }
.file_upload_wrapper { font-weight:bold; display:-moz-inline-box; /* fallback for older firefox versions*/ display:inline-block; padding-left:0; overflow:hidden; position:relative; margin:0;}
.file_upload_wrapper .file_upload_button_wrapper { position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer; z-index:1000; }
#new { float:left; border-top-right-radius:0; border-bottom-right-radius:0; margin:0 0 0 1em; border-right:none; z-index:1010; height:1.3em; }
#new.active { border-bottom-left-radius:0; border-bottom:none; }
#new>a { padding:.5em 1.2em .3em; color:#fff; text-shadow:0 1px 0 #51a351; }
#new>ul { display:none; position:fixed; text-align:left; padding:.5em; background:#f8f8f8; margin-top:0.075em; border:1px solid #ddd; min-width:7em; margin-left:-.5em; z-index:-1; }
#new>ul>li { margin:.3em; padding-left:2em; background-repeat:no-repeat; cursor:pointer; padding-bottom:0.1em }
#new>ul>li>p { cursor:pointer; }
#new>ul>li>input { padding:0.3em; margin:-0.3em; }
#new, .file_upload_filename { background:#5bb75b; border:1px solid; border-color:#51a351 #419341 #387038; -moz-box-shadow:0 1px 1px #f8f8f8, 1px 1px 1px #ada inset; -webkit-box-shadow:0 1px 1px #f8f8f8, 1px 1px 1px #ada inset; box-shadow:0 1px 1px #f8f8f8, 1px 1px 1px #ada inset; }
#new .popup { border-top-left-radius:0; }
#file_newfolder_name { background-image:url('%webroot%/core/img/places/folder.svg'); font-weight:normal; width:7em; }
.file_upload_start, .file_upload_filename { font-size:1em; }
#file_newfolder_submit, #file_upload_submit { width:3em; }
.file_upload_target { display:none; }
.file_upload_start { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0; z-index:1; position:absolute; left:0; top:0; width:100%; cursor:pointer;}
.file_upload_filename.active { border-bottom-right-radius:0 }
.file_upload_filename { z-index:100; padding-left: 0.8em; padding-right: 0.8em; cursor:pointer; border-top-left-radius:0; border-bottom-left-radius:0; }
.file_upload_filename img { position: absolute; top: 0.4em; left: 0.4em; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; }
#upload { position:absolute; right:13.5em; top:0em; }
#upload #uploadprogressbar { position:relative; display:inline-block; width:10em; height:1.5em; top:.4em; }
.file_upload_form, .file_upload_wrapper, .file_upload_start, .file_upload_filename, #file_upload_submit { cursor:pointer; }
/* FILE TABLE */
#emptyfolder { position:absolute; margin:10em 0 0 10em; font-size:1.5em; font-weight:bold; color:#888; text-shadow:#fff 0 1px 0; }
table { 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 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; }
tr:hover span.extension { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; color:#777; }
div.crumb { float:left; display:block; background:no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em; }
div.crumb:first-child { padding-left:1em; }
div.crumb.last { font-weight:bold; }
table tr.mouseOver td { background-color:#eee; }
table th { height:2em; padding:0 .5em; color:#999; }
table th .name { float:left; margin-left:.5em; }
table th.multiselect { background:#ddd; color:#000; font-weight:bold; }
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; background-position:1em .5em; background-repeat:no-repeat; }
table th#headerSize, table td.filesize { width:3em; padding:0 1em; text-align:right; }
table th#headerDate, table td.date { width:11em; padding:0 .1em 0 1em; text-align:left; }
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; }
table tr[data-type="dir"] td.filename a.name span.nametext {font-weight:bold; }
table td.filename a.name input, table td.filename a.name form { width:100%; cursor:text; }
table td.filename a, table td.login, table td.logout, table td.download, table td.upload, table td.create, table td.delete { padding:.2em .5em .5em 0; }
table td.filename .nametext, .uploadtext, .modified { float:left; padding:.3em 0; }
// TODO fix usability bug (accidental file/folder selection)
table td.filename .nametext { width:40em; overflow:hidden; text-overflow:ellipsis; }
table td.filename .uploadtext { font-weight:normal; margin-left:.5em; }
table td.filename form { float:left; font-size:.85em; }
table thead.fixed tr{ position:fixed; top:6.5em; z-index:49; -moz-box-shadow:0 -3px 7px #ddd; -webkit-box-shadow:0 -3px 7px #ddd; box-shadow:0 -3px 7px #ddd; }
table thead.fixed { height:2em; }
#fileList tr td.filename>input[type=checkbox]:first-child { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0; float:left; margin:.7em 0 0 1em; /* bigger clickable area doesnt work in FF width:2.8em; height:2.4em;*/ -webkit-transition:opacity 200ms; -moz-transition:opacity 200ms; -o-transition:opacity 200ms; transition:opacity 200ms; }
#fileList tr td.filename>input[type="checkbox"]:hover:first-child { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=80); opacity:.8; }
#fileList tr td.filename>input[type="checkbox"]:checked:first-child { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; }
#fileList tr td.filename { -webkit-transition:background-image 500ms; -moz-transition:background-image 500ms; -o-transition:background-image 500ms; transition:background-image 500ms; position:relative; }
#select_all { float:left; margin:.3em 0.6em 0 .5em; }
#uploadsize-message,#delete-confirm { display:none; }
.fileactions { position:relative; top:.3em; font-size:.8em; float:right; }
#fileList .fileactions a.action img { position:relative; top:.2em; }
#fileList a.action { display:inline; margin:-.5em 0; padding:1em .5em 1em .5em !important; }
a.action.delete { float:right; }
a.action>img { max-height:16px; max-width:16px; vertical-align:text-bottom; }
.selectedActions { display:none; float:right; }
.selectedActions a { display:inline; margin:-.5em 0; padding:.5em !important; }
.selectedActions a img { position:relative; top:.3em; }
/* add breadcrumb divider to the File item in navigation panel */
#navigation>ul>li:first-child { background:url('%webroot%/core/img/breadcrumb-start.svg') no-repeat 12.5em 0px; width:12.5em; padding-right:1em; position:fixed; }
#navigation>ul>li:first-child+li { padding-top:2.9em; }
#scanning-message{ top:40%; left:40%; position:absolute; display:none; }