summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMarie <marie@kaifa.ch>2023-11-02 00:40:41 +0100
committerGitHub <noreply@github.com>2023-11-02 00:40:41 +0100
commitf29d85de0abc85d39e66bb5c86c94145e39c2e65 (patch)
treedce71fc562bbefe2ce27e979b320b83269e49f7a
parentmerge: ui tweaks (diff)
parentfix: fix: notification count position (diff)
downloadsharkey-f29d85de0abc85d39e66bb5c86c94145e39c2e65.tar.gz
sharkey-f29d85de0abc85d39e66bb5c86c94145e39c2e65.tar.bz2
sharkey-f29d85de0abc85d39e66bb5c86c94145e39c2e65.zip
merge: fix notification indicator
-rw-r--r--packages/frontend/src/style.scss4
-rw-r--r--packages/frontend/src/ui/_common_/navbar.vue6
2 files changed, 5 insertions, 5 deletions
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss
index 39c0a4c56b..d79c0c1d76 100644
--- a/packages/frontend/src/style.scss
+++ b/packages/frontend/src/style.scss
@@ -188,10 +188,10 @@ hr {
font-weight: 700;
background: var(--indicator);
height: 1.5em;
- min-width: 1.5em;
+ min-width: 1em;
align-items: center;
justify-content: center;
- border-radius: 99rem;
+ border-radius: var(--radius-ellipse);
padding: 0.3em 0.5em;
}
diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue
index 5cd9d66b82..e8a1aa4f14 100644
--- a/packages/frontend/src/ui/_common_/navbar.vue
+++ b/packages/frontend/src/ui/_common_/navbar.vue
@@ -29,7 +29,7 @@ SPDX-License-Identifier: AGPL-3.0-only
v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}"
>
<i class="ti-fw" :class="[$style.itemIcon, navbarItemDef[item].icon]"></i><span :class="$style.itemText">{{ navbarItemDef[item].title }}</span>
- <span v-if="navbarItemDef[item].indicated" :class="$style.itemIndicator">
+ <span v-if="navbarItemDef[item].indicated" :class="[$style.itemIndicator, { [$style.hasItemIndicateValueIcon]: navbarItemDef[item].indicateValue }]">
<span v-if="navbarItemDef[item].indicateValue" class="_indicateCounter" :class="$style.itemIndicateValueIcon">{{ navbarItemDef[item].indicateValue }}</span>
<i v-else class="_indicatorCircle"></i>
</span>
@@ -311,12 +311,12 @@ function more(ev: MouseEvent) {
.itemIndicator {
position: absolute;
top: 0;
- right: 20px;
+ left: 20px;
color: var(--navIndicator);
font-size: 8px;
animation: blink 1s infinite;
- &:has(.itemIndicateValueIcon) {
+ &.hasItemIndicateValueIcon {
animation: none;
left: auto;
right: 40px;