summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--apps/theming/css/theming.scss5
-rw-r--r--core/templates/layout.user.php14
-rw-r--r--lib/private/TemplateLayout.php9
-rw-r--r--settings/css/settings.scss1
-rw-r--r--settings/js/apps.js48
-rw-r--r--settings/templates/apps.php3
6 files changed, 47 insertions, 33 deletions
diff --git a/apps/theming/css/theming.scss b/apps/theming/css/theming.scss
index f36ff69e42b..4474c232d94 100644
--- a/apps/theming/css/theming.scss
+++ b/apps/theming/css/theming.scss
@@ -14,11 +14,6 @@
.searchbox input[type="search"] {
background: transparent url('../../../core/img/actions/search.svg') no-repeat 6px center;
}
- #appmenu li a img {
- -webkit-filter: invert(1);
- filter: invert(1);
- filter: progid:DXImageTransform.Microsoft.BasicImage(invert='1');
- }
#contactsmenu .icon-contacts {
background-image: url('../../../core/img/places/contacts-dark.svg');
}
diff --git a/core/templates/layout.user.php b/core/templates/layout.user.php
index 5008392d2a3..127e794e120 100644
--- a/core/templates/layout.user.php
+++ b/core/templates/layout.user.php
@@ -46,8 +46,14 @@
<li data-id="<?php p($entry['id']); ?>" class="hidden">
<a href="<?php print_unescaped($entry['href']); ?>"
<?php if ($entry['active']): ?> class="active"<?php endif; ?>>
- <img src="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>"
- class="app-icon" alt="<?php p($entry['name']); ?>" />
+ <?php if ($_['themingInvertMenu']) { ?>
+ <svg width="20" height="20" viewBox="0 0 20 20">
+ <defs><filter id="invertMenuMain-<?php p($entry['id']); ?>"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0" /></filter></defs>
+ <image x="0" y="0" width="20" height="20" preserveAspectRatio="xMinYMin meet" filter="url(#invertMenuMain-<?php p($entry['id']); ?>)" xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" class="app-icon" /></svg>
+ <?php } else { ?>
+ <img src="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>"
+ class="app-icon" alt="<?php p($entry['name']); ?>" />
+ <?php } ?>
<div class="icon-loading-small-dark"
style="display:none;"></div>
</a>
@@ -73,8 +79,8 @@
<a href="<?php print_unescaped($entry['href']); ?>"
<?php if( $entry['active'] ): ?> class="active"<?php endif; ?>>
<svg width="16" height="16" viewBox="0 0 16 16">
- <defs><filter id="invert-<?php p($entry['id']); ?>"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
- <image x="0" y="0" width="16" height="16" preserveAspectRatio="xMinYMin meet" filter="url(#invert-<?php p($entry['id']); ?>)" xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" class="app-icon"></image>
+ <defs><filter id="invertMenuMore-<?php p($entry['id']); ?>"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
+ <image x="0" y="0" width="16" height="16" preserveAspectRatio="xMinYMin meet" filter="url(#invertMenuMore-<?php p($entry['id']); ?>)" xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" class="app-icon"></image>
</svg>
<div class="icon-loading-small-dark" style="display:none;"></div>
<span><?php p($entry['name']); ?></span>
diff --git a/lib/private/TemplateLayout.php b/lib/private/TemplateLayout.php
index 264c10f5f1b..a8c4bbb0d16 100644
--- a/lib/private/TemplateLayout.php
+++ b/lib/private/TemplateLayout.php
@@ -108,6 +108,15 @@ class TemplateLayout extends \OC_Template {
$this->assign('userAvatarVersion', $this->config->getUserValue(\OC_User::getUser(), 'avatar', 'version', 0));
}
+ // check if app menu icons should be inverted
+ try {
+ /** @var \OCA\Theming\Util $util */
+ $util = \OC::$server->query(\OCA\Theming\Util::class);
+ $this->assign('themingInvertMenu', $util->invertTextColor(\OC::$server->getThemingDefaults()->getColorPrimary()));
+ } catch (\OCP\AppFramework\QueryException $e) {
+ $this->assign('themingInvertMenu', false);
+ }
+
} else if ($renderAs == 'error') {
parent::__construct('core', 'layout.guest', '', false);
$this->assign('bodyid', 'body-login');
diff --git a/settings/css/settings.scss b/settings/css/settings.scss
index a5d7eab6a30..268cb0eee5d 100644
--- a/settings/css/settings.scss
+++ b/settings/css/settings.scss
@@ -899,6 +899,7 @@ span.version {
}
.app-image {
width: 44px;
+ height: auto;
text-align: right;
}
.app-image-icon svg {
diff --git a/settings/js/apps.js b/settings/js/apps.js
index 0a6e86ed701..b0cc1a11a2f 100644
--- a/settings/js/apps.js
+++ b/settings/js/apps.js
@@ -247,8 +247,7 @@ OC.Settings.Apps = OC.Settings.Apps || {
var page = $('#app-' + app.id);
- // image loading kung-fu (IE doesn't properly scale SVGs, so disable app icons)
- if (app.preview && !OC.Util.isIE()) {
+ if (app.preview) {
var currentImage = new Image();
currentImage.src = app.preview;
@@ -300,8 +299,10 @@ OC.Settings.Apps = OC.Settings.Apps || {
img = '<svg viewBox="0 0 72 72">';
img += '<image x="0" y="0" width="72" height="72" preserveAspectRatio="xMinYMin meet" xlink:href="' + url + '" class="app-icon" /></svg>';
} else {
+ var rnd = Math.floor((Math.random() * 100 )) + new Date().getSeconds() + new Date().getMilliseconds();
img = '<svg width="32" height="32" viewBox="0 0 32 32">';
- img += '<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" filter="url(#invertIcon)" xlink:href="' + url + '?v=' + oc_config.version + '" class="app-icon"></image></svg>';
+ img += '<defs><filter id="invertIconApps-' + rnd + '"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>'
+ img += '<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" filter="url(#invertIconApps-' + rnd + ')" xlink:href="' + url + '?v=' + oc_config.version + '" class="app-icon"></image></svg>';
}
return img;
},
@@ -652,24 +653,29 @@ OC.Settings.Apps = OC.Settings.Apps || {
}
if ($('#appmenu').children('li[data-id="' + entry.id + '"]').length === 0) {
- var li = $('<li></li>');
- li.attr('data-id', entry.id);
- var img = '<img src="' + entry.icon + '" class="app-icon">';
- var a = $('<a></a>').attr('href', entry.href);
- var filename = $('<span></span>');
- var loading = $('<div class="icon-loading-dark"></div>').css('display', 'none');
- filename.text(entry.name);
- a.prepend(filename);
- a.prepend(loading);
- a.prepend(img);
- li.append(a);
- $('#appmenu li[data-id='+ previousEntry.id+']').after(li);
- if(addedApps[entry.id]) {
- li.animate({opacity: 0.5})
- .animate({opacity: 1})
- .animate({opacity: 0.5})
- .animate({opacity: 1});
- }
+ var li = $('<li></li>');
+ li.attr('data-id', entry.id);
+ var img = '<img src="' + entry.icon + '" class="app-icon">';
+ if (OCA.Theming && OCA.Theming.inverted) {
+ img = '<svg width="20" height="20" viewBox="0 0 20 20">';
+ img += '<defs><filter id="invert"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0" /></filter></defs>';
+ img += '<image x="0" y="0" width="20" height="20" preserveAspectRatio="xMinYMin meet" filter="url(#invert)" xlink:href="' + entry.icon + '" class="app-icon" /></svg>';
+ }
+ var a = $('<a></a>').attr('href', entry.href);
+ var filename = $('<span></span>');
+ var loading = $('<div class="icon-loading-dark"></div>').css('display', 'none');
+ filename.text(entry.name);
+ a.prepend(filename);
+ a.prepend(loading);
+ a.prepend(img);
+ li.append(a);
+ $('#appmenu li[data-id='+ previousEntry.id+']').after(li);
+ if(addedApps[entry.id]) {
+ li.animate({opacity: 0.5})
+ .animate({opacity: 1})
+ .animate({opacity: 0.5})
+ .animate({opacity: 1});
+ }
}
previousEntry = entry;
}
diff --git a/settings/templates/apps.php b/settings/templates/apps.php
index 0d313be6ede..d7b232b915e 100644
--- a/settings/templates/apps.php
+++ b/settings/templates/apps.php
@@ -203,9 +203,6 @@ script(
</ul>
</div>
<div id="app-content" class="icon-loading">
- <svg class="app-filter">
- <defs><filter id="invertIcon"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
- </svg>
<div id="apps-list"></div>
<div id="apps-list-empty" class="hidden emptycontent emptycontent-search">
<div id="app-list-empty-icon" class="icon-search"></div>
generated by cgit v1.2.3 (git 2.39.1) at 2025-02-01 05:29:13 +0000