From 1e2a082cd29cef0f6a7c56402720fd005f2bf292 Mon Sep 17 00:00:00 2001 From: "John Molakvoæ (skjnldsv)" Date: Thu, 22 Feb 2018 12:13:35 +0100 Subject: Use popovermenu instead of dropdown and small fix to popovermenu MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- apps/files_external/templates/settings.php | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) (limited to 'apps/files_external/templates') diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php index 237985bfd0f..ac5b0d01a15 100644 --- a/apps/files_external/templates/settings.php +++ b/apps/files_external/templates/settings.php @@ -143,11 +143,7 @@ - <?php p($l->t('Advanced settings')); ?> +
-- cgit v1.2.3 From 0cc520f3a0a91f9b316f973ff8877c8fc4bae7b5 Mon Sep 17 00:00:00 2001 From: "John Molakvoæ (skjnldsv)" Date: Thu, 22 Feb 2018 13:09:06 +0100 Subject: Changed config saving feedback design MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- apps/files_external/css/settings.css | 126 ----------------------------- apps/files_external/css/settings.scss | 124 ++++++++++++++++++++++++++++ apps/files_external/js/settings.js | 11 +-- apps/files_external/templates/settings.php | 2 +- settings/css/settings.scss | 6 +- 5 files changed, 134 insertions(+), 135 deletions(-) delete mode 100644 apps/files_external/css/settings.css create mode 100644 apps/files_external/css/settings.scss (limited to 'apps/files_external/templates') diff --git a/apps/files_external/css/settings.css b/apps/files_external/css/settings.css deleted file mode 100644 index 7aa7ab1a6b0..00000000000 --- a/apps/files_external/css/settings.css +++ /dev/null @@ -1,126 +0,0 @@ -#global_credentials { - padding: 0 30px; -} - -#files_external { - margin-bottom: 0px; -} - -#externalStorage { - margin: 15px 0 20px 0; -} - -#externalStorage td.status { - /* overwrite conflicting core styles */ - display: table-cell; - vertical-align: middle; -} - -#externalStorage td.status > span { - display: inline-block; - height: 16px; - width: 16px; - vertical-align: text-bottom; -} - -td.mountPoint, td.backend { width:160px; } -#externalStorage td>img { padding-top:7px; opacity: 0.5; } -#externalStorage td>img:hover { padding-top:7px; cursor:pointer; opacity: 1; } -#addMountPoint>td { border:none; } -#addMountPoint>td.applicable { visibility:hidden; } -#addMountPoint>td.hidden { visibility:hidden; } - -#externalStorage td.mountOptionsToggle { - position: relative; - padding: 0 !important; - width: 44px; -} -#externalStorage .icon-settings { - padding: 14px; - vertical-align: text-bottom; - cursor: pointer; -} - -#selectBackend { - margin-left: -10px; - width: 150px; -} - -#externalStorage td.configuration, -#externalStorage td.backend { - white-space: normal; -} -#externalStorage td.configuration > * { - white-space: nowrap; -} - -#externalStorage td.configuration input.added { - margin-right: 6px; -} - -#externalStorage label > input[type="checkbox"] { - margin-right: 3px; -} - -#externalStorage td.configuration label { - min-width: 144px; /* 130px plus 2x7px padding */ - display: inline-block; - margin-right: 6px; -} - -#externalStorage td.configuration input.disabled-success { - background-color: rgba(134, 255, 110, 0.9); -} - - -#externalStorage td.applicable div.chzn-container { - position: relative; - top: 3px; -} - -#externalStorage td.status .success { - border-radius: 50%; -} - -#userMountingBackends { - padding-left: 25px; -} - -.files-external-select2 .select2-results .select2-result-label { - height: 32px; - padding: 3px; -} -.files-external-select2 .select2-results .select2-result-label > span { - display: block; - position: relative; -} -.files-external-select2 .select2-results .select2-result-label .avatardiv { - display:inline-block; -} -.files-external-select2 .select2-results .select2-result-label .avatardiv + span { - position: absolute; - top: 5px; - margin-left: 10px; -} -.files-external-select2 .select2-results .select2-result-label .avatardiv[data-type="group"] + span { - vertical-align: top; - top: 6px; - position: absolute; - max-width: 80%; - left: 30px; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; -} - -#externalStorage .mountOptionsToggle .dropdown { - width: auto; -} - -#externalStorage .mountOptionsDropdown { - margin-right: 40px; -} - -.nav-icon-external-storage { - background-image: url('../img/app-dark.svg?v=1'); -} diff --git a/apps/files_external/css/settings.scss b/apps/files_external/css/settings.scss new file mode 100644 index 00000000000..a92ae242ddf --- /dev/null +++ b/apps/files_external/css/settings.scss @@ -0,0 +1,124 @@ +#global_credentials { + padding: 0 30px; +} + +#files_external { + margin-bottom: 0px; +} + +#externalStorage { + margin: 15px 0 20px 0; +} + +#externalStorage td.status { + /* overwrite conflicting core styles */ + display: table-cell; + vertical-align: middle; +} + +#externalStorage td.status > span { + display: inline-block; + height: 28px; + width: 28px; + vertical-align: text-bottom; + border-radius: 50%; + cursor: pointer; +} + +td.mountPoint, td.backend { width:160px; } +#externalStorage td>img { padding-top:7px; opacity: 0.5; } +#externalStorage td>img:hover { padding-top:7px; cursor:pointer; opacity: 1; } +#addMountPoint>td { border:none; } +#addMountPoint>td.applicable { visibility:hidden; } +#addMountPoint>td.hidden { visibility:hidden; } + +#externalStorage td.mountOptionsToggle { + position: relative; + padding: 0 !important; + width: 44px; +} +#externalStorage .icon-settings { + padding: 14px; + vertical-align: text-bottom; + cursor: pointer; +} + +#selectBackend { + margin-left: -10px; + width: 150px; +} + +#externalStorage td.configuration, +#externalStorage td.backend { + white-space: normal; +} +#externalStorage td.configuration > * { + white-space: nowrap; +} + +#externalStorage td.configuration input.added { + margin-right: 6px; +} + +#externalStorage label > input[type="checkbox"] { + margin-right: 3px; +} + +#externalStorage td.configuration label { + min-width: 144px; /* 130px plus 2x7px padding */ + display: inline-block; + margin-right: 6px; +} + +#externalStorage td.configuration input.disabled-success { + background-color: rgba(134, 255, 110, 0.9); +} + + +#externalStorage td.applicable div.chzn-container { + position: relative; + top: 3px; +} + +#userMountingBackends { + padding-left: 25px; +} + +.files-external-select2 .select2-results .select2-result-label { + height: 32px; + padding: 3px; +} +.files-external-select2 .select2-results .select2-result-label > span { + display: block; + position: relative; +} +.files-external-select2 .select2-results .select2-result-label .avatardiv { + display:inline-block; +} +.files-external-select2 .select2-results .select2-result-label .avatardiv + span { + position: absolute; + top: 5px; + margin-left: 10px; +} +.files-external-select2 .select2-results .select2-result-label .avatardiv[data-type="group"] + span { + vertical-align: top; + top: 6px; + position: absolute; + max-width: 80%; + left: 30px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; +} + +#externalStorage .mountOptionsToggle .dropdown { + width: auto; +} + +#externalStorage .mountOptionsDropdown { + margin-right: 40px; +} + +.nav-icon-external-storage { + background-image: url('../img/app-dark.svg?v=1'); +} diff --git a/apps/files_external/js/settings.js b/apps/files_external/js/settings.js index bb34bc4ebc2..211740c5646 100644 --- a/apps/files_external/js/settings.js +++ b/apps/files_external/js/settings.js @@ -1230,22 +1230,23 @@ MountConfigListView.prototype = _.extend({ */ updateStatus: function($tr, status, message) { var $statusSpan = $tr.find('.status span'); - $statusSpan.removeClass('loading-small success indeterminate error'); + $statusSpan.removeClass(); + console.log($tr, status, message); switch (status) { case null: // remove status break; case StorageConfig.Status.IN_PROGRESS: - $statusSpan.addClass('loading-small'); + $statusSpan.attr('class', 'icon-loading-small'); break; case StorageConfig.Status.SUCCESS: - $statusSpan.addClass('success'); + $statusSpan.attr('class', 'success icon-checkmark-white'); break; case StorageConfig.Status.INDETERMINATE: - $statusSpan.addClass('indeterminate'); + $statusSpan.attr('class', 'indeterminate icon-info-white'); break; default: - $statusSpan.addClass('error'); + $statusSpan.attr('class', 'error icon-error-white'); } $statusSpan.attr('data-original-title', (typeof message === 'string') ? message : ''); }, diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php index ac5b0d01a15..98498eb2c35 100644 --- a/apps/files_external/templates/settings.php +++ b/apps/files_external/templates/settings.php @@ -110,7 +110,7 @@ > - + diff --git a/settings/css/settings.scss b/settings/css/settings.scss index 05d62423d17..7ed02f8d186 100644 --- a/settings/css/settings.scss +++ b/settings/css/settings.scss @@ -1105,14 +1105,14 @@ table.grid td.date { span { &.success { - background: #37ce02; + background-color: $color-success; border-radius: $border-radius; } &.error { - background: #ce3702; + background-color: $color-error; } &.indeterminate { - background: #e6db00; + background-color: $color-warning; border-radius: 40% 0; } } -- cgit v1.2.3 From 323dd310568447f3c63b8d9128c75a18a75c3527 Mon Sep 17 00:00:00 2001 From: "John Molakvoæ (skjnldsv)" Date: Thu, 22 Feb 2018 15:04:23 +0100 Subject: Tooltip fix on status icon MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- apps/files_external/js/settings.js | 7 ++++++- apps/files_external/templates/settings.php | 2 +- 2 files changed, 7 insertions(+), 2 deletions(-) (limited to 'apps/files_external/templates') diff --git a/apps/files_external/js/settings.js b/apps/files_external/js/settings.js index 7f56fd4bb73..b0f71c03245 100644 --- a/apps/files_external/js/settings.js +++ b/apps/files_external/js/settings.js @@ -1246,7 +1246,12 @@ MountConfigListView.prototype = _.extend({ default: $statusSpan.attr('class', 'error icon-error-white'); } - $statusSpan.attr('data-original-title', (typeof message === 'string') ? message : ''); + if (typeof message === 'string') { + $statusSpan.attr('title', message); + $statusSpan.tooltip(); + } else { + $statusSpan.tooltip('destroy'); + } }, /** diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php index 98498eb2c35..1fb3245c6d6 100644 --- a/apps/files_external/templates/settings.php +++ b/apps/files_external/templates/settings.php @@ -110,7 +110,7 @@ > - + -- cgit v1.2.3 From da2aafa5cfa4d6e331b299fe866766f6021392fa Mon Sep 17 00:00:00 2001 From: "John Molakvoæ (skjnldsv)" Date: Mon, 26 Feb 2018 13:02:07 +0100 Subject: Fixed icons padding MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- apps/files_external/css/settings.scss | 27 ++++++++++++++++++--------- apps/files_external/templates/settings.php | 13 +++---------- 2 files changed, 21 insertions(+), 19 deletions(-) (limited to 'apps/files_external/templates') diff --git a/apps/files_external/css/settings.scss b/apps/files_external/css/settings.scss index c781cd9bd17..4f46ccb97e2 100644 --- a/apps/files_external/css/settings.scss +++ b/apps/files_external/css/settings.scss @@ -32,15 +32,24 @@ td.mountPoint, td.backend { width:160px; } #addMountPoint>td.applicable { visibility:hidden; } #addMountPoint>td.hidden { visibility:hidden; } -#externalStorage td.mountOptionsToggle { - position: relative; - padding: 0 !important; - width: 44px; -} -#externalStorage .icon-settings { - padding: 14px; - vertical-align: text-bottom; - cursor: pointer; +#externalStorage td { + &.mountOptionsToggle, + &.remove, + &.save { + position: relative; + padding: 0 !important; + width: 44px; + opacity: 0.5; + &:hover { + opacity: 1; + } + [class^='icon-'], + [class*=' icon-'] { + padding: 14px; + vertical-align: text-bottom; + cursor: pointer; + } + } } #selectBackend { diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php index 1fb3245c6d6..b6bce5b30ba 100644 --- a/apps/files_external/templates/settings.php +++ b/apps/files_external/templates/settings.php @@ -143,21 +143,14 @@ -
+
- <?php p($l->t('Delete')); ?> +
- <?php p($l->t('Save')); ?> +
-- cgit v1.2.3 From 6b45d7e5499a4ae910e2697702c4063b6558297b Mon Sep 17 00:00:00 2001 From: "John Molakvoæ (skjnldsv)" Date: Tue, 27 Feb 2018 11:35:11 +0100 Subject: Fixed actions and header missing th MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- apps/files_external/css/settings.scss | 8 ++++---- apps/files_external/js/settings.js | 6 +++--- apps/files_external/templates/settings.php | 1 + 3 files changed, 8 insertions(+), 7 deletions(-) (limited to 'apps/files_external/templates') diff --git a/apps/files_external/css/settings.scss b/apps/files_external/css/settings.scss index 15b2691d187..09beaf12054 100644 --- a/apps/files_external/css/settings.scss +++ b/apps/files_external/css/settings.scss @@ -40,15 +40,15 @@ td.mountPoint, td.backend { width:160px; } position: relative; padding: 0 !important; width: 44px; - opacity: 0.5; - &:hover { - opacity: 1; - } [class^='icon-'], [class*=' icon-'] { + opacity: 0.5; padding: 14px; vertical-align: text-bottom; cursor: pointer; + &:hover { + opacity: 1; + } } } } diff --git a/apps/files_external/js/settings.js b/apps/files_external/js/settings.js index eaaed025104..0550cb04d80 100644 --- a/apps/files_external/js/settings.js +++ b/apps/files_external/js/settings.js @@ -727,15 +727,15 @@ MountConfigListView.prototype = _.extend({ self.recheckStorageConfig($(this).closest('tr')); }); - this.$el.on('click', 'td.remove>img', function() { + this.$el.on('click', 'td.remove>.icon-delete', function() { self.deleteStorageConfig($(this).closest('tr')); }); - this.$el.on('click', 'td.save>img', function () { + this.$el.on('click', 'td.save>.icon-checkmark', function () { self.saveStorageConfig($(this).closest('tr')); }); - this.$el.on('click', 'td.mountOptionsToggle>.icon-settings', function() { + this.$el.on('click', 'td.mountOptionsToggle>.icon-settings-dark', function() { self._showMountOptionsDropdown($(this).closest('tr')); }); diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php index b6bce5b30ba..8ceab06fd22 100644 --- a/apps/files_external/templates/settings.php +++ b/apps/files_external/templates/settings.php @@ -101,6 +101,7 @@ '.$l->t('Available for').''); ?>     +   -- cgit v1.2.3