From 88bc43182f3352fd5ddb23c01b9b7b3ae4b6b2fd Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 25 Apr 2017 00:20:12 +0200 Subject: [PATCH] Fix app icon being inverted for app store apps too Signed-off-by: Jan-Christoph Borchardt --- core/img/places/default-app-icon.svg | 1 + settings/css/settings.css | 12 ++++++++---- settings/js/apps.js | 15 +++++++++++---- 3 files changed, 20 insertions(+), 8 deletions(-) create mode 100644 core/img/places/default-app-icon.svg diff --git a/core/img/places/default-app-icon.svg b/core/img/places/default-app-icon.svg new file mode 100644 index 0000000000..7ef7f08692 --- /dev/null +++ b/core/img/places/default-app-icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/settings/css/settings.css b/settings/css/settings.css index 103dcf26a7..a046148dcc 100644 --- a/settings/css/settings.css +++ b/settings/css/settings.css @@ -670,6 +670,7 @@ form.section { position: relative; } .app-image { + position: relative; height: 150px; opacity: 1; overflow: hidden; @@ -757,18 +758,21 @@ form.section { #apps-list.installed .app-image { width: 44px; text-align: right; - opacity: .5; } #apps-list.installed .app-image-icon svg { margin-top: 5px; width: 20px; height: 20px; + opacity: .5; } -#apps-list .app-image-icon svg { - opacity: .3; - margin-top: 50px; +#apps-list:not(.installed) .app-image-icon svg { + position: absolute; + bottom: 43px; /* position halfway vertically */ + width: 64px; + height: 64px; + opacity: .1; } .installed .actions { diff --git a/settings/js/apps.js b/settings/js/apps.js index 03ae4e2e8c..6da8c395ec 100644 --- a/settings/js/apps.js +++ b/settings/js/apps.js @@ -183,7 +183,7 @@ OC.Settings.Apps = OC.Settings.Apps || { app.firstExperimental = firstExperimental; if (!app.preview) { - app.preview = OC.imagePath('core', 'filetypes/image'); + app.preview = OC.imagePath('core', 'places/default-app-icon'); app.previewAsIcon = true; } @@ -235,9 +235,16 @@ OC.Settings.Apps = OC.Settings.Apps || { currentImage.src = app.preview; currentImage.onload = function() { - page.find('.app-image') - .append(OC.Settings.Apps.imageUrl(app.preview, app.fromAppStore)) - .removeClass('icon-loading'); + /* Trigger color inversion for placeholder image too */ + if(app.previewAsIcon) { + page.find('.app-image') + .append(OC.Settings.Apps.imageUrl(app.preview, false)) + .removeClass('icon-loading'); + } else { + page.find('.app-image') + .append(OC.Settings.Apps.imageUrl(app.preview, app.fromAppStore)) + .removeClass('icon-loading'); + } }; }