diff options
| author | Julius Härtl <jus@bitgrid.net> | 2021-05-11 09:22:51 +0300 |
|---|---|---|
| committer | Julius Härtl <jus@bitgrid.net> | 2021-06-16 18:12:56 +0300 |
| commit | a94236483e26785dcaf97fb10e863f82348eb068 (patch) | |
| tree | 72acc7ac8eb955e93704bf563cc2973149ab9f97 /core/templates | |
| parent | 4c93249514783181115be8bb040de701bffdba10 (diff) | |
Let apps toggle an unread counter on app icons
Co-authored-by: Louis Chemineau <louis@chmn.me>
Signed-off-by: Julius Härtl <jus@bitgrid.net>
Diffstat (limited to 'core/templates')
| -rw-r--r-- | core/templates/layout.user.php | 32 |
1 files changed, 23 insertions, 9 deletions
diff --git a/core/templates/layout.user.php b/core/templates/layout.user.php index 3a698550ead..693a14e4058 100644 --- a/core/templates/layout.user.php +++ b/core/templates/layout.user.php @@ -57,12 +57,18 @@ <a href="<?php print_unescaped($entry['href']); ?>" <?php if ($entry['active']): ?> class="active"<?php endif; ?> aria-label="<?php p($entry['name']); ?>"> - <svg width="20" height="20" viewBox="0 0 20 20" alt=""> - <?php if ($_['themingInvertMenu']) { ?> - <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> - <?php } ?> - <image x="0" 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']); ?>" class="app-icon"></image> + <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> + <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> <span> <?php p($entry['name']); ?> </span> @@ -87,11 +93,19 @@ <a href="<?php print_unescaped($entry['href']); ?>" <?php if ($entry['active']): ?> class="active"<?php endif; ?> aria-label="<?php p($entry['name']); ?>"> - <svg width="16" height="16" viewBox="0 0 16 16" alt=""> - <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 width="20" height="20" viewBox="0 0 20 20" alt=""<?php if ($entry['unread'] !== 0) { ?> class="has-unread"<?php } ?>> + <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> + <mask id="hole"> + <rect width="100%" height="100%" fill="white"/> + <circle r="4.5" cx="17" cy="3" fill="black"/> + </mask> + </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']); ?>" style="<?php if ($entry['unread'] !== 0) { ?>mask: url("#hole");<?php } ?>" class="app-icon"></image> + <circle class="app-icon-notification" r="3" cx="17" cy="3" fill="red"/> </svg> - <span><?php p($entry['name']); ?></span> + <div class="unread-counter" aria-hidden="true"><?php p($entry['unread']); ?></div> + <span class="app-title"><?php p($entry['name']); ?></span> </a> </li> <?php endforeach; ?> |