Properly align loading indicator when switching folders

Signed-off-by: Julius Härtl <jus@bitgrid.net>

diff --git a/core/css/styles.scss b/core/css/styles.scss
index 62d2bb45c96601ab2b60300d91eec2ea14e837b1..da270893e663c2a73c8f44083f51fd41d53769e6 100644 (file)
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -778,7 +778,7 @@ code {
                                border-bottom: 1px solid var(--color-border);
                                background-color: var(--color-main-background);
                                th {
-                                       width: auto;
+                                       width: 80%;
                                        border: none;
                                }
                        }

diff --git a/core/js/oc-dialogs.js b/core/js/oc-dialogs.js
index 49bf626ed8225d19360ab922ae76e1ca66a89b4f..3169dab4b88aee86ca50db65b7e68b9c03572be1 100644 (file)
--- a/core/js/oc-dialogs.js
+++ b/core/js/oc-dialogs.js
@@ -257,6 +257,7 @@ var OCdialogs = {
                        self.$filePicker.ready(function() {
                                self.$fileListHeader = self.$filePicker.find('.filelist thead tr');
                                self.$filelist = self.$filePicker.find('.filelist tbody');
+                               self.$filelistContainer = self.$filePicker.find('.filelist-container');
                                self.$dirTree = self.$filePicker.find('.dirtree');
                                self.$dirTree.on('click', 'div:not(:last-child)', self, function (event) {
                                        self._handleTreeListSelect(event, type);
@@ -896,7 +897,9 @@ var OCdialogs = {
        */
        _fillFilePicker:function(dir) {
                var self = this;
-               this.$filelist.empty().addClass('icon-loading');
+               this.$filelist.empty();
+               this.$filePicker.find('.emptycontent').hide();
+               this.$filelistContainer.addClass('icon-loading');
                this.$filePicker.data('path', dir);
                var filter = this.$filePicker.data('mimetype');
                if (typeof(filter) === "string") {
@@ -952,8 +955,10 @@ var OCdialogs = {
 
                        if (files.length === 0) {
                                self.$filePicker.find('.emptycontent').show();
+                               self.$fileListHeader.hide();
                        } else {
                                self.$filePicker.find('.emptycontent').hide();
+                               self.$fileListHeader.show();
                        }
 
                        $.each(files, function(idx, entry) {
@@ -993,7 +998,7 @@ var OCdialogs = {
                                self.$filelist.append($row);
                        });
 
-                       self.$filelist.removeClass('icon-loading');
+                       self.$filelistContainer.removeClass('icon-loading');
                });
        },
        /**