diff options
Diffstat (limited to 'apps/files')
26 files changed, 634 insertions, 657 deletions
diff --git a/apps/files/css/files.css b/apps/files/css/files.css index 83ad47713f4..ec7733ac6a4 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -111,13 +111,13 @@ .newFileMenu .error, .newFileMenu .error + .icon-confirm, -#fileList .error { +.files-fileList .error { color: var(--color-error); border-color: var(--color-error); } /* FILE TABLE */ -#filestable { +.files-filestable { position: relative; width: 100%; min-width: 250px; @@ -127,10 +127,10 @@ * This is a dirty hack as the sticky header requires us to use a different display type on the table element */ } -#emptycontent:not(.hidden) ~ #filestable { +.emptycontent:not(.hidden) ~ .files-filestable { display: none; } -#filestable thead { +.files-filestable thead { position: -webkit-sticky; position: sticky; top: 50px; @@ -138,20 +138,20 @@ display: block; background-color: var(--color-main-background-translucent); } -#filestable tbody { +.files-filestable tbody { display: table; width: 100%; } -#filestable tbody tr[data-permissions="0"], -#filestable tbody tr[data-permissions="16"] { +.files-filestable tbody tr[data-permissions="0"], +.files-filestable tbody tr[data-permissions="16"] { background-color: var(--color-background-dark); } -#filestable tbody tr[data-permissions="0"] td.filename .nametext .innernametext, -#filestable tbody tr[data-permissions="16"] td.filename .nametext .innernametext { +.files-filestable tbody tr[data-permissions="0"] td.filename .nametext .innernametext, +.files-filestable tbody tr[data-permissions="16"] td.filename .nametext .innernametext { color: var(--color-text-maxcontrast); } -#filestable.hidden { +.files-filestable.hidden { display: none; } @@ -165,7 +165,7 @@ width: calc(100% - 300px); } -.file-drag, .file-drag #filestable tbody tr, .file-drag #filestable tbody tr:hover { +.file-drag, .file-drag .files-filestable tbody tr, .file-drag .files-filestable tbody tr:hover { background-color: var(--color-primary-light) !important; } @@ -173,11 +173,11 @@ background-color: var(--color-main-background) !important; } -.file-drag #filestable tbody tr, .file-drag #filestable tbody tr:hover { +.file-drag .files-filestable tbody tr, .file-drag .files-filestable tbody tr:hover { background-color: transparent !important; } -.app-files #app-content.dir-drop #filestable tbody tr.dropping-to-dir { +.app-files #app-content.dir-drop .files-filestable tbody tr.dropping-to-dir { background-color: var(--color-primary-light) !important; } @@ -256,23 +256,23 @@ opacity: 0.3; } -#filestable tbody tr { +.files-filestable tbody tr { height: 51px; } -#filestable tbody tr:hover, -#filestable tbody tr:focus, -#filestable tbody .name:focus, -#filestable tbody tr:hover .filename form, +.files-filestable tbody tr:hover, +.files-filestable tbody tr:focus, +.files-filestable tbody .name:focus, +.files-filestable tbody tr:hover .filename form, table tr.mouseOver td { background-color: var(--color-background-hover); } -#filestable tbody tr:active, -#filestable tbody tr.highlighted, -#filestable tbody tr.highlighted .name:focus, -#filestable tbody tr.selected, -#filestable tbody tr.searchresult { +.files-filestable tbody tr:active, +.files-filestable tbody tr.highlighted, +.files-filestable tbody tr.highlighted .name:focus, +.files-filestable tbody tr.selected, +.files-filestable tbody tr.searchresult { background-color: var(--color-primary-light); } @@ -373,27 +373,27 @@ table td { background-repeat: no-repeat; } -table th#headerName { +table th.column-name { position: relative; width: 9999px; /* not really sure why this works better than 100% … table styling */ padding: 0; } -#headerName-container { +.column-name-container { position: relative; height: 50px; } -table th#headerSelection { +table th.column-selection { padding-top: 2px; } -table th#headerSize, table td.filesize { +table th.column-size, table td.filesize { text-align: right; } -table th#headerDate, table td.date, +table th.column-mtime, table td.date, table th.column-last, table td.column-last { -moz-box-sizing: border-box; box-sizing: border-box; @@ -428,13 +428,13 @@ table.multiselect thead th { margin-right: 27%; } -table.multiselect #headerName { +table.multiselect .column-name { position: relative; width: 9999px; /* when we use 100%, the styling breaks on mobile … table styling */ } -table.multiselect #modified { +table.multiselect .column-mtime > a { display: none; } @@ -537,19 +537,19 @@ table td.filename .nametext { padding: 0 20px 0 0; } -.hide-hidden-files #filestable #fileList tr.hidden-file, -.hide-hidden-files #filestable #fileList tr.hidden-file.dragging { +.hide-hidden-files .files-filestable .files-fileList tr.hidden-file, +.hide-hidden-files .files-filestable .files-fileList tr.hidden-file.dragging { display: none; } -#fileList tr.animate-opacity { +.files-fileList tr.animate-opacity { -webkit-transition: opacity 250ms; -moz-transition: opacity 250ms; -o-transition: opacity 250ms; transition: opacity 250ms; } -#fileList tr.dragging { +.files-fileList tr.dragging { opacity: 0.2; } @@ -582,30 +582,30 @@ table td.selection { } /* File checkboxes */ -#fileList tr td.selection > .selectCheckBox + label:before { +.files-fileList tr td.selection > .selectCheckBox + label:before { opacity: 0.3; margin-right: 0; } /* Show checkbox with full opacity when hovering, checked, or selected */ -#fileList tr:hover td.selection > .selectCheckBox + label:before, -#fileList tr:focus td.selection > .selectCheckBox + label:before, -#fileList tr td.selection > .selectCheckBox:checked + label:before, -#fileList tr.selected td.selection > .selectCheckBox + label:before { +.files-fileList tr:hover td.selection > .selectCheckBox + label:before, +.files-fileList tr:focus td.selection > .selectCheckBox + label:before, +.files-fileList tr td.selection > .selectCheckBox:checked + label:before, +.files-fileList tr.selected td.selection > .selectCheckBox + label:before { opacity: 1; } /* Show checkbox with half opacity when selecting range */ -#fileList tr.halfselected td.selection > .selectCheckBox + label:before { +.files-fileList tr.halfselected td.selection > .selectCheckBox + label:before { opacity: 0.5; } /* Use label to have bigger clickable size for checkbox */ -#fileList tr td.selection > .selectCheckBox + label, +.files-fileList tr td.selection > .selectCheckBox + label, .select-all + label { padding: 16px; } -#fileList tr td.selection > .selectCheckBox:focus + label, +.files-fileList tr td.selection > .selectCheckBox:focus + label, .select-all:focus + label { background-color: var(--color-background-hover); border-radius: var(--border-radius-pill); @@ -614,12 +614,12 @@ table td.selection { padding: 14px; } -#fileList tr td.selection > .selectCheckBox:focus-visible + label, +.files-fileList tr td.selection > .selectCheckBox:focus-visible + label, .select-all:focus-visible + label { outline-offset: 0px; } -#fileList tr td.filename { +.files-fileList tr td.filename { position: relative; width: 100%; padding-left: 0; @@ -630,19 +630,19 @@ table td.selection { transition: background-image 500ms; } -#fileList tr td.filename a.name label, -#fileList tr td.filename p.name label { +.files-fileList tr td.filename a.name label, +.files-fileList tr td.filename p.name label { position: absolute; width: 80%; height: 50px; } -#fileList tr td.filename .favorite { +.files-fileList tr td.filename .favorite { display: inline-block; float: left; } -#fileList tr td.filename .favorite-mark { +.files-fileList tr td.filename .favorite-mark { position: absolute; display: block; top: -6px; @@ -672,25 +672,25 @@ table td.selection { } /* force show the loading icon, not only on hover */ -#fileList .icon-loading-small { +.files-fileList .icon-loading-small { opacity: 1 !important; display: inline !important; } -#fileList .action.action-share-notification span, #fileList a.name { +.files-fileList .action.action-share-notification span, .files-fileList a.name { cursor: default !important; } /* * Make the disabled link look not like a link in file list rows */ -#fileList a.name.disabled * { +.files-fileList a.name.disabled * { cursor: default; } -#fileList a.name.disabled a, #fileList a.name.disabled a * { +.files-fileList a.name.disabled a, .files-fileList a.name.disabled a * { cursor: pointer; } -#fileList a.name.disabled:focus { +.files-fileList a.name.disabled:focus { background: none; } @@ -731,16 +731,16 @@ a.action > img { margin-top: -3px; } -#fileList td a a.action { +.files-fileList td a a.action { display: inline; padding: 17px 8px; line-height: 50px; opacity: 0.3; } -#fileList td a a.action.action-share { +.files-fileList td a a.action.action-share { padding: 17px 14px; } -#fileList td a a.action.action-share.permanent:not(.shared-style) .icon-shared + span { +.files-fileList td a a.action.action-share.permanent:not(.shared-style) .icon-shared + span { /* hide text of the share action */ /* .hidden-visually for accessbility */ position: absolute; @@ -750,44 +750,44 @@ a.action > img { height: 1px; overflow: hidden; } -#fileList td a a.action.action-share .avatar { +.files-fileList td a a.action.action-share .avatar { display: inline-block; vertical-align: middle; } -#fileList td a a.action.action-menu { +.files-fileList td a a.action.action-menu { padding-top: 17px; padding-bottom: 17px; padding-left: 14px; padding-right: 14px; } -#fileList td a a.action.no-permission:hover, #fileList td a a.action.no-permission:focus { +.files-fileList td a a.action.no-permission:hover, .files-fileList td a a.action.no-permission:focus { opacity: 0.3; } -#fileList td a a.action.disabled:hover, #fileList td a a.action.disabled:focus, -#fileList td a a.action.disabled img { +.files-fileList td a a.action.disabled:hover, .files-fileList td a a.action.disabled:focus, +.files-fileList td a a.action.disabled img { opacity: 0.3; } -#fileList td a a.action.disabled.action-download { +.files-fileList td a a.action.disabled.action-download { opacity: 0.7; } -#fileList td a a.action.disabled.action-download:hover, #fileList td a a.action.disabled.action-download:focus { +.files-fileList td a a.action.disabled.action-download:hover, .files-fileList td a a.action.disabled.action-download:focus { opacity: 0.7; } -#fileList td a a.action:hover, #fileList td a a.action:focus { +.files-fileList td a a.action:hover, .files-fileList td a a.action:focus { opacity: 1; } -#fileList td a a.action:focus { +.files-fileList td a a.action:focus { background-color: var(--color-background-hover); border-radius: var(--border-radius-pill); } -#fileList td a .fileActionsMenu a.action, #fileList td a a.action.action-share.shared-style { +.files-fileList td a .fileActionsMenu a.action, .files-fileList td a a.action.action-share.shared-style { opacity: 0.7; } -#fileList td a .fileActionsMenu .action.permanent { +.files-fileList td a .fileActionsMenu .action.permanent { opacity: 1; } -#fileList .action.action-share.permanent.shared-style span:not(.icon) { +.files-fileList .action.action-share.permanent.shared-style span:not(.icon) { display: inline-block; max-width: 70px; overflow: hidden; @@ -796,31 +796,31 @@ a.action > img { margin-left: 6px; } -#fileList .remoteAddress .userDomain { +.files-fileList .remoteAddress .userDomain { margin-left: 0 !important; } -#fileList .favorite-mark.permanent { +.files-fileList .favorite-mark.permanent { opacity: 1; } -#fileList .fileActionsMenu a.action:hover, -#fileList .fileActionsMenu a.action:focus, -#fileList a.action.action-share.shared-style:hover, -#fileList a.action.action-share.shared-style:focus { +.files-fileList .fileActionsMenu a.action:hover, +.files-fileList .fileActionsMenu a.action:focus, +.files-fileList a.action.action-share.shared-style:hover, +.files-fileList a.action.action-share.shared-style:focus { opacity: 1; } -#fileList tr a.action.disabled { +.files-fileList tr a.action.disabled { background: none; } -#selectedActionsList a.download.disabled, -#fileList tr a.action.action-download.disabled { +.selectedActions a.download.disabled, +.files-fileList tr a.action.action-download.disabled { color: #000000; } -#fileList tr:hover a.action.disabled:hover * { +.files-fileList tr:hover a.action.disabled:hover * { cursor: default; } @@ -830,7 +830,7 @@ a.action > img { height: 330px; } -#filestable .filesummary { +.files-filestable .summary .filesummary { width: 100%; /* Width of checkbox and file preview */ padding-left: 101px; @@ -916,32 +916,32 @@ table.dragshadow td.size { left: 57px !important; } -#filestable .filename .action .icon, -#filestable .selectedActions a .icon, -#filestable .filename .favorite-mark .icon, -#controls .actions .button .icon { +.files-filestable .filename .action .icon, +.files-filestable .selectedActions a .icon, +.files-filestable .filename .favorite-mark .icon, +.files-controls .actions .button .icon { display: inline-block; vertical-align: middle; background-size: 16px 16px; } -#filestable .filename .favorite-mark .icon-star { +.files-filestable .filename .favorite-mark .icon-star { background-image: none; } -#filestable .filename .favorite-mark .icon-starred { +.files-filestable .filename .favorite-mark .icon-starred { /* $dir is the app name, so we add this to the icon var to avoid conflicts between apps */ background-image: var(--icon-star-dark-yellow); } -#filestable .filename .action .icon.hidden, -#filestable .selectedActions a .icon.hidden, -#controls .actions .button .icon.hidden { +.files-filestable .filename .action .icon.hidden, +.files-filestable .selectedActions a .icon.hidden, +.files-controls .actions .button .icon.hidden { display: none; } -#filestable .filename .action .icon.loading, -#filestable .selectedActions a .icon.loading, -#controls .actions .button .icon.loading { +.files-filestable .filename .action .icon.loading, +.files-filestable .selectedActions a .icon.loading, +.files-controls .actions .button .icon.loading { width: 15px; height: 15px; } @@ -955,7 +955,7 @@ table.dragshadow td.size { } .breadcrumb .canDrop > a, -#filestable tbody tr.canDrop { +.files-filestable tbody tr.canDrop { background-color: rgba(0, 130, 201, 0.3); } @@ -1006,62 +1006,62 @@ table.dragshadow td.size { } /* GRID */ -#filestable.view-grid:not(.hidden) { +.files-filestable.view-grid:not(.hidden) { /* HEADER and MULTISELECT */ /* MAIN FILE LIST */ /* Center align the footer file number & size summary */ } -#filestable.view-grid:not(.hidden) thead tr { +.files-filestable.view-grid:not(.hidden) thead tr { display: block; border-bottom: 1px solid var(--color-border); background-color: var(--color-main-background-translucent); } -#filestable.view-grid:not(.hidden) thead tr th { +.files-filestable.view-grid:not(.hidden) thead tr th { width: auto; border: none; } -#filestable.view-grid:not(.hidden) tbody { +.files-filestable.view-grid:not(.hidden) tbody { display: grid; grid-template-columns: repeat(auto-fill, 160px); justify-content: space-around; row-gap: 15px; margin: 15px 0; } -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) { +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) { display: block; position: relative; height: 190px; border-radius: var(--border-radius); } -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted { +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted { background-color: transparent; } -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .fileactions, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .fileactions { +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .fileactions, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .fileactions { background-color: var(--color-background-hover); } -#filestable.view-grid:not(.hidden) tbody td { +.files-filestable.view-grid:not(.hidden) tbody td { display: inline; border-bottom: none; /* No space for filesize and date in grid view */ /* Position actions menu below file */ } -#filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper { +.files-filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper { min-width: 0; max-width: none; position: absolute; @@ -1072,7 +1072,7 @@ table.dragshadow td.size { left: 0; z-index: -1; } -#filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail { +.files-filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail { width: calc(100% - 2 * 14px); height: calc(100% - 2 * 14px); background-size: contain; @@ -1084,13 +1084,13 @@ table.dragshadow td.size { * Position is inherited from the selection while in grid view */ } -#filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail .favorite-mark { +.files-filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail .favorite-mark { padding: 14px; left: auto; top: -22px; right: -22px; } -#filestable.view-grid:not(.hidden) tbody td.filename .uploadtext { +.files-filestable.view-grid:not(.hidden) tbody td.filename .uploadtext { width: 100%; margin: 0; top: 0; @@ -1099,13 +1099,13 @@ table.dragshadow td.size { padding-top: 4px; padding-left: 28px; } -#filestable.view-grid:not(.hidden) tbody td.filename .name { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name { height: 100%; border-radius: var(--border-radius); overflow: hidden; cursor: pointer !important; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext { display: flex; height: 44px; margin-top: 146px; @@ -1114,27 +1114,27 @@ table.dragshadow td.size { padding: 0; /* No space for extension in grid view */ } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { display: inline-block; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:before { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:before { content: ""; flex: 1; min-width: 14px; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:after { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:after { content: ""; flex: 1; min-width: 44px; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .extension { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .extension { display: none; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions { height: initial; margin-top: 146px; display: flex; @@ -1142,7 +1142,7 @@ table.dragshadow td.size { position: absolute; right: 0; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action { padding: 14px; width: 44px; height: 44px; @@ -1150,34 +1150,34 @@ table.dragshadow td.size { align-items: center; justify-content: center; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action:not(.action-menu) { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action:not(.action-menu) { display: none; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden { display: block !important; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden .action-share img { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden .action-share img { padding: 6px; border-radius: 50%; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-restore-container.hidden { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-restore-container.hidden { display: block !important; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-comment-container.hidden { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-comment-container.hidden { display: block !important; } -#filestable.view-grid:not(.hidden) tbody td.filename form { +.files-filestable.view-grid:not(.hidden) tbody td.filename form { padding: 3px 14px; border-radius: var(--border-radius); } -#filestable.view-grid:not(.hidden) tbody td.filename form input.filename { +.files-filestable.view-grid:not(.hidden) tbody td.filename form input.filename { width: 100%; margin-left: 0; } -#filestable.view-grid:not(.hidden) tbody td.filesize, #filestable.view-grid:not(.hidden) tbody td.date { +.files-filestable.view-grid:not(.hidden) tbody td.filesize, .files-filestable.view-grid:not(.hidden) tbody td.date { display: none; } -#filestable.view-grid:not(.hidden) tbody td.selection, #filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark { +.files-filestable.view-grid:not(.hidden) tbody td.selection, .files-filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark { position: absolute; top: -8px; left: -8px; @@ -1187,45 +1187,45 @@ table.dragshadow td.size { z-index: 10; background: transparent; } -#filestable.view-grid:not(.hidden) tbody td.selection label, #filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label { +.files-filestable.view-grid:not(.hidden) tbody td.selection label, .files-filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label { width: 44px; height: 44px; display: inline-flex; padding: 14px; } -#filestable.view-grid:not(.hidden) tbody td.selection label::before, #filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label::before { +.files-filestable.view-grid:not(.hidden) tbody td.selection label::before, .files-filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label::before { margin: 0; width: 14px; height: 14px; } -#filestable.view-grid:not(.hidden) tbody td .popovermenu { +.files-filestable.view-grid:not(.hidden) tbody td .popovermenu { left: 0; width: 150px; margin: 0 5px; /* Ellipsize long entries, normally menu width is adjusted but for grid we use fixed width. */ } -#filestable.view-grid:not(.hidden) tbody td .popovermenu .menuitem span:not(.icon) { +.files-filestable.view-grid:not(.hidden) tbody td .popovermenu .menuitem span:not(.icon) { overflow: hidden; text-overflow: ellipsis; } -#filestable.view-grid:not(.hidden) tr.hidden-file td.filename .name .nametext .extension { +.files-filestable.view-grid:not(.hidden) tr.hidden-file td.filename .name .nametext .extension { display: block; } -#filestable.view-grid:not(.hidden) tfoot { +.files-filestable.view-grid:not(.hidden) tfoot { display: grid; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) { display: inline-block; margin: 0 auto; height: 418px; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td { padding-top: 50px; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td:first-child, #filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td.date { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td:first-child, .files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td.date { display: none; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td .info { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td .info { margin-left: 0; } @@ -1261,14 +1261,14 @@ table.dragshadow td.size { #body-public { /* Right-align view toggle on link share page */ } -#body-public #filestable.view-grid:not(.hidden) tbody td { +#body-public .files-filestable.view-grid:not(.hidden) tbody td { /* More space for filename since there is no share icon */ /* Position actions menu correctly below 3-dot-menu */ } -#body-public #filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { +#body-public .files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { max-width: 124px; } -#body-public #filestable.view-grid:not(.hidden) tbody td .popovermenu { +#body-public .files-filestable.view-grid:not(.hidden) tbody td .popovermenu { left: -80px; } #body-public #view-toggle { diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss index 6242eb4a5c0..99d3bf90f01 100644 --- a/apps/files/css/files.scss +++ b/apps/files/css/files.scss @@ -48,20 +48,20 @@ .newFileMenu .error, .newFileMenu .error + .icon-confirm, -#fileList .error { +.files-fileList .error { color: var(--color-error); border-color: var(--color-error); } /* FILE TABLE */ -#filestable { +.files-filestable { position: relative; width: 100%; min-width: 250px; display: block; flex-direction: column; // hide table if emptycontent is not hidden - #emptycontent:not(.hidden) ~ & { + .emptycontent:not(.hidden) ~ & { display: none; } // floating header @@ -94,7 +94,7 @@ } } -#filestable.hidden { +.files-filestable.hidden { display: none; } @@ -110,7 +110,7 @@ width: calc(100% - 300px); } -.file-drag, .file-drag #filestable tbody tr, .file-drag #filestable tbody tr:hover { +.file-drag, .file-drag .files-filestable tbody tr, .file-drag .files-filestable tbody tr:hover { background-color: var(--color-primary-light) !important; } @@ -118,11 +118,11 @@ background-color: var(--color-main-background) !important; } -.file-drag #filestable tbody tr, .file-drag #filestable tbody tr:hover{ +.file-drag .files-filestable tbody tr, .file-drag .files-filestable tbody tr:hover{ background-color: transparent !important; } -.app-files #app-content.dir-drop #filestable tbody tr.dropping-to-dir{ +.app-files #app-content.dir-drop .files-filestable tbody tr.dropping-to-dir{ background-color: var(--color-primary-light) !important; } @@ -181,21 +181,21 @@ opacity: 0.3; } -#filestable tbody tr { +.files-filestable tbody tr { height: 51px; } -#filestable tbody tr:hover, -#filestable tbody tr:focus, -#filestable tbody .name:focus, -#filestable tbody tr:hover .filename form, +.files-filestable tbody tr:hover, +.files-filestable tbody tr:focus, +.files-filestable tbody .name:focus, +.files-filestable tbody tr:hover .filename form, table tr.mouseOver td { background-color: var(--color-background-hover); } -#filestable tbody tr:active, -#filestable tbody tr.highlighted, -#filestable tbody tr.highlighted .name:focus, -#filestable tbody tr.selected, -#filestable tbody tr.searchresult { +.files-filestable tbody tr:active, +.files-filestable tbody tr.highlighted, +.files-filestable tbody tr.highlighted .name:focus, +.files-filestable tbody tr.selected, +.files-filestable tbody tr.searchresult { background-color: var(--color-primary-light); } @@ -283,24 +283,24 @@ table td { background-position: 8px center; background-repeat: no-repeat; } -table th#headerName { +table th.column-name { position: relative; width: 9999px; /* not really sure why this works better than 100% … table styling */ padding: 0; } -#headerName-container { +.column-name-container { position: relative; height: 50px; } -table th#headerSelection { +table th.column-selection { padding-top: 2px; } -table th#headerSize, table td.filesize { +table th.column-size, table td.filesize { text-align: right; } -table th#headerDate, table td.date, +table th.column-mtime, table td.date, table th.column-last, table td.column-last { -moz-box-sizing: border-box; box-sizing: border-box; @@ -315,9 +315,9 @@ table th.column-last, table td.column-last { top: 94px; } -#app-content-recent, -#app-content-favorites, -#app-content-shareoverview, +#app-content-recent, +#app-content-favorites, +#app-content-shareoverview, #app-content-sharingout, #app-content-sharingin, #app-content-sharinglinks, @@ -335,11 +335,11 @@ table.multiselect thead th { margin-right: 27%; } -table.multiselect #headerName { +table.multiselect .column-name { position: relative; width: 9999px; /* when we use 100%, the styling breaks on mobile … table styling */ } -table.multiselect #modified { +table.multiselect .column-mtime>a { display: none; } @@ -434,18 +434,18 @@ table { } } -.hide-hidden-files #filestable #fileList tr.hidden-file, -.hide-hidden-files #filestable #fileList tr.hidden-file.dragging { +.hide-hidden-files .files-filestable .files-fileList tr.hidden-file, +.hide-hidden-files .files-filestable .files-fileList tr.hidden-file.dragging { display: none; } -#fileList tr.animate-opacity { +.files-fileList tr.animate-opacity { -webkit-transition:opacity 250ms; -moz-transition:opacity 250ms; -o-transition:opacity 250ms; transition:opacity 250ms; } -#fileList tr.dragging { +.files-fileList tr.dragging { opacity: 0.2; } @@ -482,26 +482,26 @@ table td.selection { } /* File checkboxes */ -#fileList tr td.selection>.selectCheckBox + label:before { +.files-fileList tr td.selection>.selectCheckBox + label:before { opacity: 0.3; margin-right: 0; } /* Show checkbox with full opacity when hovering, checked, or selected */ -#fileList tr:hover td.selection>.selectCheckBox + label:before, -#fileList tr:focus td.selection>.selectCheckBox + label:before, -#fileList tr td.selection>.selectCheckBox:checked + label:before, -#fileList tr.selected td.selection>.selectCheckBox + label:before { +.files-fileList tr:hover td.selection>.selectCheckBox + label:before, +.files-fileList tr:focus td.selection>.selectCheckBox + label:before, +.files-fileList tr td.selection>.selectCheckBox:checked + label:before, +.files-fileList tr.selected td.selection>.selectCheckBox + label:before { opacity: 1; } /* Show checkbox with half opacity when selecting range */ -#fileList tr.halfselected td.selection>.selectCheckBox + label:before { +.files-fileList tr.halfselected td.selection>.selectCheckBox + label:before { opacity: 0.5; } /* Use label to have bigger clickable size for checkbox */ -#fileList tr td.selection>.selectCheckBox, +.files-fileList tr td.selection>.selectCheckBox, .select-all { & + label { padding: 16px; @@ -516,12 +516,12 @@ table td.selection { } } -#fileList tr td.selection>.selectCheckBox:focus-visible + label, +.files-fileList tr td.selection>.selectCheckBox:focus-visible + label, .select-all:focus-visible + label { outline-offset: 0px; } -#fileList tr td.filename { +.files-fileList tr td.filename { position: relative; width: 100%; padding-left: 0; @@ -529,18 +529,18 @@ table td.selection { -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, -#fileList tr td.filename p.name label { +.files-fileList tr td.filename a.name label, +.files-fileList tr td.filename p.name label { position: absolute; width: 80%; height: 50px; } -#fileList tr td.filename .favorite { +.files-fileList tr td.filename .favorite { display: inline-block; float: left; } -#fileList tr td.filename .favorite-mark { +.files-fileList tr td.filename .favorite-mark { position: absolute; display: block; top: -6px; @@ -568,19 +568,19 @@ table td.selection { } /* force show the loading icon, not only on hover */ -#fileList .icon-loading-small { +.files-fileList .icon-loading-small { opacity: 1 !important; display: inline !important; } -#fileList .action.action-share-notification span, #fileList a.name { +.files-fileList .action.action-share-notification span, .files-fileList a.name { cursor: default !important; } /* * Make the disabled link look not like a link in file list rows */ -#fileList a.name.disabled { +.files-fileList a.name.disabled { * { cursor: default; } @@ -628,7 +628,7 @@ a.action > img { margin-top: -3px; } -#fileList td a { +.files-fileList td a { a.action { display: inline; padding: 17px 8px; @@ -691,7 +691,7 @@ a.action > img { } // Ellipsize long sharer names -#fileList .action.action-share.permanent.shared-style span:not(.icon) { +.files-fileList .action.action-share.permanent.shared-style span:not(.icon) { display: inline-block; max-width: 70px; overflow: hidden; @@ -700,42 +700,42 @@ a.action > img { margin-left: 6px; } -#fileList .remoteAddress .userDomain { +.files-fileList .remoteAddress .userDomain { margin-left: 0 !important; } -#fileList .favorite-mark.permanent { +.files-fileList .favorite-mark.permanent { opacity: 1; } -#fileList .fileActionsMenu a.action:hover, -#fileList .fileActionsMenu a.action:focus, +.files-fileList .fileActionsMenu a.action:hover, +.files-fileList .fileActionsMenu a.action:focus, /* show share action of shared items darker to distinguish from non-shared */ -#fileList a.action.action-share.shared-style:hover, -#fileList a.action.action-share.shared-style:focus { +.files-fileList a.action.action-share.shared-style:hover, +.files-fileList a.action.action-share.shared-style:focus { opacity: 1; } -#fileList tr a.action.disabled { +.files-fileList tr a.action.disabled { background: none; } -#selectedActionsList a.download.disabled, -#fileList tr a.action.action-download.disabled { +.selectedActions a.download.disabled, +.files-fileList tr a.action.action-download.disabled { color: #000000; } -#fileList tr:hover a.action.disabled:hover * { +.files-fileList tr:hover a.action.disabled:hover * { cursor: default; } .summary { color: var(--color-text-maxcontrast); /* add whitespace to bottom of files list to correctly show dropdowns */ - $action-menu-items-count: 7; // list view has currently max 7 items in its action menu + $action-menu-items-count: 7; // list view has currently max 7 items in its action menu height: 44px * ($action-menu-items-count + 0.5); // 0.5 is added to show some whitespace below } -#filestable .filesummary { +.files-filestable .summary .filesummary { width: 100%; /* Width of checkbox and file preview */ padding-left: 101px; @@ -814,16 +814,16 @@ table.dragshadow td.size { } } -#filestable .filename .action .icon, -#filestable .selectedActions a .icon, -#filestable .filename .favorite-mark .icon, -#controls .actions .button .icon { +.files-filestable .filename .action .icon, +.files-filestable .selectedActions a .icon, +.files-filestable .filename .favorite-mark .icon, +.files-controls .actions .button .icon { display: inline-block; vertical-align: middle; background-size: 16px 16px; } -#filestable .filename .favorite-mark { +.files-filestable .filename .favorite-mark { // Override default icons to always hide the star icon and always show the // starred icon even when hovered or focused. & .icon-star { @@ -834,15 +834,15 @@ table.dragshadow td.size { } } -#filestable .filename .action .icon.hidden, -#filestable .selectedActions a .icon.hidden, -#controls .actions .button .icon.hidden { +.files-filestable .filename .action .icon.hidden, +.files-filestable .selectedActions a .icon.hidden, +.files-controls .actions .button .icon.hidden { display: none; } -#filestable .filename .action .icon.loading, -#filestable .selectedActions a .icon.loading, -#controls .actions .button .icon.loading { +.files-filestable .filename .action .icon.loading, +.files-filestable .selectedActions a .icon.loading, +.files-controls .actions .button .icon.loading { width: 15px; height: 15px; } @@ -856,7 +856,7 @@ table.dragshadow td.size { } .breadcrumb .canDrop > a, -#filestable tbody tr.canDrop { +.files-filestable tbody tr.canDrop { background-color: rgba( variables.$color-primary, .3 ); } .dropzone-background { @@ -874,7 +874,7 @@ table.dragshadow td.size { overflow: auto; min-width: 160px; height: 54px; - + &:not(.hidden) { display: flex; } @@ -914,7 +914,7 @@ table.dragshadow td.size { } /* GRID */ -#filestable.view-grid:not(.hidden) { +.files-filestable.view-grid:not(.hidden) { $grid-size: 160px; $grid-pad: 14px; @@ -1220,7 +1220,7 @@ table.dragshadow td.size { /* Adjustments for link share page */ #body-public { - #filestable.view-grid:not(.hidden) tbody td { + .files-filestable.view-grid:not(.hidden) tbody td { /* More space for filename since there is no share icon */ &.filename .name .nametext .innernametext { max-width: 124px; diff --git a/apps/files/css/merged.css b/apps/files/css/merged.css index 7696875d849..11aae9069b8 100644 --- a/apps/files/css/merged.css +++ b/apps/files/css/merged.css @@ -111,13 +111,13 @@ .newFileMenu .error, .newFileMenu .error + .icon-confirm, -#fileList .error { +.files-fileList .error { color: var(--color-error); border-color: var(--color-error); } /* FILE TABLE */ -#filestable { +.files-filestable { position: relative; width: 100%; min-width: 250px; @@ -127,10 +127,10 @@ * This is a dirty hack as the sticky header requires us to use a different display type on the table element */ } -#emptycontent:not(.hidden) ~ #filestable { +.emptycontent:not(.hidden) ~ .files-filestable { display: none; } -#filestable thead { +.files-filestable thead { position: -webkit-sticky; position: sticky; top: 50px; @@ -138,20 +138,20 @@ display: block; background-color: var(--color-main-background-translucent); } -#filestable tbody { +.files-filestable tbody { display: table; width: 100%; } -#filestable tbody tr[data-permissions="0"], -#filestable tbody tr[data-permissions="16"] { +.files-filestable tbody tr[data-permissions="0"], +.files-filestable tbody tr[data-permissions="16"] { background-color: var(--color-background-dark); } -#filestable tbody tr[data-permissions="0"] td.filename .nametext .innernametext, -#filestable tbody tr[data-permissions="16"] td.filename .nametext .innernametext { +.files-filestable tbody tr[data-permissions="0"] td.filename .nametext .innernametext, +.files-filestable tbody tr[data-permissions="16"] td.filename .nametext .innernametext { color: var(--color-text-maxcontrast); } -#filestable.hidden { +.files-filestable.hidden { display: none; } @@ -165,7 +165,7 @@ width: calc(100% - 300px); } -.file-drag, .file-drag #filestable tbody tr, .file-drag #filestable tbody tr:hover { +.file-drag, .file-drag .files-filestable tbody tr, .file-drag .files-filestable tbody tr:hover { background-color: var(--color-primary-light) !important; } @@ -173,11 +173,11 @@ background-color: var(--color-main-background) !important; } -.file-drag #filestable tbody tr, .file-drag #filestable tbody tr:hover { +.file-drag .files-filestable tbody tr, .file-drag .files-filestable tbody tr:hover { background-color: transparent !important; } -.app-files #app-content.dir-drop #filestable tbody tr.dropping-to-dir { +.app-files #app-content.dir-drop .files-filestable tbody tr.dropping-to-dir { background-color: var(--color-primary-light) !important; } @@ -256,23 +256,23 @@ opacity: 0.3; } -#filestable tbody tr { +.files-filestable tbody tr { height: 51px; } -#filestable tbody tr:hover, -#filestable tbody tr:focus, -#filestable tbody .name:focus, -#filestable tbody tr:hover .filename form, +.files-filestable tbody tr:hover, +.files-filestable tbody tr:focus, +.files-filestable tbody .name:focus, +.files-filestable tbody tr:hover .filename form, table tr.mouseOver td { background-color: var(--color-background-hover); } -#filestable tbody tr:active, -#filestable tbody tr.highlighted, -#filestable tbody tr.highlighted .name:focus, -#filestable tbody tr.selected, -#filestable tbody tr.searchresult { +.files-filestable tbody tr:active, +.files-filestable tbody tr.highlighted, +.files-filestable tbody tr.highlighted .name:focus, +.files-filestable tbody tr.selected, +.files-filestable tbody tr.searchresult { background-color: var(--color-primary-light); } @@ -373,27 +373,27 @@ table td { background-repeat: no-repeat; } -table th#headerName { +table th.column-name { position: relative; width: 9999px; /* not really sure why this works better than 100% … table styling */ padding: 0; } -#headerName-container { +.column-name-container { position: relative; height: 50px; } -table th#headerSelection { +table th.column-selection { padding-top: 2px; } -table th#headerSize, table td.filesize { +table th.column-size, table td.filesize { text-align: right; } -table th#headerDate, table td.date, +table th.column-mtime, table td.date, table th.column-last, table td.column-last { -moz-box-sizing: border-box; box-sizing: border-box; @@ -428,13 +428,13 @@ table.multiselect thead th { margin-right: 27%; } -table.multiselect #headerName { +table.multiselect .column-name { position: relative; width: 9999px; /* when we use 100%, the styling breaks on mobile … table styling */ } -table.multiselect #modified { +table.multiselect .column-mtime > a { display: none; } @@ -537,19 +537,19 @@ table td.filename .nametext { padding: 0 20px 0 0; } -.hide-hidden-files #filestable #fileList tr.hidden-file, -.hide-hidden-files #filestable #fileList tr.hidden-file.dragging { +.hide-hidden-files .files-filestable .files-fileList tr.hidden-file, +.hide-hidden-files .files-filestable .files-fileList tr.hidden-file.dragging { display: none; } -#fileList tr.animate-opacity { +.files-fileList tr.animate-opacity { -webkit-transition: opacity 250ms; -moz-transition: opacity 250ms; -o-transition: opacity 250ms; transition: opacity 250ms; } -#fileList tr.dragging { +.files-fileList tr.dragging { opacity: 0.2; } @@ -582,30 +582,30 @@ table td.selection { } /* File checkboxes */ -#fileList tr td.selection > .selectCheckBox + label:before { +.files-fileList tr td.selection > .selectCheckBox + label:before { opacity: 0.3; margin-right: 0; } /* Show checkbox with full opacity when hovering, checked, or selected */ -#fileList tr:hover td.selection > .selectCheckBox + label:before, -#fileList tr:focus td.selection > .selectCheckBox + label:before, -#fileList tr td.selection > .selectCheckBox:checked + label:before, -#fileList tr.selected td.selection > .selectCheckBox + label:before { +.files-fileList tr:hover td.selection > .selectCheckBox + label:before, +.files-fileList tr:focus td.selection > .selectCheckBox + label:before, +.files-fileList tr td.selection > .selectCheckBox:checked + label:before, +.files-fileList tr.selected td.selection > .selectCheckBox + label:before { opacity: 1; } /* Show checkbox with half opacity when selecting range */ -#fileList tr.halfselected td.selection > .selectCheckBox + label:before { +.files-fileList tr.halfselected td.selection > .selectCheckBox + label:before { opacity: 0.5; } /* Use label to have bigger clickable size for checkbox */ -#fileList tr td.selection > .selectCheckBox + label, +.files-fileList tr td.selection > .selectCheckBox + label, .select-all + label { padding: 16px; } -#fileList tr td.selection > .selectCheckBox:focus + label, +.files-fileList tr td.selection > .selectCheckBox:focus + label, .select-all:focus + label { background-color: var(--color-background-hover); border-radius: var(--border-radius-pill); @@ -614,12 +614,12 @@ table td.selection { padding: 14px; } -#fileList tr td.selection > .selectCheckBox:focus-visible + label, +.files-fileList tr td.selection > .selectCheckBox:focus-visible + label, .select-all:focus-visible + label { outline-offset: 0px; } -#fileList tr td.filename { +.files-fileList tr td.filename { position: relative; width: 100%; padding-left: 0; @@ -630,19 +630,19 @@ table td.selection { transition: background-image 500ms; } -#fileList tr td.filename a.name label, -#fileList tr td.filename p.name label { +.files-fileList tr td.filename a.name label, +.files-fileList tr td.filename p.name label { position: absolute; width: 80%; height: 50px; } -#fileList tr td.filename .favorite { +.files-fileList tr td.filename .favorite { display: inline-block; float: left; } -#fileList tr td.filename .favorite-mark { +.files-fileList tr td.filename .favorite-mark { position: absolute; display: block; top: -6px; @@ -672,25 +672,25 @@ table td.selection { } /* force show the loading icon, not only on hover */ -#fileList .icon-loading-small { +.files-fileList .icon-loading-small { opacity: 1 !important; display: inline !important; } -#fileList .action.action-share-notification span, #fileList a.name { +.files-fileList .action.action-share-notification span, .files-fileList a.name { cursor: default !important; } /* * Make the disabled link look not like a link in file list rows */ -#fileList a.name.disabled * { +.files-fileList a.name.disabled * { cursor: default; } -#fileList a.name.disabled a, #fileList a.name.disabled a * { +.files-fileList a.name.disabled a, .files-fileList a.name.disabled a * { cursor: pointer; } -#fileList a.name.disabled:focus { +.files-fileList a.name.disabled:focus { background: none; } @@ -731,16 +731,16 @@ a.action > img { margin-top: -3px; } -#fileList td a a.action { +.files-fileList td a a.action { display: inline; padding: 17px 8px; line-height: 50px; opacity: 0.3; } -#fileList td a a.action.action-share { +.files-fileList td a a.action.action-share { padding: 17px 14px; } -#fileList td a a.action.action-share.permanent:not(.shared-style) .icon-shared + span { +.files-fileList td a a.action.action-share.permanent:not(.shared-style) .icon-shared + span { /* hide text of the share action */ /* .hidden-visually for accessbility */ position: absolute; @@ -750,44 +750,44 @@ a.action > img { height: 1px; overflow: hidden; } -#fileList td a a.action.action-share .avatar { +.files-fileList td a a.action.action-share .avatar { display: inline-block; vertical-align: middle; } -#fileList td a a.action.action-menu { +.files-fileList td a a.action.action-menu { padding-top: 17px; padding-bottom: 17px; padding-left: 14px; padding-right: 14px; } -#fileList td a a.action.no-permission:hover, #fileList td a a.action.no-permission:focus { +.files-fileList td a a.action.no-permission:hover, .files-fileList td a a.action.no-permission:focus { opacity: 0.3; } -#fileList td a a.action.disabled:hover, #fileList td a a.action.disabled:focus, -#fileList td a a.action.disabled img { +.files-fileList td a a.action.disabled:hover, .files-fileList td a a.action.disabled:focus, +.files-fileList td a a.action.disabled img { opacity: 0.3; } -#fileList td a a.action.disabled.action-download { +.files-fileList td a a.action.disabled.action-download { opacity: 0.7; } -#fileList td a a.action.disabled.action-download:hover, #fileList td a a.action.disabled.action-download:focus { +.files-fileList td a a.action.disabled.action-download:hover, .files-fileList td a a.action.disabled.action-download:focus { opacity: 0.7; } -#fileList td a a.action:hover, #fileList td a a.action:focus { +.files-fileList td a a.action:hover, .files-fileList td a a.action:focus { opacity: 1; } -#fileList td a a.action:focus { +.files-fileList td a a.action:focus { background-color: var(--color-background-hover); border-radius: var(--border-radius-pill); } -#fileList td a .fileActionsMenu a.action, #fileList td a a.action.action-share.shared-style { +.files-fileList td a .fileActionsMenu a.action, .files-fileList td a a.action.action-share.shared-style { opacity: 0.7; } -#fileList td a .fileActionsMenu .action.permanent { +.files-fileList td a .fileActionsMenu .action.permanent { opacity: 1; } -#fileList .action.action-share.permanent.shared-style span:not(.icon) { +.files-fileList .action.action-share.permanent.shared-style span:not(.icon) { display: inline-block; max-width: 70px; overflow: hidden; @@ -796,31 +796,31 @@ a.action > img { margin-left: 6px; } -#fileList .remoteAddress .userDomain { +.files-fileList .remoteAddress .userDomain { margin-left: 0 !important; } -#fileList .favorite-mark.permanent { +.files-fileList .favorite-mark.permanent { opacity: 1; } -#fileList .fileActionsMenu a.action:hover, -#fileList .fileActionsMenu a.action:focus, -#fileList a.action.action-share.shared-style:hover, -#fileList a.action.action-share.shared-style:focus { +.files-fileList .fileActionsMenu a.action:hover, +.files-fileList .fileActionsMenu a.action:focus, +.files-fileList a.action.action-share.shared-style:hover, +.files-fileList a.action.action-share.shared-style:focus { opacity: 1; } -#fileList tr a.action.disabled { +.files-fileList tr a.action.disabled { background: none; } -#selectedActionsList a.download.disabled, -#fileList tr a.action.action-download.disabled { +.selectedActions a.download.disabled, +.files-fileList tr a.action.action-download.disabled { color: #000000; } -#fileList tr:hover a.action.disabled:hover * { +.files-fileList tr:hover a.action.disabled:hover * { cursor: default; } @@ -830,7 +830,7 @@ a.action > img { height: 330px; } -#filestable .filesummary { +.files-filestable .summary .filesummary { width: 100%; /* Width of checkbox and file preview */ padding-left: 101px; @@ -916,32 +916,32 @@ table.dragshadow td.size { left: 57px !important; } -#filestable .filename .action .icon, -#filestable .selectedActions a .icon, -#filestable .filename .favorite-mark .icon, -#controls .actions .button .icon { +.files-filestable .filename .action .icon, +.files-filestable .selectedActions a .icon, +.files-filestable .filename .favorite-mark .icon, +.files-controls .actions .button .icon { display: inline-block; vertical-align: middle; background-size: 16px 16px; } -#filestable .filename .favorite-mark .icon-star { +.files-filestable .filename .favorite-mark .icon-star { background-image: none; } -#filestable .filename .favorite-mark .icon-starred { +.files-filestable .filename .favorite-mark .icon-starred { /* $dir is the app name, so we add this to the icon var to avoid conflicts between apps */ background-image: var(--icon-star-dark-yellow); } -#filestable .filename .action .icon.hidden, -#filestable .selectedActions a .icon.hidden, -#controls .actions .button .icon.hidden { +.files-filestable .filename .action .icon.hidden, +.files-filestable .selectedActions a .icon.hidden, +.files-controls .actions .button .icon.hidden { display: none; } -#filestable .filename .action .icon.loading, -#filestable .selectedActions a .icon.loading, -#controls .actions .button .icon.loading { +.files-filestable .filename .action .icon.loading, +.files-filestable .selectedActions a .icon.loading, +.files-controls .actions .button .icon.loading { width: 15px; height: 15px; } @@ -955,7 +955,7 @@ table.dragshadow td.size { } .breadcrumb .canDrop > a, -#filestable tbody tr.canDrop { +.files-filestable tbody tr.canDrop { background-color: rgba(0, 130, 201, 0.3); } @@ -1006,62 +1006,62 @@ table.dragshadow td.size { } /* GRID */ -#filestable.view-grid:not(.hidden) { +.files-filestable.view-grid:not(.hidden) { /* HEADER and MULTISELECT */ /* MAIN FILE LIST */ /* Center align the footer file number & size summary */ } -#filestable.view-grid:not(.hidden) thead tr { +.files-filestable.view-grid:not(.hidden) thead tr { display: block; border-bottom: 1px solid var(--color-border); background-color: var(--color-main-background-translucent); } -#filestable.view-grid:not(.hidden) thead tr th { +.files-filestable.view-grid:not(.hidden) thead tr th { width: auto; border: none; } -#filestable.view-grid:not(.hidden) tbody { +.files-filestable.view-grid:not(.hidden) tbody { display: grid; grid-template-columns: repeat(auto-fill, 160px); justify-content: space-around; row-gap: 15px; margin: 15px 0; } -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) { +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) { display: block; position: relative; height: 190px; border-radius: var(--border-radius); } -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted { +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted { background-color: transparent; } -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .fileactions, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .fileactions, #filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .thumbnail-wrapper, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .nametext, -#filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .fileactions { +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):hover .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):focus .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden):active .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).selected .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).searchresult .fileactions, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden) .name:focus .fileactions, .files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .thumbnail-wrapper, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .nametext, +.files-filestable.view-grid:not(.hidden) tbody tr:not(.hidden).highlighted .fileactions { background-color: var(--color-background-hover); } -#filestable.view-grid:not(.hidden) tbody td { +.files-filestable.view-grid:not(.hidden) tbody td { display: inline; border-bottom: none; /* No space for filesize and date in grid view */ /* Position actions menu below file */ } -#filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper { +.files-filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper { min-width: 0; max-width: none; position: absolute; @@ -1072,7 +1072,7 @@ table.dragshadow td.size { left: 0; z-index: -1; } -#filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail { +.files-filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail { width: calc(100% - 2 * 14px); height: calc(100% - 2 * 14px); background-size: contain; @@ -1084,13 +1084,13 @@ table.dragshadow td.size { * Position is inherited from the selection while in grid view */ } -#filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail .favorite-mark { +.files-filestable.view-grid:not(.hidden) tbody td.filename .thumbnail-wrapper .thumbnail .favorite-mark { padding: 14px; left: auto; top: -22px; right: -22px; } -#filestable.view-grid:not(.hidden) tbody td.filename .uploadtext { +.files-filestable.view-grid:not(.hidden) tbody td.filename .uploadtext { width: 100%; margin: 0; top: 0; @@ -1099,13 +1099,13 @@ table.dragshadow td.size { padding-top: 4px; padding-left: 28px; } -#filestable.view-grid:not(.hidden) tbody td.filename .name { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name { height: 100%; border-radius: var(--border-radius); overflow: hidden; cursor: pointer !important; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext { display: flex; height: 44px; margin-top: 146px; @@ -1114,27 +1114,27 @@ table.dragshadow td.size { padding: 0; /* No space for extension in grid view */ } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { display: inline-block; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:before { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:before { content: ""; flex: 1; min-width: 14px; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:after { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext:after { content: ""; flex: 1; min-width: 44px; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .extension { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .extension { display: none; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions { height: initial; margin-top: 146px; display: flex; @@ -1142,7 +1142,7 @@ table.dragshadow td.size { position: absolute; right: 0; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action { padding: 14px; width: 44px; height: 44px; @@ -1150,34 +1150,34 @@ table.dragshadow td.size { align-items: center; justify-content: center; } -#filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action:not(.action-menu) { +.files-filestable.view-grid:not(.hidden) tbody td.filename .name .fileactions .action:not(.action-menu) { display: none; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden { display: block !important; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden .action-share img { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-share-container.hidden .action-share img { padding: 6px; border-radius: 50%; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-restore-container.hidden { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-restore-container.hidden { display: block !important; } -#filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-comment-container.hidden { +.files-filestable.view-grid:not(.hidden) tbody td.filename .fileActionsMenu .action-comment-container.hidden { display: block !important; } -#filestable.view-grid:not(.hidden) tbody td.filename form { +.files-filestable.view-grid:not(.hidden) tbody td.filename form { padding: 3px 14px; border-radius: var(--border-radius); } -#filestable.view-grid:not(.hidden) tbody td.filename form input.filename { +.files-filestable.view-grid:not(.hidden) tbody td.filename form input.filename { width: 100%; margin-left: 0; } -#filestable.view-grid:not(.hidden) tbody td.filesize, #filestable.view-grid:not(.hidden) tbody td.date { +.files-filestable.view-grid:not(.hidden) tbody td.filesize, .files-filestable.view-grid:not(.hidden) tbody td.date { display: none; } -#filestable.view-grid:not(.hidden) tbody td.selection, #filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark { +.files-filestable.view-grid:not(.hidden) tbody td.selection, .files-filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark { position: absolute; top: -8px; left: -8px; @@ -1187,45 +1187,45 @@ table.dragshadow td.size { z-index: 10; background: transparent; } -#filestable.view-grid:not(.hidden) tbody td.selection label, #filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label { +.files-filestable.view-grid:not(.hidden) tbody td.selection label, .files-filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label { width: 44px; height: 44px; display: inline-flex; padding: 14px; } -#filestable.view-grid:not(.hidden) tbody td.selection label::before, #filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label::before { +.files-filestable.view-grid:not(.hidden) tbody td.selection label::before, .files-filestable.view-grid:not(.hidden) tbody td.filename .favorite-mark label::before { margin: 0; width: 14px; height: 14px; } -#filestable.view-grid:not(.hidden) tbody td .popovermenu { +.files-filestable.view-grid:not(.hidden) tbody td .popovermenu { left: 0; width: 150px; margin: 0 5px; /* Ellipsize long entries, normally menu width is adjusted but for grid we use fixed width. */ } -#filestable.view-grid:not(.hidden) tbody td .popovermenu .menuitem span:not(.icon) { +.files-filestable.view-grid:not(.hidden) tbody td .popovermenu .menuitem span:not(.icon) { overflow: hidden; text-overflow: ellipsis; } -#filestable.view-grid:not(.hidden) tr.hidden-file td.filename .name .nametext .extension { +.files-filestable.view-grid:not(.hidden) tr.hidden-file td.filename .name .nametext .extension { display: block; } -#filestable.view-grid:not(.hidden) tfoot { +.files-filestable.view-grid:not(.hidden) tfoot { display: grid; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) { display: inline-block; margin: 0 auto; height: 418px; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td { padding-top: 50px; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td:first-child, #filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td.date { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td:first-child, .files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td.date { display: none; } -#filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td .info { +.files-filestable.view-grid:not(.hidden) tfoot .summary:not(.hidden) td .info { margin-left: 0; } @@ -1261,14 +1261,14 @@ table.dragshadow td.size { #body-public { /* Right-align view toggle on link share page */ } -#body-public #filestable.view-grid:not(.hidden) tbody td { +#body-public .files-filestable.view-grid:not(.hidden) tbody td { /* More space for filename since there is no share icon */ /* Position actions menu correctly below 3-dot-menu */ } -#body-public #filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { +#body-public .files-filestable.view-grid:not(.hidden) tbody td.filename .name .nametext .innernametext { max-width: 124px; } -#body-public #filestable.view-grid:not(.hidden) tbody td .popovermenu { +#body-public .files-filestable.view-grid:not(.hidden) tbody td .popovermenu { left: -80px; } #body-public #view-toggle { @@ -1338,18 +1338,18 @@ table.dragshadow td.size { overflow: visible; } -#uploadprogresswrapper, #uploadprogresswrapper * { +.uploadprogresswrapper, .uploadprogresswrapper * { box-sizing: border-box; } -#uploadprogresswrapper { +.uploadprogresswrapper { display: inline-block; vertical-align: top; height: 36px; margin-left: 3px; } -#uploadprogresswrapper > input[type=button] { +.uploadprogresswrapper > input[type=button] { height: 36px; margin-left: 3px; } @@ -1591,9 +1591,9 @@ table.dragshadow td.size { background-color: rgb(255, 255, 255) !important; } - table th#headerSize, + table th.column-size, table td.filesize, -table th#headerDate, +table th.column-mtime, table td.date { display: none; } @@ -1608,17 +1608,17 @@ table td.date { padding-left: 0; } - #fileList a.action.action-menu img { + .fileList a.action.action-menu img { padding-left: 0; } - #fileList .fileActionsMenu { + .fileList .fileActionsMenu { margin-right: 6px; } /* hide text of the share action on mobile */ /* .hidden-visually for accessbility */ - #fileList a.action-share span:not(.icon):not(.avatar) { + .fileList a.action-share span:not(.icon):not(.avatar) { position: absolute; left: -10000px; top: auto; @@ -1627,11 +1627,6 @@ table td.date { overflow: hidden; } - /* proper notification area for multi line messages */ - #notification-container { - display: flex; - } - /* shorten elements for mobile */ #uploadprogressbar, #uploadprogressbar .label.inner { width: 50px; diff --git a/apps/files/css/merged.css.map b/apps/files/css/merged.css.map index d207afde234..3bdbf9ef50d 100644 --- a/apps/files/css/merged.css.map +++ b/apps/files/css/merged.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","files.scss","../../../core/css/functions.scss","upload.scss","mobile.scss","detailsView.scss","../../../core/css/whatsnew.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AAAA;AAAA;AA4BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ADxCA;AACA;EACC;EACA;EACA;EACA;;;AAED;EAAoD;EAAU;;;AAC9D;EAAqB;;;AACrB;AAAA;EAEC;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;;AACA;EACC;;;AAIF;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;AAiBA;AAAA;AAAA;;AAfA;EACC;;AAGD;EACC;EACA;EAEA,KDoCc;EClCd;EACA;EACA;;AAMD;EACC;EACA;;AAEA;AAAA;EAEC;;AAEA;AAAA;EACC;;;AAMJ;EACC;;;AAGD;AACA;EACC;EACA;;;AAGD;EAGC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AACA;AClEC;EAEA;;;ADmED;ACrEC;EAEA;;;ADsED;ACxEC;EAEA;;;ADyED;AAAA;AAAA;AAAA;AC3EC;EAEA;;;AD+ED;ACjFC;EAEA;;;ADkFD;ACpFC;EAEA;;;ADqFD;ACvFC;EAEA;;;ADwFD;AC1FC;EAEA;;;AD2FD;AC7FC;EAEA;;;AD8FD;AChGC;EAEA;;;ADkGD;EACC;;;AAED;AACA;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAED;AAAA;AAAA;AAAA;AAAA;EAKC;;;AAED;AAAA;AAAA;AAAA;AAAA;EAKC;;;AAGD;EAAU;;;AAEV;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;;;AAED;AAAA;AAAA;AAAA;EAIC;EACA;;;AAGD;EACC;;;AAED;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;;AAGF;EACC;EACA;;;AAED;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAED;AAAA;AAAA;AAAA;EAIC;;;AAED;EACC;;;AAED;AAAA;EAEC;;;AAGD;AAAA;EAEC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;;;AAED;EACC;EACA;AAAe;EACf;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAED;EACC;;;AAED;AAAA;EAEC;EACA;EACA;AACA;EACA;EACA;;;AAGD;AAAA;EAEC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQC;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;AAAe;;;AAEhB;EACC;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAED;AAAA;EAEC;EACA;AAAmB;EACnB;EACA;EACA;EACA;EACA;;;AAED;AACC;EACA;EACA;EACA;EACA;;;AAGA;EACC;;AAED;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;;;AAID;EACC;;;AAGD;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;;;AAGD;EAA6H;;;AAC7H;EAAwE;EAAY;;;AAEpF;EACC;EACA;EACA;EACA;;;AAGD;AAEC;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKH;AAAA;EAEC;;;AAGD;EACC;EACA;EACA;EACA;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;AAEA;EACC;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;EACA;;;AAGD;AACA;AAAA;AAAA;AAAA;EAIC;;;AAGD;AACA;EACC;;;AAGD;AAGC;AAAA;EACC;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA;;;AAIF;AAAA;EAEC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EAA2C;EAAwC;EAAsC;;;AAG1H;AAAA;EAEC;EACA;EACA;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EAAsC;;;AAEtC;AACA;EACC;;;AAGD;EACC;;;AAGD;AACA;AAAA;EAEC;EACA;;;AAGD;AACA;EACC;EACA;;;AAGD;EACC;;;AAGD;AAAA;AAAA;AAIC;EACC;;AAGD;EACC;;AAGD;EACC;;;AAIF;EACC;EACA;EACA;;;AAGD;AACA;EACI;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACC;EACA;EACA;;;AAGD;EACC;;;AAED;EACC;EACA;EACA;;;AAGD;EACC;;;AAIA;EACC;EACA;EACA;EACA;;AACA;EACC;;AACA;AACC;AACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAGF;EACC;EACA;EACA;EACA;;AAGA;EACC;;AAID;AAAA;EAEC;;AAED;EACC;;AACA;EACC;;AAIH;EACC;;AAED;EACC;EACA;;AAGF;EACC;;AAED;EACC;;;AAKF;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AAAA;AAAA;AAAA;EAKC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;;;AAGD;EACC;AACA;EAEA;;;AAED;EACC;AACA;EACA;;;AAED;AAAA;AAAA;AAGA;EACC;;;AAED;AAAA;AAAA;AAAA;EAIC;;;AAED;EACC;EACA;EACA;;;AAED;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;EACA;AAEA;EACA;;;AAED;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;AAEA;;AACA;EACC;;;AAIF;AAAA;AAAA;AAAA;EAIC;EACA;EACA;;;AAMA;EACC;;AAED;AChwBA;EAEA;;;ADmwBD;AAAA;AAAA;EAGC;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAED;EACC;;AACA;EACC;;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAGD;EACC;EACA;EACA;;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAKA;EACC;;AAIF;EACC;EACA;;;AAIF;AACA;AAIC;AAaA;AAoOA;;AA/OC;EACC;EACA;EACA;;AACA;EACC;EACA;;AAMH;EACC;EACA;EACA;EACA;EACA;;AAGA;EACC;EACA;EACA;EACA;;AAEA;AAAA;EAKC;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGC;;AAKH;EACC;EACA;AAmJA;AA8BA;;AA9KC;EACC;EACA;EACA;EACA,OAvDQ;EAwDR,QAxDQ;EAyDR,SAxDO;EAyDP;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACC,SA1EK;EA2EL;EACA;EACA;;AAKH;EACC;EACA;EACA;EACA;EAEA;EACA;EAEA;;AAGD;EACC;EACA;EAIA;EAKA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;AAoBA;;AAlBA;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AAID;EACC;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC,SApJK;EAqJL;EACA;EACA;EACA;EACA;;AAGA;EACC;;AAQH;EACC;;AAEA;EACC;EACA;;AAIF;EACC;;AAGD;EACC;;AAIF;EACC;EACA;;AAEA;EACC;EACA;;AAMH;EAEC;;AAGD;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA,SAvNO;;AAwNP;EACC;EACA,OA1NM;EA2NN,QA3NM;;AAiOT;EACC;EACA;EACA;AAEA;;AACA;EACC;EACA;;AAMJ;EACC;;AAID;EACC;;AAEA;EACC;EACA;EAEA;;AAEA;EACC;;AAEA;EAEC;;AAGD;EACI;;;AAOR;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAGC;;AAGD;EAEC;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAKA;EACC;EACA;;;AAGD;AACA;AAaC;;AAZA;AACC;AAKA;;AAJA;EACC;;AAID;EACC;;AAKF;EACC;EACA;;;AAIF;AACA;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC;EACA;EACA;;;AE/uCF;EACC;EACA;EACA;EACA;AAAuB;EACvB;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EAAsB;;;AACtB;EAAoB;EAAgB;EAAY;EAAU;EAAW;EAAgB;;;AAErF;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAED;EACC;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;EAEC;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;EACA;;;AAED;EACC;;;AAGD;EACC;EACA;;AAEA;EACC;;;AAIF;EACC;EACA;EACA;EACA;;;AAGD;EACE;IAAK;;EACL;IAAO;;;AAET;EACE;IAAK;;EACL;IAAO;;;AAET;EACE;IAAK;;EACL;IAAO;;;AAET;EACE;IAAK;;EACL;IAAO;;;AHjNT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AIEA;AAAA;AAAA;AAIA;EAEA;IACC;;;EAGD;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;;;EAGD;IACC;;;EAGD;IACC;;;AAED;AACA;EACA;IACC;IACA;IACA;IACA;IACA;IACA;;;AAID;EACA;IACC;;;AAGD;EACA;IACC;;;AAED;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAID;AACC;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;;;ACvFF;EACC;EACA;;;AAGD;EACC;;;AAID;EACC;EACA;;;AAGD;EACC;EACA;EACA;;AAEA;EAEC;;;AAGF;EACC;EACA;;;AAGD;EACC;EACA;AAAqB;EACrB;;;AAGD;EACC;AAAW;;;AAGZ;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;AAAwB;;;AAGzB;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;AAA0B;EAC1B;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AC/HD;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE","file":"merged.css"}
\ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","files.scss","../../../core/css/functions.scss","upload.scss","mobile.scss","detailsView.scss","../../../core/css/whatsnew.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AAAA;AAAA;AA4BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ADxCA;AACA;EACC;EACA;EACA;EACA;;;AAED;EAAoD;EAAU;;;AAC9D;EAAqB;;;AACrB;AAAA;EAEC;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;;AACA;EACC;;;AAIF;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;AAiBA;AAAA;AAAA;;AAfA;EACC;;AAGD;EACC;EACA;EAEA,KDoCc;EClCd;EACA;EACA;;AAMD;EACC;EACA;;AAEA;AAAA;EAEC;;AAEA;AAAA;EACC;;;AAMJ;EACC;;;AAGD;AACA;EACC;EACA;;;AAGD;EAGC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AACA;AClEC;EAEA;;;ADmED;ACrEC;EAEA;;;ADsED;ACxEC;EAEA;;;ADyED;AAAA;AAAA;AAAA;AC3EC;EAEA;;;AD+ED;ACjFC;EAEA;;;ADkFD;ACpFC;EAEA;;;ADqFD;ACvFC;EAEA;;;ADwFD;AC1FC;EAEA;;;AD2FD;AC7FC;EAEA;;;AD8FD;AChGC;EAEA;;;ADkGD;EACC;;;AAED;AACA;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAED;AAAA;AAAA;AAAA;AAAA;EAKC;;;AAED;AAAA;AAAA;AAAA;AAAA;EAKC;;;AAGD;EAAU;;;AAEV;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;;;AAED;AAAA;AAAA;AAAA;EAIC;EACA;;;AAGD;EACC;;;AAED;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;;AAGF;EACC;EACA;;;AAED;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAED;AAAA;AAAA;AAAA;EAIC;;;AAED;EACC;;;AAED;AAAA;EAEC;;;AAGD;AAAA;EAEC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;;;AAED;EACC;EACA;AAAe;EACf;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAED;EACC;;;AAED;AAAA;EAEC;EACA;EACA;AACA;EACA;EACA;;;AAGD;AAAA;EAEC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQC;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;AAAe;;;AAEhB;EACC;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAED;AAAA;EAEC;EACA;AAAmB;EACnB;EACA;EACA;EACA;EACA;;;AAED;AACC;EACA;EACA;EACA;EACA;;;AAGA;EACC;;AAED;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;;;AAID;EACC;;;AAGD;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;;;AAGD;EAA6H;;;AAC7H;EAAwE;EAAY;;;AAEpF;EACC;EACA;EACA;EACA;;;AAGD;AAEC;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKH;AAAA;EAEC;;;AAGD;EACC;EACA;EACA;EACA;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;AAEA;EACC;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;EACA;;;AAGD;AACA;AAAA;AAAA;AAAA;EAIC;;;AAGD;AACA;EACC;;;AAGD;AAGC;AAAA;EACC;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA;;;AAIF;AAAA;EAEC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EAA2C;EAAwC;EAAsC;;;AAG1H;AAAA;EAEC;EACA;EACA;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EAAsC;;;AAEtC;AACA;EACC;;;AAGD;EACC;;;AAGD;AACA;AAAA;EAEC;EACA;;;AAGD;AACA;EACC;EACA;;;AAGD;EACC;;;AAGD;AAAA;AAAA;AAIC;EACC;;AAGD;EACC;;AAGD;EACC;;;AAIF;EACC;EACA;EACA;;;AAGD;AACA;EACI;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACC;EACA;EACA;;;AAGD;EACC;;;AAED;EACC;EACA;EACA;;;AAGD;EACC;;;AAIA;EACC;EACA;EACA;EACA;;AACA;EACC;;AACA;AACC;AACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAGF;EACC;EACA;EACA;EACA;;AAGA;EACC;;AAID;AAAA;EAEC;;AAED;EACC;;AACA;EACC;;AAIH;EACC;;AAED;EACC;EACA;;AAGF;EACC;;AAED;EACC;;;AAKF;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AAAA;AAAA;AAAA;EAKC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;;;AAGD;EACC;AACA;EAEA;;;AAED;EACC;AACA;EACA;;;AAED;AAAA;AAAA;AAGA;EACC;;;AAED;AAAA;AAAA;AAAA;EAIC;;;AAED;EACC;EACA;EACA;;;AAED;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;EACA;AAEA;EACA;;;AAED;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;AAEA;;AACA;EACC;;;AAIF;AAAA;AAAA;AAAA;EAIC;EACA;EACA;;;AAMA;EACC;;AAED;AChwBA;EAEA;;;ADmwBD;AAAA;AAAA;EAGC;;;AAGD;AAAA;AAAA;EAGC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAED;EACC;;AACA;EACC;;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAGD;EACC;EACA;EACA;;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAKA;EACC;;AAIF;EACC;EACA;;;AAIF;AACA;AAIC;AAaA;AAoOA;;AA/OC;EACC;EACA;EACA;;AACA;EACC;EACA;;AAMH;EACC;EACA;EACA;EACA;EACA;;AAGA;EACC;EACA;EACA;EACA;;AAEA;AAAA;EAKC;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGC;;AAKH;EACC;EACA;AAmJA;AA8BA;;AA9KC;EACC;EACA;EACA;EACA,OAvDQ;EAwDR,QAxDQ;EAyDR,SAxDO;EAyDP;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACC,SA1EK;EA2EL;EACA;EACA;;AAKH;EACC;EACA;EACA;EACA;EAEA;EACA;EAEA;;AAGD;EACC;EACA;EAIA;EAKA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;AAoBA;;AAlBA;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AAID;EACC;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC,SApJK;EAqJL;EACA;EACA;EACA;EACA;;AAGA;EACC;;AAQH;EACC;;AAEA;EACC;EACA;;AAIF;EACC;;AAGD;EACC;;AAIF;EACC;EACA;;AAEA;EACC;EACA;;AAMH;EAEC;;AAGD;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA,SAvNO;;AAwNP;EACC;EACA,OA1NM;EA2NN,QA3NM;;AAiOT;EACC;EACA;EACA;AAEA;;AACA;EACC;EACA;;AAMJ;EACC;;AAID;EACC;;AAEA;EACC;EACA;EAEA;;AAEA;EACC;;AAEA;EAEC;;AAGD;EACI;;;AAOR;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAGC;;AAGD;EAEC;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAKA;EACC;EACA;;;AAGD;AACA;AAaC;;AAZA;AACC;AAKA;;AAJA;EACC;;AAID;EACC;;AAKF;EACC;EACA;;;AAIF;AACA;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC;EACA;EACA;;;AE/uCF;EACC;EACA;EACA;EACA;AAAuB;EACvB;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EAAsB;;;AACtB;EAAoB;EAAgB;EAAY;EAAU;EAAW;EAAgB;;;AAErF;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAED;EACC;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;EAEC;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;EACA;EACA;;;AAED;EACC;;;AAGD;EACC;EACA;;AAEA;EACC;;;AAIF;EACC;EACA;EACA;EACA;;;AAGD;EACE;IAAK;;EACL;IAAO;;;AAET;EACE;IAAK;;EACL;IAAO;;;AAET;EACE;IAAK;;EACL;IAAO;;;AAET;EACE;IAAK;;EACL;IAAO;;;AHjNT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AIEA;AAAA;AAAA;AAIA;EAEA;IACC;;;EAGD;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;;;EAGD;IACC;;;EAGD;IACC;;;AAED;AACA;EACA;IACC;IACA;IACA;IACA;IACA;IACA;;;AAID;EACA;IACC;;;AAED;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAID;AACC;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;;;AClFF;EACC;EACA;;;AAGD;EACC;;;AAID;EACC;EACA;;;AAGD;EACC;EACA;EACA;;AAEA;EAEC;;;AAGF;EACC;EACA;;;AAGD;EACC;EACA;AAAqB;EACrB;;;AAGD;EACC;AAAW;;;AAGZ;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;AAAwB;;;AAGzB;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;AAA0B;EAC1B;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AC/HD;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE","file":"merged.css"}
\ No newline at end of file diff --git a/apps/files/css/mobile.css b/apps/files/css/mobile.css index 9cdbad85156..1cd122d60ec 100644 --- a/apps/files/css/mobile.css +++ b/apps/files/css/mobile.css @@ -28,9 +28,9 @@ background-color: rgb(255, 255, 255) !important; } - table th#headerSize, + table th.column-size, table td.filesize, -table th#headerDate, +table th.column-mtime, table td.date { display: none; } @@ -45,17 +45,17 @@ table td.date { padding-left: 0; } - #fileList a.action.action-menu img { + .fileList a.action.action-menu img { padding-left: 0; } - #fileList .fileActionsMenu { + .fileList .fileActionsMenu { margin-right: 6px; } /* hide text of the share action on mobile */ /* .hidden-visually for accessbility */ - #fileList a.action-share span:not(.icon):not(.avatar) { + .fileList a.action-share span:not(.icon):not(.avatar) { position: absolute; left: -10000px; top: auto; @@ -64,11 +64,6 @@ table td.date { overflow: hidden; } - /* proper notification area for multi line messages */ - #notification-container { - display: flex; - } - /* shorten elements for mobile */ #uploadprogressbar, #uploadprogressbar .label.inner { width: 50px; diff --git a/apps/files/css/mobile.css.map b/apps/files/css/mobile.css.map index 83b1e827b33..11729879c85 100644 --- a/apps/files/css/mobile.css.map +++ b/apps/files/css/mobile.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","mobile.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;AAAA;AAAA;AAIA;EAEA;IACC;;;EAGD;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;;;EAGD;IACC;;;EAGD;IACC;;;AAED;AACA;EACA;IACC;IACA;IACA;IACA;IACA;IACA;;;AAID;EACA;IACC;;;AAGD;EACA;IACC;;;AAED;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAID;AACC;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC","file":"mobile.css"}
\ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","mobile.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;AAAA;AAAA;AAIA;EAEA;IACC;;;EAGD;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;;;EAGD;IACC;;;EAGD;IACC;;;AAED;AACA;EACA;IACC;IACA;IACA;IACA;IACA;IACA;;;AAID;EACA;IACC;;;AAED;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAID;AACC;EACA;IACC;;;EAED;IACC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC","file":"mobile.css"}
\ No newline at end of file diff --git a/apps/files/css/mobile.scss b/apps/files/css/mobile.scss index 7c5fc8fe4a2..ffaf5c68965 100644 --- a/apps/files/css/mobile.scss +++ b/apps/files/css/mobile.scss @@ -10,9 +10,9 @@ $min-table-width: 688px; background-color: rgba(255, 255, 255, 1)!important; } -table th#headerSize, +table th.column-size, table td.filesize, -table th#headerDate, +table th.column-mtime, table td.date { display: none; } @@ -27,16 +27,16 @@ table.multiselect thead { padding-left: 0; } -#fileList a.action.action-menu img { +.fileList a.action.action-menu img { padding-left: 0; } -#fileList .fileActionsMenu { +.fileList .fileActionsMenu { margin-right: 6px; } /* hide text of the share action on mobile */ /* .hidden-visually for accessbility */ -#fileList a.action-share span:not(.icon):not(.avatar) { +.fileList a.action-share span:not(.icon):not(.avatar) { position: absolute; left:-10000px; top: auto; @@ -46,11 +46,6 @@ table.multiselect thead { } -/* proper notification area for multi line messages */ -#notification-container { - display: flex; -} - /* shorten elements for mobile */ #uploadprogressbar, #uploadprogressbar .label.inner { width: 50px; diff --git a/apps/files/css/upload.css b/apps/files/css/upload.css index dc90f5a793e..b5e3624052b 100644 --- a/apps/files/css/upload.css +++ b/apps/files/css/upload.css @@ -36,18 +36,18 @@ overflow: visible; } -#uploadprogresswrapper, #uploadprogresswrapper * { +.uploadprogresswrapper, .uploadprogresswrapper * { box-sizing: border-box; } -#uploadprogresswrapper { +.uploadprogresswrapper { display: inline-block; vertical-align: top; height: 36px; margin-left: 3px; } -#uploadprogresswrapper > input[type=button] { +.uploadprogresswrapper > input[type=button] { height: 36px; margin-left: 3px; } diff --git a/apps/files/css/upload.scss b/apps/files/css/upload.scss index e7c1e9442e2..35fc763100e 100644 --- a/apps/files/css/upload.scss +++ b/apps/files/css/upload.scss @@ -23,17 +23,17 @@ .file_upload_target { display:none; } .file_upload_form { display:inline; float:left; margin:0; padding:0; cursor:pointer; overflow:visible; } -#uploadprogresswrapper, #uploadprogresswrapper * { +.uploadprogresswrapper, .uploadprogresswrapper * { box-sizing: border-box; } -#uploadprogresswrapper { +.uploadprogresswrapper { display: inline-block; vertical-align: top; height: 36px; margin-left: 3px; } -#uploadprogresswrapper > input[type='button'] { +.uploadprogresswrapper > input[type='button'] { height: 36px; margin-left: 3px; } diff --git a/apps/files/js/favoritesfilelist.js b/apps/files/js/favoritesfilelist.js index 737f2fd6e96..7ea41da8143 100644 --- a/apps/files/js/favoritesfilelist.js +++ b/apps/files/js/favoritesfilelist.js @@ -18,7 +18,7 @@ window.addEventListener('DOMContentLoaded', function() { * @classdesc Favorites file list. * Displays the list of files marked as favorites * - * @param $el container element with existing markup for the #controls + * @param $el container element with existing markup for the .files-controls * and a table * @param [options] map of options, see other parameters */ @@ -48,8 +48,8 @@ window.addEventListener('DOMContentLoaded', function() { var dir = this.getCurrentDirectory(); if (dir === '/') { // root has special permissions - this.$el.find('#emptycontent').toggleClass('hidden', !this.isEmpty); - this.$el.find('#filestable thead th').toggleClass('hidden', this.isEmpty); + this.$el.find('.emptyfilelist.emptycontent').toggleClass('hidden', !this.isEmpty); + this.$el.find('.files-filestable thead th').toggleClass('hidden', this.isEmpty); } else { OCA.Files.FileList.prototype.updateEmptyContent.apply(this, arguments); diff --git a/apps/files/js/file-upload.js b/apps/files/js/file-upload.js index 648a5a0307b..dc38f731108 100644 --- a/apps/files/js/file-upload.js +++ b/apps/files/js/file-upload.js @@ -1030,7 +1030,7 @@ OC.Uploader.prototype = _.extend({ // check free space if (!self.fileList || upload.getTargetFolder() === self.fileList.getCurrentDirectory()) { // Use global free space if there is no file list to check or the current directory is the target - freeSpace = $('#free_space').val() + freeSpace = $('input[name=free_space]').val() } else if (upload.getTargetFolder().indexOf(self.fileList.getCurrentDirectory()) === 0) { // Check subdirectory free space if file is uploaded there // Retrieve the folder destination name @@ -1266,7 +1266,7 @@ OC.Uploader.prototype = _.extend({ }); fileupload.on('fileuploaddragover', function(e){ $('#app-content').addClass('file-drag'); - $('#emptycontent .icon-folder').addClass('icon-filetype-folder-drag-accept'); + $('.emptyfilelist.emptycontent .icon-folder').addClass('icon-filetype-folder-drag-accept'); var filerow = $(e.delegatedEvent.target).closest('tr'); diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index d745f3368a5..b5bd1509d9f 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -18,7 +18,7 @@ * A file list view consists of a controls bar and * a file list table. * - * @param $el container element with existing markup for the #controls + * @param $el container element with existing markup for the .files-controls * and a table * @param {Object} [options] map of options, see other parameters * @param {Object} [options.scrollContainer] scrollable container, defaults to $(window) @@ -224,13 +224,14 @@ /** * Initialize the file list and its components * - * @param $el container element with existing markup for the #controls + * @param $el container element with existing markup for the .files-controls * and a table * @param options map of options, see other parameters * @param options.scrollContainer scrollable container, defaults to $(window) * @param options.dragOptions drag options, disabled by default * @param options.folderDropOptions folder drop options, disabled by default * @param options.scrollTo name of file to scroll to after the first load + * @param [options.dir='/'] current directory * @param {OC.Files.Client} [options.filesClient] files API client * @param {OC.Backbone.Model} [options.filesConfig] files app configuration * @private @@ -276,9 +277,9 @@ } this.$container = options.scrollContainer || $(window); this.$table = $el.find('table:first'); - this.$fileList = $el.find('#fileList'); - this.$header = $el.find('#filelist-header'); - this.$footer = $el.find('#filelist-footer'); + this.$fileList = $el.find('.files-fileList'); + this.$header = $el.find('.filelist-header'); + this.$footer = $el.find('.filelist-footer'); if (!_.isUndefined(this._filesConfig)) { this._filesConfig.on('change:showhidden', function() { @@ -357,7 +358,7 @@ } this.breadcrumb = new OCA.Files.BreadCrumb(breadcrumbOptions); - var $controls = this.$el.find('#controls'); + var $controls = this.$el.find('.files-controls'); if ($controls.length > 0) { $controls.prepend(this.breadcrumb.$el); this.$table.addClass('has-controls'); @@ -414,6 +415,10 @@ }); } + if (!_.isUndefined(options.dir)) { + this._setCurrentDir(options.dir || '/', false); + } + if(options.openFile) { // Wait for some initialisation process to be over before triggering the default action. _.defer(() => { @@ -735,7 +740,7 @@ _onResize: function() { var containerWidth = this.$el.width(); var actionsWidth = 0; - $.each(this.$el.find('#controls .actions'), function(index, action) { + $.each(this.$el.find('.files-controls .actions'), function(index, action) { actionsWidth += $(action).outerWidth(); }); @@ -763,7 +768,7 @@ isGridView ? t('files', 'Show list view') : t('files', 'Show grid view'), ) - $('.list-container').toggleClass('view-grid', isGridView); + this.$table.toggleClass('view-grid', isGridView); if (isGridView) { // If switching into grid view from list view, too few files might be displayed // Try rendering the next page @@ -1901,6 +1906,7 @@ * @return new tr element (not appended to the table) */ add: function(fileData, options) { + var self = this; var index; var $tr; var $rows; @@ -1943,7 +1949,7 @@ $tr.addClass('appear transparent'); window.setTimeout(function() { $tr.removeClass('transparent'); - $("#fileList tr").removeClass('mouseOver'); + self.$fileList.find('tr').removeClass('mouseOver'); $tr.addClass('mouseOver'); }); } @@ -2051,7 +2057,7 @@ * @return current directory */ getCurrentDirectory: function(){ - return this._currentDirectory || this.$el.find('#dir').val() || '/'; + return this._currentDirectory || '/'; }, /** * Returns the directory permissions @@ -2133,9 +2139,6 @@ } this._currentDirectory = targetDir; - // legacy stuff - this.$el.find('#dir').val(targetDir); - if (changeUrl !== false) { var params = { dir: targetDir, @@ -2475,7 +2478,7 @@ * @param show true for enabling, false for disabling */ showActions: function(show){ - this.$el.find('.actions,#file_action_panel').toggleClass('hidden', !show); + this.$el.find('.actions').toggleClass('hidden', !show); if (show){ // make sure to display according to permissions var permissions = this.getDirectoryPermissions(); @@ -2483,7 +2486,7 @@ this.$el.find('.creatable').toggleClass('hidden', !isCreatable); this.$el.find('.notCreatable').toggleClass('hidden', isCreatable); // remove old style breadcrumbs (some apps might create them) - this.$el.find('#controls .crumb').remove(); + this.$el.find('.files-controls .crumb').remove(); // refresh breadcrumbs in case it was replaced by an app this.breadcrumb.render(); } @@ -2499,7 +2502,7 @@ */ setViewerMode: function(show){ this.showActions(!show); - this.$el.find('#filestable').toggleClass('hidden', show); + this.$el.find('.files-filestable').toggleClass('hidden', show); this.$el.trigger(new $.Event('changeViewerMode', {viewerModeEnabled: show})); }, /** @@ -3307,11 +3310,11 @@ updateEmptyContent: function() { var permissions = this.getDirectoryPermissions(); var isCreatable = (permissions & OC.PERMISSION_CREATE) !== 0; - this.$el.find('#emptycontent').toggleClass('hidden', !this.isEmpty); - this.$el.find('#emptycontent').toggleClass('hidden', !this.isEmpty); - this.$el.find('#emptycontent .uploadmessage').toggleClass('hidden', !isCreatable || !this.isEmpty); - this.$el.find('#filestable').toggleClass('hidden', this.isEmpty); - this.$el.find('#filestable thead th').toggleClass('hidden', this.isEmpty); + this.$el.find('.emptyfilelist.emptycontent').toggleClass('hidden', !this.isEmpty); + this.$el.find('.emptyfilelist.emptycontent').toggleClass('hidden', !this.isEmpty); + this.$el.find('.emptyfilelist.emptycontent .uploadmessage').toggleClass('hidden', !isCreatable || !this.isEmpty); + this.$el.find('.files-filestable').toggleClass('hidden', this.isEmpty); + this.$el.find('.files-filestable thead th').toggleClass('hidden', this.isEmpty); }, /** * Shows the loading mask. @@ -3326,7 +3329,7 @@ } this.$table.addClass('hidden'); - this.$el.find('#emptycontent').addClass('hidden'); + this.$el.find('.emptyfilelist.emptycontent').addClass('hidden'); $mask = $('<div class="mask transparent icon-loading"></div>'); @@ -3411,8 +3414,8 @@ }, hideIrrelevantUIWhenNoFilesMatch:function() { if (this._filter && this.fileSummary.summary.totalDirs + this.fileSummary.summary.totalFiles === 0) { - this.$el.find('#filestable thead th').addClass('hidden'); - this.$el.find('#emptycontent').addClass('hidden'); + this.$el.find('.files-filestable thead th').addClass('hidden'); + this.$el.find('.emptyfilelist.emptycontent').addClass('hidden'); $('#searchresults').addClass('filter-empty'); $('#searchresults .emptycontent').addClass('emptycontent-search'); if ( $('#searchresults').length === 0 || $('#searchresults').hasClass('hidden') ) { @@ -3428,9 +3431,9 @@ } else { $('#searchresults').removeClass('filter-empty'); $('#searchresults .emptycontent').removeClass('emptycontent-search'); - this.$el.find('#filestable thead th').toggleClass('hidden', this.isEmpty); + this.$el.find('.files-filestable thead th').toggleClass('hidden', this.isEmpty); if (!this.$el.find('.mask').exists()) { - this.$el.find('#emptycontent').toggleClass('hidden', !this.isEmpty); + this.$el.find('.emptyfilelist.emptycontent').toggleClass('hidden', !this.isEmpty); } this.$el.find('.nofilterresults').addClass('hidden'); } @@ -3452,15 +3455,15 @@ var showHidden = !!this._filesConfig.get('showhidden'); if (summary.totalFiles === 0 && summary.totalDirs === 0) { - this.$el.find('#headerName a.name>span:first').text(t('files','Name')); - this.$el.find('#headerSize a>span:first').text(t('files','Size')); - this.$el.find('#modified a>span:first').text(t('files','Modified')); + this.$el.find('.column-name a.name>span:first').text(t('files','Name')); + this.$el.find('.column-size a>span:first').text(t('files','Size')); + this.$el.find('.column-mtime a>span:first').text(t('files','Modified')); this.$el.find('table').removeClass('multiselect'); this.$el.find('.selectedActions').addClass('hidden'); } else { this.$el.find('.selectedActions').removeClass('hidden'); - this.$el.find('#headerSize a>span:first').text(OC.Util.humanFileSize(summary.totalSize)); + this.$el.find('.column-size a>span:first').text(OC.Util.humanFileSize(summary.totalSize)); var directoryInfo = n('files', '%n folder', '%n folders', summary.totalDirs); var fileInfo = n('files', '%n file', '%n files', summary.totalFiles); @@ -3482,8 +3485,8 @@ selection += ' (' + hiddenInfo + ')'; } - this.$el.find('#headerName a.name>span:first').text(selection); - this.$el.find('#modified a>span:first').text(''); + this.$el.find('.column-name a.name>span:first').text(selection); + this.$el.find('.column-mtime a>span:first').text(''); this.$el.find('table').addClass('multiselect'); if (this.fileMultiSelectMenu) { @@ -3795,7 +3798,7 @@ } var currentOffset = this.$container.scrollTop(); - var additionalOffset = this.$el.find("#controls").height()+this.$el.find("#controls").offset().top; + var additionalOffset = this.$el.find(".files-controls").height()+this.$el.find(".files-controls").offset().top; // Animation var _this = this; @@ -3838,13 +3841,13 @@ _renderNewButton: function() { // if an upload button (legacy) already exists or no actions container exist, skip - var $actionsContainer = this.$el.find('#controls .actions'); + var $actionsContainer = this.$el.find('.files-controls .actions'); if (!$actionsContainer.length || this.$el.find('.button.upload').length) { return; } var $newButton = $(OCA.Files.Templates['template_addbutton']({ - addText: t('files', 'New'), - iconClass: 'icon-add' + addText: t('files', 'New file/folder menu'), + iconClass: 'icon-add', })); $actionsContainer.prepend($newButton); diff --git a/apps/files/js/files.js b/apps/files/js/files.js index 5f00ce2cb22..1aa39eab523 100644 --- a/apps/files/js/files.js +++ b/apps/files/js/files.js @@ -306,9 +306,6 @@ initialize: function() { Files.bindKeyboardShortcuts(document, $); - // TODO: move file list related code (upload) to OCA.Files.FileList - $('#file_action_panel').attr('activeAction', false); - // drag&drop support using jquery.fileupload // TODO use OC.dialogs $(document).bind('drop dragover', function (e) { diff --git a/apps/files/js/keyboardshortcuts.js b/apps/files/js/keyboardshortcuts.js index b2f2cd0e582..0e716fc6d37 100644 --- a/apps/files/js/keyboardshortcuts.js +++ b/apps/files/js/keyboardshortcuts.js @@ -57,21 +57,21 @@ } function esc() { - $("#controls").trigger('click'); + $(".files-controls").trigger('click'); } function down() { var select = -1; - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if ($(this).hasClass("mouseOver")) { select = index + 1; $(this).removeClass("mouseOver"); } }); if (select === -1) { - $("#fileList tr:first").addClass("mouseOver"); + $(".files-fileList tr:first").addClass("mouseOver"); } else { - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if (index === select) { $(this).addClass("mouseOver"); } @@ -81,16 +81,16 @@ function up() { var select = -1; - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if ($(this).hasClass("mouseOver")) { select = index - 1; $(this).removeClass("mouseOver"); } }); if (select === -1) { - $("#fileList tr:last").addClass("mouseOver"); + $(".files-fileList tr:last").addClass("mouseOver"); } else { - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if (index === select) { $(this).addClass("mouseOver"); } @@ -99,7 +99,7 @@ } function enter() { - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if ($(this).hasClass("mouseOver")) { $(this).removeClass("mouseOver"); $(this).find("span.nametext").trigger('click'); @@ -108,7 +108,7 @@ } function del() { - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if ($(this).hasClass("mouseOver")) { $(this).removeClass("mouseOver"); $(this).find("a.action.delete").trigger('click'); @@ -117,7 +117,7 @@ } function rename() { - $("#fileList tr").each(function(index) { + $(".files-fileList tr").each(function(index) { if ($(this).hasClass("mouseOver")) { $(this).removeClass("mouseOver"); $(this).find("a[data-action='Rename']").trigger('click'); diff --git a/apps/files/js/recentfilelist.js b/apps/files/js/recentfilelist.js index 78eaa0b6858..3b7cd035f2a 100644 --- a/apps/files/js/recentfilelist.js +++ b/apps/files/js/recentfilelist.js @@ -18,7 +18,7 @@ window.addEventListener('DOMContentLoaded', function () { * @classdesc Recent file list. * Displays the list of recently modified files * - * @param $el container element with existing markup for the #controls + * @param $el container element with existing markup for the .files-controls * and a table * @param [options] map of options, see other parameters */ @@ -53,8 +53,8 @@ window.addEventListener('DOMContentLoaded', function () { var dir = this.getCurrentDirectory(); if (dir === '/') { // root has special permissions - this.$el.find('#emptycontent').toggleClass('hidden', !this.isEmpty); - this.$el.find('#filestable thead th').toggleClass('hidden', this.isEmpty); + this.$el.find('.emptyfilelist.emptycontent').toggleClass('hidden', !this.isEmpty); + this.$el.find('.files-filestable thead th').toggleClass('hidden', this.isEmpty); } else { OCA.Files.FileList.prototype.updateEmptyContent.apply(this, arguments); diff --git a/apps/files/templates/list.php b/apps/files/templates/list.php index 9087c86a4a2..13583c23cbf 100644 --- a/apps/files/templates/list.php +++ b/apps/files/templates/list.php @@ -1,9 +1,8 @@ -<div id="controls"> +<div class="files-controls"> <div class="actions creatable hidden"> <div id="uploadprogresswrapper"> </div> </div> - <div id="file_action_panel"></div> <div class="notCreatable notPublic hidden"> <div class="icon-alert-outline"></div> <?php p($l->t('You do not have permission to upload or create files here'))?> @@ -11,7 +10,7 @@ <?php /* Note: the template attributes are here only for the public page. These are normally loaded through ajax instead (updateStorageStatistics). */ ?> - <input type="hidden" name="permissions" value="" id="permissions"> + <input type="hidden" id="permissions" value=""> <input type="hidden" id="free_space" value="<?php isset($_['freeSpace']) ? p($_['freeSpace']) : '' ?>"> <?php if (isset($_['dirToken'])):?> <input type="hidden" id="publicUploadRequestToken" name="requesttoken" value="<?php p($_['requesttoken']) ?>" /> @@ -20,9 +19,9 @@ <input type="hidden" class="max_human_file_size" value="(max <?php isset($_['uploadMaxHumanFilesize']) ? p($_['uploadMaxHumanFilesize']) : ''; ?>)"> </div> -<div id="filelist-header"></div> +<div class="filelist-header"></div> -<div id="emptycontent" class="hidden"> +<div class="emptyfilelist emptycontent hidden"> <div class="icon-folder"></div> <h2><?php p($l->t('No files in here')); ?></h2> <p class="uploadmessage hidden"><?php p($l->t('Upload some content or sync with your devices!')); ?></p> @@ -33,23 +32,23 @@ <h2><?php p($l->t('No entries found in this folder')); ?></h2> <p></p> </div> -<table id="filestable" class="list-container <?php p($_['showgridview'] ? 'view-grid' : '') ?>" data-allow-public-upload="<?php p($_['publicUploadEnabled'])?>" data-preview-x="250" data-preview-y="250"> +<table class="files-filestable list-container <?php p($_['showgridview'] ? 'view-grid' : '') ?>" data-allow-public-upload="<?php p($_['publicUploadEnabled'])?>" data-preview-x="250" data-preview-y="250"> <thead> <tr> - <th id="headerSelection" class="hidden column-selection"> + <th class="hidden column-selection"> <input type="checkbox" id="select_all_files" class="select-all checkbox"/> <label for="select_all_files"> <span class="hidden-visually"><?php p($l->t('Select all'))?></span> </label> </th> - <th id='headerName' class="hidden column-name"> - <div id="headerName-container"> + <th class="hidden column-name"> + <div class="column-name-container"> <a class="name sort columntitle" onclick="event.preventDefault()" href="#" data-sort="name"> <span><?php p($l->t('Name')); ?></span> <span class="sort-indicator"></span> </a> - <span id="selectedActionsList" class="selectedActions"> + <span class="selectedActions"> <a href="#" onclick="event.preventDefault()" class="actions-selected"> <span class="icon icon-more"></span> <span><?php p($l->t('Actions'))?></span> @@ -57,21 +56,20 @@ </span> </div> </th> - <th id="headerSize" class="hidden column-size"> + <th class="hidden column-size"> <a class="size sort columntitle" href="#" onclick="event.preventDefault()" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a> </th> - <th id="headerDate" class="hidden column-mtime"> - <a id="modified" class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> + <th class="hidden column-mtime"> + <a class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> </th> </tr> </thead> - <tbody id="fileList"> + <tbody class="files-fileList"> </tbody> <tfoot> </tfoot> </table> -<div id="filelist-footer"></div> -<input type="hidden" name="dir" id="dir" value="" /> +<div class="filelist-footer"></div> <div class="hiddenuploadfield"> <input type="file" id="file_upload_start" class="hiddenuploadfield" name="files[]" /> </div> diff --git a/apps/files/templates/recentlist.php b/apps/files/templates/recentlist.php index 3a5049bc2de..994dadc2ba4 100644 --- a/apps/files/templates/recentlist.php +++ b/apps/files/templates/recentlist.php @@ -1,9 +1,6 @@ <?php /** @var \OCP\IL10N $l */ ?> -<div id='notification'></div> -<div id="emptycontent" class="hidden"></div> - -<input type="hidden" name="dir" value="" id="dir"> +<div class="emptyfilelist emptycontent hidden"></div> <div class="nofilterresults emptycontent hidden"> <div class="icon-search"></div> @@ -11,21 +8,21 @@ <p></p> </div> -<table id="filestable" class="list-container <?php p($_['showgridview'] ? 'view-grid' : '') ?>"> +<table class="files-filestable list-container <?php p($_['showgridview'] ? 'view-grid' : '') ?>"> <thead> <tr> - <th id='headerName' class="hidden column-name"> - <div id="headerName-container"> + <th class="hidden column-name"> + <div class="column-name-container"> <a class="name sort columntitle" href="#" onclick="event.preventDefault()" data-sort="name"><span><?php p($l->t('Name')); ?></span></a> </div> </th> - <th id="headerSize" class="hidden column-size"> + <th class="hidden column-size"> <a class="size sort columntitle" href="#" onclick="event.preventDefault()" data-sort="size"><span><?php p($l->t('Size')); ?></span></a> </th> - <th id="headerDate" class="hidden column-mtime"> - <a id="modified" class="columntitle" href="#" onclick="event.preventDefault()" + <th class="hidden column-mtime"> + <a class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> <span class="selectedActions"> @@ -37,7 +34,7 @@ </th> </tr> </thead> - <tbody id="fileList"> + <tbody class="files-fileList"> </tbody> <tfoot> </tfoot> diff --git a/apps/files/templates/simplelist.php b/apps/files/templates/simplelist.php index 917fc307ff8..fc0a9fb38c9 100644 --- a/apps/files/templates/simplelist.php +++ b/apps/files/templates/simplelist.php @@ -1,31 +1,27 @@ -<div id='notification'></div> - -<div id="emptycontent" class="hidden"> +<div class="emptyfilelist emptycontent hidden"> <div class="icon-starred"></div> <h2><?php p($l->t('No favorites yet')); ?></h2> <p><?php p($l->t('Files and folders you mark as favorite will show up here')); ?></p> </div> -<input type="hidden" name="dir" value="" id="dir"> - <div class="nofilterresults emptycontent hidden"> <div class="icon-search"></div> <h2><?php p($l->t('No entries found in this folder')); ?></h2> <p></p> </div> -<table id="filestable" class="list-container <?php p($_['showgridview'] ? 'view-grid' : '') ?>"> +<table class="files-filestable list-container <?php p($_['showgridview'] ? 'view-grid' : '') ?>"> <thead> <tr> - <th id='headerName' class="hidden column-name"> - <div id="headerName-container"> + <th class="hidden column-name"> + <div class="column-name-container"> <a class="name sort columntitle" onclick="event.preventDefault()" href="#" data-sort="name"><span><?php p($l->t('Name')); ?></span><span class="sort-indicator"></span></a> </div> </th> - <th id="headerSize" class="hidden column-size"> + <th class="hidden column-size"> <a class="size sort columntitle" onclick="event.preventDefault()" href="#" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a> </th> - <th id="headerDate" class="hidden column-mtime"> - <a id="modified" class="columntitle" onclick="event.preventDefault()" href="#" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> + <th class="hidden column-mtime"> + <a class="columntitle" onclick="event.preventDefault()" href="#" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> <span class="selectedActions"> <a onclick="event.preventDefault()" href="#" class="delete-selected"> <img class="svg" alt="" @@ -36,7 +32,7 @@ </th> </tr> </thead> - <tbody id="fileList"> + <tbody class="files-fileList"> </tbody> <tfoot> </tfoot> diff --git a/apps/files/tests/js/breadcrumbSpec.js b/apps/files/tests/js/breadcrumbSpec.js index 820b0f70569..52c9f51835e 100644 --- a/apps/files/tests/js/breadcrumbSpec.js +++ b/apps/files/tests/js/breadcrumbSpec.js @@ -183,9 +183,9 @@ describe('OCA.Files.BreadCrumb tests', function() { // append dummy navigation and controls // as they are currently used for measurements $('#testArea').append( - '<div id="controls"></div>' + '<div class="files-controls"></div>' ); - $('#controls').append(bc.$el); + $('.files-controls').append(bc.$el); bc.setDirectory(dummyDir); @@ -197,11 +197,11 @@ describe('OCA.Files.BreadCrumb tests', function() { $('div.crumbhome').css('width', 51); $('div.crumbmenu').css('width', 51); - $('#controls').width(1000); + $('.files-controls').width(1000); bc._resize(); // Shrink to show popovermenu - $('#controls').width(300); + $('.files-controls').width(300); bc._resize(); $crumbmenuLink = bc.$el.find('.crumbmenu > a'); @@ -232,9 +232,9 @@ describe('OCA.Files.BreadCrumb tests', function() { // append dummy navigation and controls // as they are currently used for measurements $('#testArea').append( - '<div id="controls"></div>' + '<div class="files-controls"></div>' ); - $('#controls').append(bc.$el); + $('.files-controls').append(bc.$el); // triggers resize implicitly bc.setDirectory(dummyDir); @@ -260,7 +260,7 @@ describe('OCA.Files.BreadCrumb tests', function() { it('Hides breadcrumbs to fit available width', function() { var $crumbs; - $('#controls').width(500); + $('.files-controls').width(500); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -280,7 +280,7 @@ describe('OCA.Files.BreadCrumb tests', function() { it('Hides breadcrumbs to fit available width', function() { var $crumbs; - $('#controls').width(700); + $('.files-controls').width(700); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -306,7 +306,7 @@ describe('OCA.Files.BreadCrumb tests', function() { $(this).css('padding', paddings[index]); }); - $('#controls').width(700); + $('.files-controls').width(700); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -333,7 +333,7 @@ describe('OCA.Files.BreadCrumb tests', function() { $(this).css('margin', margins[index]); }); - $('#controls').width(700); + $('.files-controls').width(700); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -353,7 +353,7 @@ describe('OCA.Files.BreadCrumb tests', function() { it('Hides breadcrumbs to fit available width left by siblings', function() { var $crumbs; - $('#controls').width(700); + $('.files-controls').width(700); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -375,28 +375,28 @@ describe('OCA.Files.BreadCrumb tests', function() { // handling in the browsers used to run the tests. $previousSibling.css('width', '50px'); $previousSibling.css('min-width', '50px'); - $('#controls').prepend($previousSibling); + $('.files-controls').prepend($previousSibling); var $creatableActions = $('<div class="actions creatable"></div>'); // Set both the width and the min-width to even differences in width // handling in the browsers used to run the tests. $creatableActions.css('width', '100px'); $creatableActions.css('min-width', '100px'); - $('#controls').append($creatableActions); + $('.files-controls').append($creatableActions); var $nextHiddenSibling = $('<div class="otherSibling hidden"></div>'); // Set both the width and the min-width to even differences in width // handling in the browsers used to run the tests. $nextHiddenSibling.css('width', '200px'); $nextHiddenSibling.css('min-width', '200px'); - $('#controls').append($nextHiddenSibling); + $('.files-controls').append($nextHiddenSibling); var $nextSibling = $('<div class="otherSibling"></div>'); // Set both the width and the min-width to even differences in width // handling in the browsers used to run the tests. $nextSibling.css('width', '50px'); $nextSibling.css('min-width', '50px'); - $('#controls').append($nextSibling); + $('.files-controls').append($nextSibling); bc._resize(); @@ -415,7 +415,7 @@ describe('OCA.Files.BreadCrumb tests', function() { it('Hides breadcrumbs to fit available width left by siblings with paddings and margins', function() { var $crumbs; - $('#controls').width(700); + $('.files-controls').width(700); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -438,7 +438,7 @@ describe('OCA.Files.BreadCrumb tests', function() { $previousSibling.css('width', '10px'); $previousSibling.css('min-width', '10px'); $previousSibling.css('margin', '20px'); - $('#controls').prepend($previousSibling); + $('.files-controls').prepend($previousSibling); var $creatableActions = $('<div class="actions creatable"></div>'); // Set both the width and the min-width to even differences in width @@ -447,14 +447,14 @@ describe('OCA.Files.BreadCrumb tests', function() { $creatableActions.css('min-width', '20px'); $creatableActions.css('margin-left', '40px'); $creatableActions.css('padding-right', '40px'); - $('#controls').append($creatableActions); + $('.files-controls').append($creatableActions); var $nextHiddenSibling = $('<div class="otherSibling hidden"></div>'); // Set both the width and the min-width to even differences in width // handling in the browsers used to run the tests. $nextHiddenSibling.css('width', '200px'); $nextHiddenSibling.css('min-width', '200px'); - $('#controls').append($nextHiddenSibling); + $('.files-controls').append($nextHiddenSibling); var $nextSibling = $('<div class="otherSibling"></div>'); // Set both the width and the min-width to even differences in width @@ -462,7 +462,7 @@ describe('OCA.Files.BreadCrumb tests', function() { $nextSibling.css('width', '10px'); $nextSibling.css('min-width', '10px'); $nextSibling.css('padding', '20px'); - $('#controls').append($nextSibling); + $('.files-controls').append($nextSibling); bc._resize(); @@ -482,7 +482,7 @@ describe('OCA.Files.BreadCrumb tests', function() { var $crumbs; // enough space - $('#controls').width(1800); + $('.files-controls').width(1800); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -491,7 +491,7 @@ describe('OCA.Files.BreadCrumb tests', function() { expect($crumbs.eq(0).hasClass('hidden')).toEqual(true); // simulate decrease - $('#controls').width(950); + $('.files-controls').width(950); bc._resize(); // Third crumb is hidden and everything else is visible @@ -509,7 +509,7 @@ describe('OCA.Files.BreadCrumb tests', function() { var $crumbs; // enough space - $('#controls').width(1800); + $('.files-controls').width(1800); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -529,7 +529,7 @@ describe('OCA.Files.BreadCrumb tests', function() { // 650 is enough for all the crumbs except the third and fourth // ones, but not enough for the menu and all the crumbs except the // third and fourth ones; the second one has to be hidden too. - $('#controls').width(650); + $('.files-controls').width(650); bc._resize(); // Second, third and fourth crumb are hidden and everything else is @@ -548,7 +548,7 @@ describe('OCA.Files.BreadCrumb tests', function() { var $crumbs; // limited space - $('#controls').width(850); + $('.files-controls').width(850); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -565,7 +565,7 @@ describe('OCA.Files.BreadCrumb tests', function() { expect($crumbs.eq(7).hasClass('hidden')).toEqual(false); // simulate increase - $('#controls').width(1000); + $('.files-controls').width(1000); bc._resize(); // Third crumb is hidden and everything else is visible @@ -583,7 +583,7 @@ describe('OCA.Files.BreadCrumb tests', function() { var $crumbs; // limited space - $('#controls').width(850); + $('.files-controls').width(850); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -601,7 +601,7 @@ describe('OCA.Files.BreadCrumb tests', function() { // simulate increase // 1030 is enough for all the crumbs if the menu is hidden. - $('#controls').width(1030); + $('.files-controls').width(1030); bc._resize(); // Menu is hidden and everything else is visible @@ -629,10 +629,10 @@ describe('OCA.Files.BreadCrumb tests', function() { var $nextSiblingChild = $('<div class="siblingChild"></div>'); $nextSiblingChild.css('margin-left', 'auto'); $nextSibling.append($nextSiblingChild); - $('#controls').append($nextSibling); + $('.files-controls').append($nextSibling); // limited space - $('#controls').width(850); + $('.files-controls').width(850); bc._resize(); $crumbs = bc.$el.find('.crumb'); @@ -649,7 +649,7 @@ describe('OCA.Files.BreadCrumb tests', function() { expect($crumbs.eq(7).hasClass('hidden')).toEqual(false); // simulate increase - $('#controls').width(1000); + $('.files-controls').width(1000); bc._resize(); // Third crumb is hidden and everything else is visible diff --git a/apps/files/tests/js/favoritesfilelistspec.js b/apps/files/tests/js/favoritesfilelistspec.js index 8602288cdde..6cfc078cf26 100644 --- a/apps/files/tests/js/favoritesfilelistspec.js +++ b/apps/files/tests/js/favoritesfilelistspec.js @@ -30,28 +30,27 @@ describe('OCA.Files.FavoritesFileList tests', function() { $('#testArea').append( '<div id="app-content-container">' + // init horrible parameters - '<input type="hidden" id="dir" value="/"></input>' + '<input type="hidden" id="permissions" value="31"></input>' + // dummy controls - '<div id="controls">' + + '<div class="files-controls">' + ' <div class="actions creatable"></div>' + ' <div class="notCreatable"></div>' + '</div>' + // dummy table // TODO: at some point this will be rendered by the fileList class itself! - '<table id="filestable" class="list-container view-grid">' + + '<table class="files-filestable list-container view-grid">' + '<thead><tr>' + - '<th id="headerName" class="hidden column-name">' + + '<th class="hidden column-name">' + '<a class="name columntitle" data-sort="name"><span>Name</span><span class="sort-indicator"></span></a>' + '</th>' + '<th class="hidden column-mtime">' + '<a class="columntitle" data-sort="mtime"><span class="sort-indicator"></span></a>' + '</th>' + '</tr></thead>' + - '<tbody id="fileList"></tbody>' + + '<tbody class="files-fileList"></tbody>' + '<tfoot></tfoot>' + '</table>' + - '<div id="emptycontent">Empty content message</div>' + + '<div class="emptyfilelist emptycontent">Empty content message</div>' + '</div>' ); }); diff --git a/apps/files/tests/js/favoritespluginspec.js b/apps/files/tests/js/favoritespluginspec.js index 94359e0e706..ca0cea8b29a 100644 --- a/apps/files/tests/js/favoritespluginspec.js +++ b/apps/files/tests/js/favoritespluginspec.js @@ -88,7 +88,7 @@ describe('OCA.Files.FavoritesPlugin tests', function() { var setActiveViewStub = sinon.stub(OCA.Files.App, 'setActiveView'); // create dummy table so we can click the dom - var $table = '<table><thead></thead><tbody id="fileList"></tbody></table>'; + var $table = '<table><thead></thead><tbody class="files-fileList"></tbody></table>'; $('#app-content-favorites').append($table); Plugin.favoritesFileList = null; diff --git a/apps/files/tests/js/fileUploadSpec.js b/apps/files/tests/js/fileUploadSpec.js index d8bca4a8ca4..1fac6322808 100644 --- a/apps/files/tests/js/fileUploadSpec.js +++ b/apps/files/tests/js/fileUploadSpec.js @@ -136,19 +136,19 @@ describe('OC.Upload tests', function() { beforeEach(function() { $('#testArea').append( '<div id="tableContainer">' + - '<table id="filestable" class="list-container view-grid">' + + '<table class="files-filestable list-container view-grid">' + '<thead><tr>' + - '<th id="headerName" class="hidden column-name">' + + '<th class="hidden column-name">' + '<input type="checkbox" id="select_all_files" class="select-all">' + '<a class="name columntitle" data-sort="name"><span>Name</span><span class="sort-indicator"></span></a>' + - '<span id="selectedActionsList" class="selectedActions hidden">' + + '<span class="selectedActions hidden">' + '<a href class="download"><img src="actions/download.svg">Download</a>' + '<a href class="delete-selected">Delete</a></span>' + '</th>' + '<th class="hidden column-size"><a class="columntitle" data-sort="size"><span class="sort-indicator"></span></a></th>' + '<th class="hidden column-mtime"><a class="columntitle" data-sort="mtime"><span class="sort-indicator"></span></a></th>' + '</tr></thead>' + - '<tbody id="fileList"></tbody>' + + '<tbody class="files-fileList"></tbody>' + '<tfoot></tfoot>' + '</table>' + '</div>' diff --git a/apps/files/tests/js/fileactionsSpec.js b/apps/files/tests/js/fileactionsSpec.js index cc12bfc7642..7ec9efc43d0 100644 --- a/apps/files/tests/js/fileactionsSpec.js +++ b/apps/files/tests/js/fileactionsSpec.js @@ -33,9 +33,8 @@ describe('OCA.Files.FileActions tests', function() { clock = sinon.useFakeTimers(); // init horrible parameters var $body = $('#testArea'); - $body.append('<input type="hidden" id="dir" value="/subdir"></input>'); $body.append('<input type="hidden" id="permissions" value="31"></input>'); - $body.append('<table id="filestable" class="list-container view-grid"><tbody id="fileList"></tbody></table>'); + $body.append('<table class="files-filestable list-container view-grid"><tbody class="files-fileList"></tbody></table>'); // dummy files table fileActions = new OCA.Files.FileActions(); fileActions.registerAction({ @@ -66,13 +65,14 @@ describe('OCA.Files.FileActions tests', function() { fileList = new OCA.Files.FileList($body, { fileActions: fileActions }); + fileList.changeDirectory('/subdir', false, true); }); afterEach(function() { fileActions = null; fileList.destroy(); fileList = undefined; clock.restore(); - $('#dir, #permissions, #filestable').remove(); + $('#permissions, .files-filestable').remove(); }); it('calling clear() clears file actions', function() { fileActions.clear(); @@ -307,6 +307,8 @@ describe('OCA.Files.FileActions tests', function() { }); it('passes context to action handler', function() { var notifyUpdateListenersSpy = sinon.spy(fileList.fileActions, '_notifyUpdateListeners'); + expect($tr.length).toEqual(1); + expect($tr.find('.action-test').length).toEqual(1); $tr.find('.action-test').click(); expect(actionStub.calledOnce).toEqual(true); expect(actionStub.getCall(0).args[0]).toEqual('testName.txt'); diff --git a/apps/files/tests/js/fileactionsmenuSpec.js b/apps/files/tests/js/fileactionsmenuSpec.js index 7549bd9dc85..a252e75c5e2 100644 --- a/apps/files/tests/js/fileactionsmenuSpec.js +++ b/apps/files/tests/js/fileactionsmenuSpec.js @@ -31,7 +31,6 @@ describe('OCA.Files.FileActionsMenu tests', function() { beforeEach(function() { // init horrible parameters var $body = $('#testArea'); - $body.append('<input type="hidden" id="dir" value="/subdir"></input>'); $body.append('<input type="hidden" id="permissions" value="31"></input>'); // dummy files table actionStub = sinon.stub(); @@ -39,6 +38,7 @@ describe('OCA.Files.FileActionsMenu tests', function() { fileList = new OCA.Files.FileList($body, { fileActions: fileActions }); + fileList.changeDirectory('/subdir', false, true); fileActions.registerAction({ name: 'Testdropdown', @@ -100,7 +100,7 @@ describe('OCA.Files.FileActionsMenu tests', function() { fileList.destroy(); fileList = undefined; menu.remove(); - $('#dir, #permissions, #filestable').remove(); + $('#permissions, .files-filestable').remove(); }); describe('rendering', function() { diff --git a/apps/files/tests/js/filelistSpec.js b/apps/files/tests/js/filelistSpec.js index cd797626d2f..b1153fc0a01 100644 --- a/apps/files/tests/js/filelistSpec.js +++ b/apps/files/tests/js/filelistSpec.js @@ -104,10 +104,9 @@ describe('OCA.Files.FileList tests', function() { $('#testArea').append( '<div id="app-content-files">' + // init horrible parameters - '<input type="hidden" id="dir" value="/subdir"/>' + '<input type="hidden" id="permissions" value="31"/>' + // dummy controls - '<div id="controls">' + + '<div class="files-controls">' + ' <div class="actions creatable"></div>' + ' <div class="notCreatable"></div>' + '</div>' + @@ -115,22 +114,22 @@ describe('OCA.Files.FileList tests', function() { '<input type="file" id="file_upload_start" name="files[]" multiple="multiple">' + // dummy table // TODO: at some point this will be rendered by the fileList class itself! - '<table id="filestable" class="list-container view-grid">' + + '<table class="files-filestable list-container view-grid">' + '<thead><tr>' + - '<th id="headerName" class="hidden column-name">' + + '<th class="hidden column-name">' + '<input type="checkbox" id="select_all_files" class="select-all checkbox">' + '<a class="name columntitle" href="#" onclick="event.preventDefault()" data-sort="name"><span>Name</span><span class="sort-indicator"></span></a>' + - '<span id="selectedActionsList" class="selectedActions hidden">' + + '<span class="selectedActions hidden">' + '<a class="actions-selected" href="#" onclick="event.preventDefault()"><span class="icon icon-more"></span><span>Actions</span></a>' + '</th>' + '<th class="hidden column-size"><a class="columntitle" href="#" onclick="event.preventDefault()" data-sort="size"><span class="sort-indicator"></span></a></th>' + '<th class="hidden column-mtime"><a class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span class="sort-indicator"></span></a></th>' + '</tr></thead>' + - '<tbody id="fileList"></tbody>' + + '<tbody class="files-fileList"></tbody>' + '<tfoot></tfoot>' + '</table>' + // TODO: move to handlebars template - '<div id="emptycontent"><h2>Empty content message</h2><p class="uploadmessage">Upload message</p></div>' + + '<div class="emptyfilelist emptycontent"><h2>Empty content message</h2><p class="uploadmessage">Upload message</p></div>' + '<div class="nofilterresults hidden"></div>' + '</div>' ); @@ -186,6 +185,7 @@ describe('OCA.Files.FileList tests', function() { fileList = new OCA.Files.FileList($('#app-content-files'), { filesClient: filesClient, config: filesConfig, + dir: '/subdir', enableUpload: true, multiSelectMenu: [{ name: 'copyMove', @@ -218,7 +218,7 @@ describe('OCA.Files.FileList tests', function() { }); describe('Getters', function() { it('Returns the current directory', function() { - $('#dir').val('/one/two/three'); + fileList.changeDirectory('/one/two/three', false, true); expect(fileList.getCurrentDirectory()).toEqual('/one/two/three'); }); it('Returns the directory permissions as int', function() { @@ -460,7 +460,7 @@ describe('OCA.Files.FileList tests', function() { fileList.setFiles([]); expect(fileList.isEmpty).toEqual(true); fileList.add(fileData); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(false); // yes, ugly... expect($summary.find('.fileinfo').text()).toEqual('1 file'); @@ -468,8 +468,8 @@ describe('OCA.Files.FileList tests', function() { expect($summary.find('.connector').hasClass('hidden')).toEqual(true); expect($summary.find('.fileinfo').hasClass('hidden')).toEqual(false); expect($summary.find('.filesize').text()).toEqual('12 B'); - expect($('#filestable thead th').hasClass('hidden')).toEqual(false); - expect($('#emptycontent').hasClass('hidden')).toEqual(true); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(false); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(true); expect(fileList.isEmpty).toEqual(false); }); it('correctly adds the extension markup and show hidden files completely in gray', function() { @@ -529,11 +529,11 @@ describe('OCA.Files.FileList tests', function() { $removedEl = fileList.remove('One.txt'); expect($removedEl).toBeDefined(); expect($removedEl.attr('data-file')).toEqual('One.txt'); - expect($('#fileList tr').length).toEqual(3); + expect($('.files-fileList tr').length).toEqual(3); expect(fileList.files.length).toEqual(3); expect(fileList.findFileEl('One.txt').length).toEqual(0); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); expect($summary.find('.fileinfo').text()).toEqual('2 files'); @@ -546,14 +546,14 @@ describe('OCA.Files.FileList tests', function() { var $summary; fileList.setFiles([testFiles[0]]); fileList.remove('One.txt'); - expect($('#fileList tr').length).toEqual(0); + expect($('.files-fileList tr').length).toEqual(0); expect(fileList.files.length).toEqual(0); expect(fileList.findFileEl('One.txt').length).toEqual(0); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(true); - expect($('#filestable thead th').hasClass('hidden')).toEqual(true); - expect($('#emptycontent').hasClass('hidden')).toEqual(false); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(true); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(false); expect(fileList.isEmpty).toEqual(true); }); }); @@ -603,7 +603,7 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.findFileEl('Three.pdf').length).toEqual(1); expect(fileList.$fileList.find('tr').length).toEqual(2); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); expect($summary.find('.fileinfo').text()).toEqual('1 file'); @@ -611,8 +611,8 @@ describe('OCA.Files.FileList tests', function() { expect($summary.find('.fileinfo').hasClass('hidden')).toEqual(false); expect($summary.find('.filesize').text()).toEqual('57 KB'); expect(fileList.isEmpty).toEqual(false); - expect($('#filestable thead th').hasClass('hidden')).toEqual(false); - expect($('#emptycontent').hasClass('hidden')).toEqual(true); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(false); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(true); expect(notificationStub.notCalled).toEqual(true); }).then(done, done); @@ -677,12 +677,12 @@ describe('OCA.Files.FileList tests', function() { return doDelete().then(function(){ expect(fileList.$fileList.find('tr').length).toEqual(0); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(true); expect(fileList.isEmpty).toEqual(true); expect(fileList.files.length).toEqual(0); - expect($('#filestable thead th').hasClass('hidden')).toEqual(true); - expect($('#emptycontent').hasClass('hidden')).toEqual(false); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(true); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(false); }).then(done, done); }); it('bring back deleted item when delete call failed', function(done) { @@ -804,7 +804,7 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.$fileList.find('.test').length).toEqual(0); }); it('Leaves the summary alone when reinserting renamed element', function() { - var $summary = $('#filestable .summary'); + var $summary = $('.files-filestable .summary'); doRename(); deferredRename.resolve(201); @@ -813,7 +813,7 @@ describe('OCA.Files.FileList tests', function() { expect($summary.find('.fileinfo').text()).toEqual('3 files'); }); it('Leaves the summary alone when cancel renaming', function() { - var $summary = $('#filestable .summary'); + var $summary = $('.files-filestable .summary'); doCancelRename(); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); expect($summary.find('.fileinfo').text()).toEqual('3 files'); @@ -1105,7 +1105,7 @@ describe('OCA.Files.FileList tests', function() { describe('Update file', function() { it('does not change summary', function() { - var $summary = $('#filestable .summary'); + var $summary = $('.files-filestable .summary'); var fileData = new FileInfo({ type: 'file', name: 'test file', @@ -1127,14 +1127,14 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.files.length).toEqual(0); expect(fileList.files).toEqual([]); fileList.setFiles(testFiles); - expect($('#fileList tr').length).toEqual(4); + expect($('.files-fileList tr').length).toEqual(4); expect(fileList.files.length).toEqual(4); expect(fileList.files).toEqual(testFiles); }); it('updates summary using the file sizes', function() { var $summary; fileList.setFiles(testFiles); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); expect($summary.find('.fileinfo').text()).toEqual('3 files'); @@ -1142,23 +1142,23 @@ describe('OCA.Files.FileList tests', function() { }); it('shows headers, summary and hide empty content message after setting files', function(){ fileList.setFiles(testFiles); - expect($('#filestable thead th').hasClass('hidden')).toEqual(false); - expect($('#emptycontent').hasClass('hidden')).toEqual(true); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(false); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(true); expect(fileList.$el.find('.summary').hasClass('hidden')).toEqual(false); }); it('hides headers, summary and show empty content message after setting empty file list', function(){ fileList.setFiles([]); - expect($('#filestable thead th').hasClass('hidden')).toEqual(true); - expect($('#emptycontent').hasClass('hidden')).toEqual(false); - expect($('#emptycontent .uploadmessage').hasClass('hidden')).toEqual(false); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(true); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(false); + expect($('.emptyfilelist.emptycontent .uploadmessage').hasClass('hidden')).toEqual(false); expect(fileList.$el.find('.summary').hasClass('hidden')).toEqual(true); }); it('hides headers, upload message, and summary when list is empty and user has no creation permission', function(){ $('#permissions').val(0); fileList.setFiles([]); - expect($('#filestable thead th').hasClass('hidden')).toEqual(true); - expect($('#emptycontent').hasClass('hidden')).toEqual(false); - expect($('#emptycontent .uploadmessage').hasClass('hidden')).toEqual(true); + expect($('.files-filestable thead th').hasClass('hidden')).toEqual(true); + expect($('.emptyfilelist.emptycontent').hasClass('hidden')).toEqual(false); + expect($('.emptyfilelist.emptycontent .uploadmessage').hasClass('hidden')).toEqual(true); expect(fileList.$el.find('.summary').hasClass('hidden')).toEqual(true); }); it('calling findFileEl() can find existing file element', function() { @@ -1170,7 +1170,7 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.findFileEl('unexist.dat').length).toEqual(0); }); it('only add file if in same current directory', function() { - $('#dir').val('/current dir'); + fileList.changeDirectory('/current dir', false, true); var fileData = { type: 'file', name: 'testFile.txt', @@ -1220,7 +1220,7 @@ describe('OCA.Files.FileList tests', function() { var $summary; // single file fileList.setFiles([testFiles[0]]); - $summary = $('#filestable .summary'); + $summary = $('.files-filestable .summary'); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').hasClass('hidden')).toEqual(true); expect($summary.find('.fileinfo').text()).toEqual('1 file'); @@ -1235,18 +1235,18 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.files.length).toEqual(0); expect(fileList.files).toEqual([]); fileList.setFiles(testFiles); - var $summary = $('#filestable .summary'); + var $summary = $('.files-filestable .summary'); var $nofilterresults = fileList.$el.find(".nofilterresults"); expect($nofilterresults.length).toEqual(1); expect($summary.hasClass('hidden')).toEqual(false); - expect($('#fileList tr:not(.hidden)').length).toEqual(4); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(4); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(false); expect($nofilterresults.hasClass('hidden')).toEqual(true); fileList.setFilter('e'); - expect($('#fileList tr:not(.hidden)').length).toEqual(3); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(3); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); @@ -1255,7 +1255,7 @@ describe('OCA.Files.FileList tests', function() { expect($nofilterresults.hasClass('hidden')).toEqual(true); fileList.setFilter('ee'); - expect($('#fileList tr:not(.hidden)').length).toEqual(1); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(1); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').hasClass('hidden')).toEqual(true); @@ -1264,13 +1264,13 @@ describe('OCA.Files.FileList tests', function() { expect($nofilterresults.hasClass('hidden')).toEqual(true); fileList.setFilter('eee'); - expect($('#fileList tr:not(.hidden)').length).toEqual(0); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(0); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(true); expect($nofilterresults.hasClass('hidden')).toEqual(false); fileList.setFilter('ee'); - expect($('#fileList tr:not(.hidden)').length).toEqual(1); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(1); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').hasClass('hidden')).toEqual(true); @@ -1279,7 +1279,7 @@ describe('OCA.Files.FileList tests', function() { expect($nofilterresults.hasClass('hidden')).toEqual(true); fileList.setFilter('e'); - expect($('#fileList tr:not(.hidden)').length).toEqual(3); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(3); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); @@ -1288,7 +1288,7 @@ describe('OCA.Files.FileList tests', function() { expect($nofilterresults.hasClass('hidden')).toEqual(true); fileList.setFilter(''); - expect($('#fileList tr:not(.hidden)').length).toEqual(4); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(4); expect(fileList.files.length).toEqual(4); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').text()).toEqual('1 folder'); @@ -1296,12 +1296,12 @@ describe('OCA.Files.FileList tests', function() { expect($nofilterresults.hasClass('hidden')).toEqual(true); }); it('filters the list of non-rendered rows using filter()', function() { - var $summary = $('#filestable .summary'); + var $summary = $('.files-filestable .summary'); var $nofilterresults = fileList.$el.find(".nofilterresults"); fileList.setFiles(generateFiles(0, 64)); fileList.setFilter('63'); - expect($('#fileList tr:not(.hidden)').length).toEqual(1); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(1); expect($summary.hasClass('hidden')).toEqual(false); expect($summary.find('.dirinfo').hasClass('hidden')).toEqual(true); expect($summary.find('.fileinfo').text()).toEqual('1 file'); @@ -1312,27 +1312,27 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.files.length).toEqual(0); expect(fileList.files).toEqual([]); fileList.setFiles([]); - var $summary = $('#filestable .summary'); - var $emptycontent = fileList.$el.find("#emptycontent"); + var $summary = $('.files-filestable .summary'); + var $emptycontent = fileList.$el.find(".emptyfilelist.emptycontent"); var $nofilterresults = fileList.$el.find(".nofilterresults"); expect($emptycontent.length).toEqual(1); expect($nofilterresults.length).toEqual(1); - expect($('#fileList tr:not(.hidden)').length).toEqual(0); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(0); expect(fileList.files.length).toEqual(0); expect($summary.hasClass('hidden')).toEqual(true); expect($emptycontent.hasClass('hidden')).toEqual(false); expect($nofilterresults.hasClass('hidden')).toEqual(true); fileList.setFilter('e'); - expect($('#fileList tr:not(.hidden)').length).toEqual(0); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(0); expect(fileList.files.length).toEqual(0); expect($summary.hasClass('hidden')).toEqual(true); expect($emptycontent.hasClass('hidden')).toEqual(true); expect($nofilterresults.hasClass('hidden')).toEqual(false); fileList.setFilter(''); - expect($('#fileList tr:not(.hidden)').length).toEqual(0); + expect($('.files-fileList tr:not(.hidden)').length).toEqual(0); expect(fileList.files.length).toEqual(0); expect($summary.hasClass('hidden')).toEqual(true); expect($emptycontent.hasClass('hidden')).toEqual(false); @@ -1343,7 +1343,7 @@ describe('OCA.Files.FileList tests', function() { expect(fileList.files).toEqual([]); fileList.showMask(); fileList.setFiles(testFiles); - var $emptycontent = fileList.$el.find("#emptycontent"); + var $emptycontent = fileList.$el.find(".emptyfilelist.emptycontent"); var $nofilterresults = fileList.$el.find(".nofilterresults"); expect($emptycontent.length).toEqual(1); expect($nofilterresults.length).toEqual(1); @@ -1368,7 +1368,7 @@ describe('OCA.Files.FileList tests', function() { }); it('renders only the first page', function() { expect(fileList.files.length).toEqual(65); - expect($('#fileList tr').length).toEqual(20); + expect($('.files-fileList tr').length).toEqual(20); }); it('renders the full first page despite hidden rows', function() { filesConfig.set('showhidden', false); @@ -1382,7 +1382,7 @@ describe('OCA.Files.FileList tests', function() { fileList.setFiles(files); expect(fileList.files.length).toEqual(25); // render 24 hidden elements + the visible one - expect($('#fileList tr').length).toEqual(25); + expect($('.files-fileList tr').length).toEqual(25); }); it('renders the full first page despite hidden rows', function() { filesConfig.set('showhidden', true); @@ -1396,19 +1396,19 @@ describe('OCA.Files.FileList tests', function() { fileList.setFiles(files); expect(fileList.files.length).toEqual(25); // render 20 first hidden elements as visible - expect($('#fileList tr').length).toEqual(20); + expect($('.files-fileList tr').length).toEqual(20); }); it('renders the second page when scrolling down (trigger nextPage)', function() { // TODO: can't simulate scrolling here, so calling nextPage directly fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(40); + expect($('.files-fileList tr').length).toEqual(40); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(60); + expect($('.files-fileList tr').length).toEqual(60); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(65); + expect($('.files-fileList tr').length).toEqual(65); fileList._nextPage(true); // stays at 65 - expect($('#fileList tr').length).toEqual(65); + expect($('.files-fileList tr').length).toEqual(65); }); it('inserts into the DOM if insertion point is in the visible page ', function() { fileList.add({ @@ -1416,7 +1416,7 @@ describe('OCA.Files.FileList tests', function() { type: 'file', name: 'File with index 15b.txt' }); - expect($('#fileList tr').length).toEqual(21); + expect($('.files-fileList tr').length).toEqual(21); expect(fileList.findFileEl('File with index 15b.txt').index()).toEqual(16); }); it('does not inserts into the DOM if insertion point is not the visible page ', function() { @@ -1425,10 +1425,10 @@ describe('OCA.Files.FileList tests', function() { type: 'file', name: 'File with index 28b.txt' }); - expect($('#fileList tr').length).toEqual(20); + expect($('.files-fileList tr').length).toEqual(20); expect(fileList.findFileEl('File with index 28b.txt').length).toEqual(0); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(40); + expect($('.files-fileList tr').length).toEqual(40); expect(fileList.findFileEl('File with index 28b.txt').index()).toEqual(29); }); it('appends into the DOM when inserting a file after the last visible element', function() { @@ -1437,43 +1437,43 @@ describe('OCA.Files.FileList tests', function() { type: 'file', name: 'File with index 19b.txt' }); - expect($('#fileList tr').length).toEqual(21); + expect($('.files-fileList tr').length).toEqual(21); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(41); + expect($('.files-fileList tr').length).toEqual(41); }); it('appends into the DOM when inserting a file on the last page when visible', function() { fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(40); + expect($('.files-fileList tr').length).toEqual(40); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(60); + expect($('.files-fileList tr').length).toEqual(60); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(65); + expect($('.files-fileList tr').length).toEqual(65); fileList._nextPage(true); fileList.add({ id: 2000, type: 'file', name: 'File with index 88.txt' }); - expect($('#fileList tr').length).toEqual(66); + expect($('.files-fileList tr').length).toEqual(66); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(66); + expect($('.files-fileList tr').length).toEqual(66); }); it('shows additional page when appending a page of files and scrolling down', function() { var newFiles = generateFiles(66, 81); for (var i = 0; i < newFiles.length; i++) { fileList.add(newFiles[i]); } - expect($('#fileList tr').length).toEqual(20); + expect($('.files-fileList tr').length).toEqual(20); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(40); + expect($('.files-fileList tr').length).toEqual(40); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(60); + expect($('.files-fileList tr').length).toEqual(60); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(80); + expect($('.files-fileList tr').length).toEqual(80); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(81); + expect($('.files-fileList tr').length).toEqual(81); fileList._nextPage(true); - expect($('#fileList tr').length).toEqual(81); + expect($('.files-fileList tr').length).toEqual(81); }); it('automatically renders next page when there are not enough elements visible', function() { // delete the 15 first elements @@ -1481,7 +1481,7 @@ describe('OCA.Files.FileList tests', function() { fileList.remove(fileList.files[0].name); } // still makes sure that there are 20 elements visible, if any - expect($('#fileList tr').length).toEqual(25); + expect($('.files-fileList tr').length).toEqual(25); }); }); describe('file previews', function() { @@ -1635,14 +1635,14 @@ describe('OCA.Files.FileList tests', function() { describe('viewer mode', function() { it('enabling viewer mode hides files table and action buttons', function() { fileList.setViewerMode(true); - expect($('#filestable').hasClass('hidden')).toEqual(true); + expect($('.files-filestable').hasClass('hidden')).toEqual(true); expect($('.actions').hasClass('hidden')).toEqual(true); expect($('.notCreatable').hasClass('hidden')).toEqual(true); }); it('disabling viewer mode restores files table and action buttons', function() { fileList.setViewerMode(true); fileList.setViewerMode(false); - expect($('#filestable').hasClass('hidden')).toEqual(false); + expect($('.files-filestable').hasClass('hidden')).toEqual(false); expect($('.actions').hasClass('hidden')).toEqual(false); expect($('.notCreatable').hasClass('hidden')).toEqual(true); }); @@ -1650,7 +1650,7 @@ describe('OCA.Files.FileList tests', function() { $('#permissions').val(0); fileList.setViewerMode(true); fileList.setViewerMode(false); - expect($('#filestable').hasClass('hidden')).toEqual(false); + expect($('.files-filestable').hasClass('hidden')).toEqual(false); expect($('.actions').hasClass('hidden')).toEqual(true); expect($('.notCreatable').hasClass('hidden')).toEqual(false); }); @@ -1684,7 +1684,7 @@ describe('OCA.Files.FileList tests', function() { expect(getFolderContentsStub.calledWith('/subdir')).toEqual(true); deferredList.resolve(200, [testRoot].concat(testFiles)); return reloading.then(function() { - expect($('#fileList tr').length).toEqual(4); + expect($('.files-fileList tr').length).toEqual(4); expect(fileList.findFileEl('One.txt').length).toEqual(1); }).then(done, done); }); @@ -1942,7 +1942,7 @@ describe('OCA.Files.FileList tests', function() { .toEqual(OC.getRootPath() + '/remote.php/webdav/subdir/some%20file.txt'); expect(fileList.getDownloadUrl('some file.txt', '/anotherpath/abc')) .toEqual(OC.getRootPath() + '/remote.php/webdav/anotherpath/abc/some%20file.txt'); - $('#dir').val('/'); + fileList.changeDirectory('/', false, true); expect(fileList.getDownloadUrl('some file.txt')) .toEqual(OC.getRootPath() + '/remote.php/webdav/some%20file.txt'); }); @@ -2004,13 +2004,13 @@ describe('OCA.Files.FileList tests', function() { }); it('Selecting all files will automatically check "select all" checkbox', function() { expect($('.select-all').prop('checked')).toEqual(false); - $('#fileList tr td.selection input:checkbox').click(); + $('.files-fileList tr td.selection input:checkbox').click(); expect($('.select-all').prop('checked')).toEqual(true); }); it('Selecting all files on the first visible page will not automatically check "select all" checkbox', function() { fileList.setFiles(generateFiles(0, 41)); expect($('.select-all').prop('checked')).toEqual(false); - $('#fileList tr td.selection input:checkbox').click(); + $('.files-fileList tr td.selection input:checkbox').click(); expect($('.select-all').prop('checked')).toEqual(false); }); it('Selecting all files also selects hidden files when invisible', function() { @@ -2029,7 +2029,7 @@ describe('OCA.Files.FileList tests', function() { fileList.setFiles(generateFiles(0, 41)); $('.select-all').click(); expect($('.select-all').prop('checked')).toEqual(true); - $('#fileList tr input:checkbox').each(function() { + $('.files-fileList tr input:checkbox').each(function() { expect($(this).prop('checked')).toEqual(true); }); expect(_.pluck(fileList.getSelectedFiles(), 'name').length).toEqual(42); @@ -2037,7 +2037,7 @@ describe('OCA.Files.FileList tests', function() { $('.select-all').click(); expect($('.select-all').prop('checked')).toEqual(false); - $('#fileList tr input:checkbox').each(function() { + $('.files-fileList tr input:checkbox').each(function() { expect($(this).prop('checked')).toEqual(false); }); expect(_.pluck(fileList.getSelectedFiles(), 'name').length).toEqual(0); @@ -2090,7 +2090,7 @@ describe('OCA.Files.FileList tests', function() { expect(_.pluck(fileList.getSelectedFiles(), 'name').length).toEqual(42); }); it('Selecting files updates selection summary', function() { - var $summary = $('#headerName a.name>span:first'); + var $summary = $('.column-name a.name>span:first'); expect($summary.text()).toEqual('Name'); fileList.findFileEl('One.txt').find('input:checkbox').click(); fileList.findFileEl('Three.pdf').find('input:checkbox').click(); @@ -2098,7 +2098,7 @@ describe('OCA.Files.FileList tests', function() { expect($summary.text()).toEqual('1 folder and 2 files'); }); it('Unselecting files hides selection summary', function() { - var $summary = $('#headerName a.name>span:first'); + var $summary = $('.column-name a.name>span:first'); fileList.findFileEl('One.txt').find('input:checkbox').click().click(); expect($summary.text()).toEqual('Name'); }); @@ -2111,7 +2111,7 @@ describe('OCA.Files.FileList tests', function() { size: 150 })); $('.select-all').click(); - var $summary = $('#headerName a.name>span:first'); + var $summary = $('.column-name a.name>span:first'); expect($summary.text()).toEqual('2 folders and 3 files (including 1 hidden)'); }); it('Does not displays the number of hidden files in selection summary if hidden files are visible', function() { @@ -2123,7 +2123,7 @@ describe('OCA.Files.FileList tests', function() { size: 150 })); $('.select-all').click(); - var $summary = $('#headerName a.name>span:first'); + var $summary = $('.column-name a.name>span:first'); expect($summary.text()).toEqual('2 folders and 3 files'); }); it('Toggling hidden file visibility updates selection summary', function() { @@ -2135,13 +2135,13 @@ describe('OCA.Files.FileList tests', function() { size: 150 })); $('.select-all').click(); - var $summary = $('#headerName a.name>span:first'); + var $summary = $('.column-name a.name>span:first'); expect($summary.text()).toEqual('2 folders and 3 files (including 1 hidden)'); filesConfig.set('showhidden', true); expect($summary.text()).toEqual('2 folders and 3 files'); }); it('Select/deselect files shows/hides file actions', function() { - var $actions = $('#headerName .selectedActions'); + var $actions = $('.column-name .selectedActions'); var $checkbox = fileList.findFileEl('One.txt').find('input:checkbox'); expect($actions.hasClass('hidden')).toEqual(true); $checkbox.click(); @@ -2346,7 +2346,7 @@ describe('OCA.Files.FileList tests', function() { redirectStub.restore(); }); it('Downloads root folder when all selected in root folder', function() { - $('#dir').val('/'); + fileList.changeDirectory('/', false, true); $('.select-all').click(); $('.selectedActions .filesSelectMenu .download').click(); expect(redirectStub.calledOnce).toEqual(true); @@ -3390,7 +3390,7 @@ describe('OCA.Files.FileList tests', function() { }); it('does not render new button when no legacy upload button exists (public page)', function() { fileList.destroy(); - $('#controls').append('<input type="button" class="button upload" />'); + $('.files-controls').append('<input type="button" class="button upload" />'); fileList = new OCA.Files.FileList($('#app-content-files')); expect(fileList.$el.find('.button.upload').length).toEqual(1); expect(fileList.$el.find('.button.new').length).toEqual(0); diff --git a/apps/files/tests/js/tagspluginspec.js b/apps/files/tests/js/tagspluginspec.js index 2ac67e64cea..e59a9695592 100644 --- a/apps/files/tests/js/tagspluginspec.js +++ b/apps/files/tests/js/tagspluginspec.js @@ -32,9 +32,9 @@ describe('OCA.Files.TagsPlugin tests', function() { // dummy file list var $div = $( '<div>' + - '<table id="filestable">' + + '<table class="files-filestable">' + '<thead></thead>' + - '<tbody id="fileList"></tbody>' + + '<tbody class="files-fileList"></tbody>' + '</table>' + '</div>'); $('#content').append($div); |