From f55ba62a00a9256b8879d373c4a1460581b22eb1 Mon Sep 17 00:00:00 2001
From: Julius Haertl <jus@bitgrid.net>
Date: Thu, 28 Jul 2016 22:33:17 +0200
Subject: [PATCH] Move to svg filter on app menu to support IE9+
---
core/css/header.css | 13 ++++---------
core/templates/layout.user.php | 10 ++++++++--
2 files changed, 12 insertions(+), 11 deletions(-)
diff --git a/core/css/header.css b/core/css/header.css
index 9c3a60281ac..673e657f00b 100644
--- a/core/css/header.css
+++ b/core/css/header.css
@@ -210,27 +210,22 @@
text-overflow:ellipsis;
}
/* icon opacity and hover effect */
- #navigation a img,
+ #navigation a svg,
#navigation a span {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
opacity: .5;
}
- #navigation a:hover img,
- #navigation a:focus img,
+ #navigation a:hover svg,
+ #navigation a:focus svg,
#navigation a:hover span,
#navigation a:focus span,
- #navigation a.active img,
+ #navigation a.active svg,
#navigation a.active span {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
opacity: .75;
}
#navigation .app-icon {
- -webkit-filter: invert(100%);
- -moz-filter: invert(100%);
- -o-filter: invert(100%);
- -ms-filter: "progid:DXImageTransform.Microsoft.Invert(100%)";
- filter: invert(100%);
margin: 0 auto;
padding: 0;
max-height: 32px;
diff --git a/core/templates/layout.user.php b/core/templates/layout.user.php
index b3b492ecac4..37e03b692c5 100644
--- a/core/templates/layout.user.php
+++ b/core/templates/layout.user.php
@@ -113,7 +113,10 @@
<li data-id="<?php p($entry['id']); ?>">
<a href="<?php print_unescaped($entry['href']); ?>" tabindex="3"
<?php if( $entry['active'] ): ?> class="active"<?php endif; ?>>
- <img class="app-icon" alt="" src="<?php print_unescaped($entry['icon']); ?>">
+ <svg width="32" height="32" viewBox="0 0 32 32">
+ <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>
+ <image x="0" y="0" width="32" height="32" preserveAspectRatio="true" filter="url(#invert)" xlink:href="<?php print_unescaped($entry['icon']); ?>" class="app-icon"/>
+ </svg>
<div class="icon-loading-dark" style="display:none;"></div>
<span>
<?php p($entry['name']); ?>
@@ -128,7 +131,10 @@
<li id="apps-management">
<a href="<?php print_unescaped(\OC::$server->getURLGenerator()->linkToRoute('settings.AppSettings.viewApps')); ?>" tabindex="4"
<?php if( $_['appsmanagement_active'] ): ?> class="active"<?php endif; ?>>
- <img class="app-icon" alt="" src="<?php print_unescaped(image_path('settings', 'apps.svg')); ?>">
+ <svg width="32" height="32" viewBox="0 0 32 32" class="app-icon">
+ <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>
+ <image x="0" y="0" width="32" height="32" preserveAspectRatio="true" filter="url(#invert)" xlink:href="<?php print_unescaped(image_path('settings', 'apps.svg')); ?>"/>
+ </svg>
<div class="icon-loading-dark" style="display:none;"></div>
<span>
<?php p($l->t('Apps')); ?>
--
GitLab