diff options
| author | Simon L <szaimen@e.mail.de> | 2022-11-30 10:32:38 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-11-30 10:32:38 +0100 |
| commit | d8d15c3c2b8aee01fa2b534414f49378d2295f4f (patch) | |
| tree | 46e5af0d7047adbf876e399841445844097f0e54 /core/src | |
| parent | 2adb1f85e655604aee9b88c2b147859418adc984 (diff) | |
| parent | db67670477cd9fadd5173530a8b042272375c0a0 (diff) | |
| download | nextcloud-server-d8d15c3c2b8aee01fa2b534414f49378d2295f4f.tar.gz nextcloud-server-d8d15c3c2b8aee01fa2b534414f49378d2295f4f.zip | |
Merge pull request #35501 from nextcloud/enh/enh-33741-Focused_item_overlaps_neighbor_elements_with_text_and_border
Change app menu focused items behavior that neighbor elements (text and border) have no overlapping
Diffstat (limited to 'core/src')
| -rw-r--r-- | core/src/components/AppMenu.vue | 18 |
1 files changed, 9 insertions, 9 deletions
diff --git a/core/src/components/AppMenu.vue b/core/src/components/AppMenu.vue index 057e6c024db..f5963b44126 100644 --- a/core/src/components/AppMenu.vue +++ b/core/src/components/AppMenu.vue @@ -30,6 +30,7 @@ <a :href="app.href" :class="{ 'has-unread': app.unread > 0 }" :aria-label="appLabel(app)" + :title="app.name" :aria-current="app.active ? 'page' : false"> <img :src="app.icon" alt=""> <div class="app-menu-entry--label"> @@ -195,6 +196,7 @@ $header-icon-size: 20px; text-align: center; bottom: -5px; left: 50%; + top: 45%; display: block; min-width: 100%; transform: translateX(-50%); @@ -202,6 +204,7 @@ $header-icon-size: 20px; width: 100%; text-overflow: ellipsis; overflow: hidden; + letter-spacing: -0.5px; } &:hover, @@ -209,11 +212,11 @@ $header-icon-size: 20px; opacity: 1; .app-menu-entry--label { opacity: 1; - font-weight: bold; - font-size: 14px; + font-weight: bolder; bottom: 0; - width: auto; - overflow: visible; + width: 100%; + text-overflow: ellipsis; + overflow: hidden; } } @@ -227,7 +230,7 @@ $header-icon-size: 20px; opacity: 1; img { - margin-top: -6px; + margin-top: -8px; } .app-menu-entry--label { @@ -254,10 +257,7 @@ $header-icon-size: 20px; &:focus-visible { opacity: 1; - background-color: transparent !important; - border-radius: var(--border-radius); - outline: none; - box-shadow: 0 0 0 2px var(--color-primary-text); + outline: none !important; } } |