diff options
Diffstat (limited to 'apps/files/css/files.css')
| -rw-r--r-- | apps/files/css/files.css | 825 |
1 files changed, 0 insertions, 825 deletions
diff --git a/apps/files/css/files.css b/apps/files/css/files.css deleted file mode 100644 index d20ab102ba5..00000000000 --- a/apps/files/css/files.css +++ /dev/null @@ -1,825 +0,0 @@ -/* 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:5px; height:32px; display: inline-block; float: left; } -.actions input, .actions button, .actions .button { margin:0; float:left; } -.actions .button a { color: #555; } -.actions .button a:hover, -.actions .button a:focus, -.actions .button a:active { - color: #333; -} -.actions.hidden { display: none; } - -.actions.creatable { - position: relative; - z-index: -30; -} - -#trash { - margin-right: 8px; - float: right; - z-index: 1010; - padding: 10px; - font-weight: normal; -} - -.newFileMenu .error, #fileList .error { - color: #e9322d; - border-color: #e9322d; - -webkit-box-shadow: 0 0 6px #f8b9b7; - -moz-box-shadow: 0 0 6px #f8b9b7; - box-shadow: 0 0 6px #f8b9b7; -} - -/* FILE TABLE */ -#filestable { - position: relative; - width: 100%; -} - -#filestable.has-controls { - top: 44px; -} - -/* make sure there's enough room for the file actions */ -#body-user #filestable { - min-width: 688px; /* 768 (mobile break) - 80 (nav width) */ -} -#body-user #controls { - min-width: 688px; /* 768 (mobile break) - 80 (nav width) */ -} - -#filestable tbody tr { - background-color: #fff; - height: 51px; -} - -/* fit app list view heights */ -.app-files #app-content>.viewcontainer { - min-height: 0%; -} - -.app-files #app-content { - overflow-x: hidden; -} - -/* icons for sidebar */ -.nav-icon-files { - background-image: url('../img/folder.svg'); -} -.nav-icon-favorites { - background-image: url('../img/star.svg'); -} -.nav-icon-sharingin, -.nav-icon-sharingout { - background-image: url('../img/share.svg'); -} -.nav-icon-sharinglinks { - background-image: url('../img/public.svg'); -} -.nav-icon-extstoragemounts { - background-image: url('../img/external.svg'); -} -.nav-icon-trashbin { - background-image: url('../img/delete.svg'); -} - -#app-navigation .nav-files a.nav-icon-files { - width: auto; -} -/* button needs overrides due to navigation styles */ -#app-navigation .nav-files a.new { - width: 40px; - height: 32px; - padding: 0 10px; - margin: 0; - cursor: pointer; -} - -#app-navigation .nav-files a.new.hidden { - display: none; -} - -#app-navigation .nav-files a.new.disabled { - opacity: 0.3; -} - -#filestable tbody tr { - background-color: #fff; - height: 40px; -} -#filestable tbody tr:hover, -#filestable tbody tr:focus, -#filestable tbody .name:focus, -#filestable tbody tr:active, -#filestable tbody tr.highlighted, -#filestable tbody tr.highlighted .name:focus, -#filestable tbody tr.selected, -#filestable tbody tr.searchresult, -table tr.mouseOver td { - background-color: #f8f8f8; -} -tbody a { color:#000; } - -span.extension, span.uploading, td.date { - color: #999; -} -span.extension { - -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; - vertical-align: top; -} -tr:hover span.extension, -tr:focus span.extension { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; - filter: alpha(opacity=100); - opacity: 1; - color: #777; -} - -table th, table th a { - color: #999; -} -table.multiselect th a { - color: #000; -} -table th .columntitle { - display: block; - padding: 15px; - height: 50px; - box-sizing: border-box; - -moz-box-sizing: border-box; - vertical-align: middle; -} -table th .columntitle.name { - padding-left: 5px; - padding-right: 80px; - margin-left: 50px; -} - -table th .sort-indicator { - width: 10px; - height: 8px; - margin-left: 5px; - display: inline-block; - vertical-align: text-bottom; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; - filter: alpha(opacity=30); - opacity: .3; -} -.sort-indicator.hidden, -.multiselect .sort-indicator, -table.multiselect th:hover .sort-indicator.hidden, -table.multiselect th:focus .sort-indicator.hidden { - visibility: hidden; -} -.multiselect .sort, .multiselect .sort span { - cursor: default; -} -table th:hover .sort-indicator.hidden, -table th:focus .sort-indicator.hidden { - visibility: visible; -} - -table th, -table td { - border-bottom: 1px solid #eee; - text-align: left; - font-weight: normal; -} -table td { - padding: 0 15px; - font-style: normal; - background-position: 8px center; - background-repeat: no-repeat; -} -table th#headerName { - position: relative; - width: 9999px; /* not really sure why this works better than 100% … table styling */ - padding: 0; -} - -#headerName-container { - position: relative; - height: 50px; -} -.has-favorites #headerName-container { - padding-left: 50px; -} - -table th#headerSize, table td.filesize { - text-align: right; -} -table th#headerDate, table td.date, -table th.column-last, table td.column-last { - -moz-box-sizing: border-box; - box-sizing: border-box; - position: relative; - /* this can not be just width, both need to be set … table styling */ - min-width: 130px; - max-width: 130px; -} - -/* Multiselect bar */ -#filestable.multiselect { - top: 95px; -} -table.multiselect thead { - position: fixed; - top: 89px; - z-index: 10; - -moz-box-sizing: border-box; - box-sizing: border-box; - left: 250px; /* sidebar */ -} - -table thead th { - background-color: #fff; -} -table.multiselect thead th { - background-color: rgba(255, 255, 255, 0.95); /* like controls bar */ - color: #000; - font-weight: bold; - border-bottom: 0; -} - -#app-content.with-app-sidebar table.multiselect thead{ - margin-right: 27%; -} - -table.multiselect #headerName { - position: relative; - width: 9999px; /* when we use 100%, the styling breaks on mobile … table styling */ -} -table.multiselect #modified { - display: none; -} - -table td.selection, -table th.selection, -table td.fileaction { - width: 32px; - text-align: center; -} -table td.filename a.name { - position:relative; /* Firefox needs to explicitly have this default set … */ - -moz-box-sizing: border-box; - box-sizing: border-box; - display: block; - height: 50px; - line-height: 50px; - padding: 0; -} -table td.filename .thumbnail { - display: inline-block; - width: 32px; - height: 32px; - margin-left: 8px; - margin-top: 9px; - cursor: pointer; - float: left; - position: absolute; - z-index: 4; -} -table td.filename input.filename { - width: 70%; - margin-top: 9px; - margin-left: 48px; - cursor: text; -} -.has-favorites table td.filename input.filename { - margin-left: 52px; -} - -table td.filename a, table td.login, table td.logout, table td.download, table td.upload, table td.create, table td.delete { padding:3px 8px 8px 3px; } -table td.filename .nametext, .uploadtext, .modified, .column-last>span:first-child { float:left; padding:15px 0; } - -.modified, .column-last>span:first-child { - position: relative; - overflow: hidden; - text-overflow: ellipsis; - width: 110px; -} - -/* TODO fix usability bug (accidental file/folder selection) */ -table td.filename .nametext { - position: absolute; - left: 55px; - padding: 0; - overflow: hidden; - text-overflow: ellipsis; - max-width: 800px; - height: 100%; -} -.has-favorites #fileList td.filename a.name { - left: 50px; - margin-right: 50px; -} - -table td.filename .nametext .innernametext { - text-overflow: ellipsis; - overflow: hidden; - position: relative; - display: inline-block; - vertical-align: top; -} - -@media only screen and (min-width: 1500px) { - table td.filename .nametext .innernametext { - max-width: 790px; - } - .with-app-sidebar table td.filename .nametext .innernametext { - max-width: 390px; - } -} -@media only screen and (min-width: 1366px) and (max-width: 1500px) { - table td.filename .nametext .innernametext { - max-width: 660px; - } - .with-app-sidebar table td.filename .nametext .innernametext { - max-width: 290px; - } -} -@media only screen and (min-width: 1200px) and (max-width: 1366px) { - table td.filename .nametext .innernametext { - max-width: 500px; - } - .with-app-sidebar table td.filename .nametext .innernametext { - max-width: 230px; - } -} -@media only screen and (min-width: 1100px) and (max-width: 1200px) { - table td.filename .nametext .innernametext { - max-width: 400px; - } - .with-app-sidebar table td.filename .nametext .innernametext { - max-width: 230px; - } -} -@media only screen and (min-width: 1000px) and (max-width: 1100px) { - table td.filename .nametext .innernametext { - max-width: 310px; - } - .with-app-sidebar table td.filename .nametext .innernametext { - max-width: 230px; - } -} -@media only screen and (min-width: 768px) and (max-width: 1000px) { - table td.filename .nametext .innernametext { - max-width: 240px; - } - .with-app-sidebar table td.filename .nametext .innernametext { - max-width: 230px; - } -} - -/* for smaller resolutions - see mobile.css */ - -table td.filename .uploadtext { - font-weight: normal; - margin-left: 55px; - margin-top: 5px; - height: 20px; - padding: 10px 0; - font-size: 11px; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; - filter: alpha(opacity=50); - opacity: .5; -} - -.ie8 input[type="checkbox"]{ - padding: 0; -} - -/* File checkboxes */ -html:not(.ie8) #fileList tr td.filename>.selectCheckBox + label:before { - opacity: 0; - position: absolute; - bottom: 4px; - right: 0; - z-index: 10; -} -html.ie8 #fileList tr td.filename>.selectCheckBox { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - opacity: 0; - float: left; - top: 0; - margin: 32px 0 4px 32px; /* bigger clickable area doesn’t work in FF width:2.8em; height:2.4em;*/ -} - -/* Show checkbox when hovering, checked, or selected */ -html.ie8 #fileList tr:hover td.filename>.selectCheckBox, -html.ie8 #fileList tr:focus td.filename>.selectCheckBox, -html.ie8 #fileList tr td.filename>.selectCheckBox:checked, -html.ie8 #fileList tr.selected td.filename>.selectCheckBox, -html:not(.ie8) #fileList tr:hover td.filename>.selectCheckBox + label:before, -html:not(.ie8) #fileList tr:focus td.filename>.selectCheckBox + label:before, -html:not(.ie8) #fileList tr td.filename>.selectCheckBox:checked + label:before, -html:not(.ie8) #fileList tr.selected td.filename>.selectCheckBox + label:before { - opacity: 1; -} -html.ie8 #fileList tr:hover td.filename>.selectCheckBox, -html.ie8 #fileList tr:focus td.filename>.selectCheckBox, -html.ie8 #fileList tr td.filename>.selectCheckBox[checked=checked], -html.ie8 #fileList tr.selected td.filename>.selectCheckBox { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; - filter: alpha(opacity=100); -} - -/* Use label to have bigger clickable size for checkbox */ -#fileList tr td.filename>.selectCheckBox + label, -.select-all + label { - background-position: 30px 30px; - height: 50px; - position: absolute; - width: 50px; - z-index: 5; -} -#fileList tr td.filename>.selectCheckBox { - /* sometimes checkbox height is bigger (KDE/Qt), so setting to absolute - * to prevent it to increase the height */ - position: absolute; - z-index: 10; -} -.select-all + label { - top: 0; -} -.ie8 .select-all, -.select-all + label:before { - position: absolute; - top: 18px; - left: 18px; - z-index: 10; -} -.has-favorites .select-all { - left: 68px; -} - -#fileList tr td.filename { - position: relative; - width: 100%; - padding-left: 0; - padding-right:0; - -webkit-transition:background-image 500ms; -moz-transition:background-image 500ms; -o-transition:background-image 500ms; transition:background-image 500ms; -} - -#fileList tr td.filename a.name label { - position: absolute; - width: 80%; - height: 50px; -} - -#fileList tr td.filename .favorite { - display: inline-block; - float: left; -} -#fileList tr td.filename .action-favorite { - display: block; - float: left; - width: 30px; - line-height: 100%; - text-align: center; -} - -#uploadsize-message,#delete-confirm { display:none; } - -/* File actions */ -.fileactions { - position: absolute; - right: 0; -} - -.busy .fileactions, .busy .action { - visibility: hidden; -} - -/* fix position of bubble pointer for Files app */ -.bubble, -#app-navigation .app-navigation-entry-menu { - border-top-right-radius: 3px; -} -.bubble:after, -#app-navigation .app-navigation-entry-menu:after { - right: 6px; -} -.bubble:before, -#app-navigation .app-navigation-entry-menu:before { - right: 6px; -} - -/* force show the loading icon, not only on hover */ -#fileList .icon-loading-small { - -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; - filter:alpha(opacity=100); - opacity: 1 !important; - display: inline !important; -} - -#fileList img.move2trash { display:inline; margin:-8px 0; padding:16px 8px 16px 8px !important; float:right; } - -#fileList .action.action-share-notification span, #fileList a.name { - cursor: default !important; -} - -a.action > img { - height: 16px; - width: 16px; - vertical-align: text-bottom; -} - -/* Actions for selected files */ -.selectedActions { - position: absolute; - top: 0; - right: 0; -} -.selectedActions a { - display: inline; - font-size: 11px; - line-height: 50px; - padding: 18px 5px; -} -.selectedActions a.delete-selected { - padding-right: 15px; -} -.selectedActions a.hidden { - display: none; -} -.selectedActions a img { - position:relative; - vertical-align: text-bottom; - margin-bottom: -1px; -} - -html.ie8 .column-mtime .selectedActions { - top: -95px; -} - -#fileList a.action { - display: inline; - padding: 17px 8px; - line-height: 50px; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - opacity: 0; - display:none; -} -#fileList a.action.action-share { - padding: 17px 14px; -} - -#fileList a.action.action-menu { - padding-top: 17px; - padding-bottom: 17px; - padding-left:14px; - padding-right:0px; -} - -#fileList .filesize { - padding-top:0px; - padding-bottom:0px; - padding-left:60px; - padding-right:15px; -} - -#fileList .popovermenu { - margin-right: -5px; -} -.ie8 #fileList .popovermenu { - margin-top: -10px; -} - -.ie8 #fileList a.action img, -#fileList tr:hover a.action, -#fileList a.action.permanent, -#fileList tr:focus a.action, -#fileList a.action.permanent, -#fileList tr:hover a.action.no-permission:hover, -#fileList tr:focus a.action.no-permission:focus, -/*#fileList .name:focus .action,*/ -/* also enforce the low opacity for disabled links that are hovered/focused */ -.ie8 #fileList a.action.disabled:hover img, -#fileList tr:hover a.action.disabled:hover, -#fileList tr:focus a.action.disabled:focus, -#fileList .name:focus a.action.disabled:focus, -#fileList a.action.disabled img { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; - filter: alpha(opacity=30); - opacity: .3; - display:inline; -} -.ie8 #fileList a.action:hover img, -#fileList tr a.action.disabled.action-download, -#fileList tr:hover a.action.disabled.action-download:hover, -#fileList tr:focus a.action.disabled.action-download:focus, -#fileList tr:hover a.action:hover, -#fileList tr:focus a.action:focus, -#fileList .name:focus a.action:focus { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; - filter: alpha(opacity=70); - opacity: 7; - display:inline; -} -#fileList tr a.action.disabled { - background: none; -} - -/* show share action of shared items darker to distinguish from non-shared */ -#fileList a.action.permanent.shared-style, -#fileList a.action.action-favorite.permanent { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)" !important; - filter: alpha(opacity=70) !important; - opacity: .7 !important; -} -/* always show actions on mobile, not only on hover */ -#fileList a.action.action-menu.permanent { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)" !important; - filter: alpha(opacity=30) !important; - opacity: .3 !important; - display: inline !important; -} - -/* properly display actions in the popover menu */ -#fileList .popovermenu .action { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)" !important; - filter: alpha(opacity=50) !important; - opacity: .5 !important; -} -#fileList .popovermenu .action:hover, -#fileList .popovermenu .action:focus { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important; - filter: alpha(opacity=100) !important; - opacity: 1 !important; -} - - -#selectedActionsList a.download.disabled, -#fileList tr a.action.action-download.disabled { - color: #000000; -} - -#fileList tr:hover a.action.disabled:hover * { - cursor: default; -} - -.summary { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; - filter: alpha(opacity=30); - opacity: .3; - /* add whitespace to bottom of files list to correctly show dropdowns */ - height: 300px; -} -.summary:hover, -.summary:focus, -.summary, -table tr.summary td { - background-color: transparent; -} -.summary td { - border-bottom: none; - vertical-align: top; - padding-top: 20px; -} -.summary .info { - margin-left: 40px; -} -.has-favorites .summary .info { - margin-left: 90px; -} - -table.dragshadow { - width:auto; -} -table.dragshadow td.filename { - padding-left:60px; - padding-right:16px; - height: 36px; -} -table.dragshadow td.size { - padding-right:8px; -} -#upgrade { - width: 400px; - position: absolute; - top: 200px; - left: 50%; - text-align: center; - margin-left: -200px; -} -.mask { - z-index: 50; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-color: #fff; - background-repeat: no-repeat no-repeat; - background-position: 50%; - opacity: 0.7; - filter: alpha(opacity=70); - transition: opacity 100ms; - -moz-transition: opacity 100ms; - -o-transition: opacity 100ms; - -ms-transition: opacity 100ms; - -webkit-transition: opacity 100ms; -} -.mask.transparent{ - opacity: 0; -} - -#fileList .popovermenu a.action img { - padding: initial; -} - -#fileList .popovermenu a.action { - padding: 10px; - margin: -10px; -} - -html.ie8 #controls .button.new { - padding-right: 0; -} - -.newFileMenu { - width: 140px; - margin-left: -56px; - margin-top: 25px; - z-index: 1001; -} - -.newFileMenu .menuitem { - white-space: nowrap; - overflow: hidden; -} -.newFileMenu.popovermenu a.menuitem, -.newFileMenu.popovermenu label.menuitem, -.newFileMenu.popovermenu .menuitem { - padding: 0; - margin: 0; -} - -.newFileMenu.popovermenu a.menuitem.active { - opacity: 1; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; - filter: alpha(opacity=100); -} - -.newFileMenu.bubble:after { - left: 75px; - right: auto; -} -.newFileMenu.bubble:before { - left: 75px; - right: auto; -} - -.newFileMenu .filenameform { - display: inline-block; -} - -.newFileMenu .filenameform input { - width: 100px; -} - -#fileList .popovermenu .action { - display: block; - line-height: 30px; - padding-left: 5px; - color: #000; - padding: 0; -} - -#filestable .filename .action .icon, -#filestable .selectedActions a .icon, -#controls .actions .button .icon { - display: inline-block; - vertical-align: middle; - background-size: 16px 16px; -} - -#filestable .filename .action .icon.hidden, -#filestable .selectedActions a .icon.hidden, -#controls .actions .button .icon.hidden { - display: none; -} - -#filestable .filename .action .icon.loading, -#filestable .selectedActions a .icon.loading, -#controls .actions .button .icon.loading { - width: 15px; - height: 15px; -} - -.app-files .actions .button.new .icon { - margin-bottom: 2px; -} |