diff options
| author | Joas Schilling <coding@schilljs.com> | 2022-03-29 23:18:40 +0300 |
|---|---|---|
| committer | John Molakvoæ <skjnldsv@protonmail.com> | 2022-04-21 10:29:33 +0300 |
| commit | b3cf312edcefec3fb26bad8637f3a0969504be87 (patch) | |
| tree | 43397a079ea2b558e23cef722d6abbca11bc7cfb /core | |
| parent | 12ed5c9ff3e9dac25b43a1ad934a97a86037000b (diff) | |
Start theming providers
Signed-off-by: Joas Schilling <coding@schilljs.com>
Diffstat (limited to 'core')
| -rw-r--r-- | core/css/apps.scss | 2 | ||||
| -rw-r--r-- | core/css/header.scss | 5 | ||||
| -rw-r--r-- | core/css/styles.scss | 1 | ||||
| -rw-r--r-- | core/templates/layout.user.php | 5 |
4 files changed, 10 insertions, 3 deletions
diff --git a/core/css/apps.scss b/core/css/apps.scss index 15742786b0e..b683ffae0ef 100644 --- a/core/css/apps.scss +++ b/core/css/apps.scss @@ -285,6 +285,8 @@ kbd { margin-right: 11px; width: 16px; height: 16px; + // Legacy invert if bright background + filter: var(--background-invert-if-bright); } /* counter can also be inside the link */ diff --git a/core/css/header.scss b/core/css/header.scss index 27a8fe289fa..2c1dc647189 100644 --- a/core/css/header.scss +++ b/core/css/header.scss @@ -449,6 +449,11 @@ nav[role='navigation'] { // Make sure most app names don’t ellipsize letter-spacing: -0.5px; font-size: 12px; + + // If the primary is too bright, invert the app icons + svg image { + filter: var(--primary-invert-if-bright); + } } /* focused app visual feedback */ diff --git a/core/css/styles.scss b/core/css/styles.scss index 8a15cfa19d8..27e5675b53a 100644 --- a/core/css/styles.scss +++ b/core/css/styles.scss @@ -975,6 +975,7 @@ span.ui-icon { background-size: 20px 20px; padding: 14px; cursor: pointer; + filter: var(--primary-invert-if-bright); &:hover, &:focus, diff --git a/core/templates/layout.user.php b/core/templates/layout.user.php index 2b84c89fca6..f5ac783b340 100644 --- a/core/templates/layout.user.php +++ b/core/templates/layout.user.php @@ -64,7 +64,7 @@ $getUserAvatar = static function (int $size) use ($_): string { </div> </a> - <ul id="appmenu" <?php if ($_['themingInvertMenu']) { ?>class="inverted"<?php } ?>> + <ul id="appmenu"> <?php foreach ($_['navigation'] as $entry): ?> <li data-id="<?php p($entry['id']); ?>" class="hidden" tabindex="-1"> <a href="<?php print_unescaped($entry['href']); ?>" @@ -73,13 +73,12 @@ $getUserAvatar = static function (int $size) use ($_): string { aria-label="<?php p($entry['name']); ?>"> <svg width="24" height="20" viewBox="0 0 24 20" alt=""<?php if ($entry['unread'] !== 0) { ?> class="has-unread"<?php } ?>> <defs> - <?php if ($_['themingInvertMenu']) { ?><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><?php } ?> <mask id="hole"> <rect width="100%" height="100%" fill="white"/> <circle r="4.5" cx="21" cy="3" fill="black"/> </mask> </defs> - <image x="2" y="0" width="20" height="20" preserveAspectRatio="xMinYMin meet"<?php if ($_['themingInvertMenu']) { ?> filter="url(#invertMenuMain-<?php p($entry['id']); ?>)"<?php } ?> xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" style="<?php if ($entry['unread'] !== 0) { ?>mask: url("#hole");<?php } ?>" class="app-icon"></image> + <image x="2" y="0" width="20" height="20" preserveAspectRatio="xMinYMin meet" xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" style="<?php if ($entry['unread'] !== 0) { ?>mask: url("#hole");<?php } ?>" class="app-icon"></image> <circle class="app-icon-notification" r="3" cx="21" cy="3" fill="red"/> </svg> <div class="unread-counter" aria-hidden="true"><?php p($entry['unread']); ?></div> |