add option to show hovered label only on top menu

This commit is contained in:
Simon Vieille
2023-05-23 14:09:55 +02:00
parent 135f27cc32
commit 93fef37033
11 changed files with 32 additions and 9 deletions
+22 -7
View File
@@ -24,14 +24,14 @@
<nav class="app-menu show">
<ul
class="app-menu-main"
:class="{ 'app-menu-main__hidden-label': hiddenLabels }"
:class="{ 'app-menu-main__hidden-label': hiddenLabels === 1, 'app-menu-main__show-hovered': hiddenLabels === 2 }"
v-if="apps !== null"
>
<li v-for="app in mainAppList()"
:key="app.id"
:data-app-id="app.id"
class="app-menu-entry"
:class="{ 'app-menu-entry__active': app.active, 'app-menu-entry__hidden-label': hiddenLabels }"
:class="{ 'app-menu-entry__active': app.active, 'app-menu-entry__hidden-label': hiddenLabels === 1, 'app-menu-main__show-hovered': hiddenLabels === 2 }"
:style="makeStyle(app)"
>
<a :href="app.href"
@@ -233,8 +233,8 @@ $header-icon-size: 20px;
overflow: hidden;
}
&:not(.app-menu-entry__hidden-label):hover,
&:not(.app-menu-entry__hidden-label):focus-within {
&:not(.app-menu-entry__hidden-label):not(.app-menu-entry__show-hovered):hover,
&:not(.app-menu-entry__hidden-label):not(.app-menu-entry__show-hovered):focus-within {
opacity: 1;
.app-menu-entry--label {
opacity: 1;
@@ -245,7 +245,6 @@ $header-icon-size: 20px;
overflow: visible;
}
}
}
// Show labels
@@ -256,8 +255,8 @@ $header-icon-size: 20px;
opacity: 1;
}
&:not(.app-menu-main__hidden-label):hover,
&:not(.app-menu-main__hidden-label):focus-within,
&:not(.app-menu-main__hidden-label):not(.app-menu-main__show-hovered):hover,
&:not(.app-menu-main__hidden-label):not(.app-menu-main__show-hovered):focus-within,
.app-menu-entry:not(.app-menu-entry__hidden-label):hover,
.app-menu-entry:not(.app-menu-entry__hidden-label):focus {
img {
@@ -273,6 +272,22 @@ $header-icon-size: 20px;
opacity: 0;
}
}
&.app-menu-main__show-hovered .app-menu-entry:hover,
&.app-menu-main__show-hovered .app-menu-entry:focus {
img {
margin-top: -6px;
}
.app-menu-entry--label {
opacity: 1;
bottom: 0;
}
&::before, .app-menu-entry::before {
opacity: 0;
}
}
}
::v-deep .app-menu-more .button-vue--vue-tertiary {
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Aplikace ponechané v horní nabídce ale také zobrazené v té boční"
"These applications must be selected in the previous option.": "Tyto aplikace je třeba vybrat v předchozí volbě."
"Hide labels on mouse over": "Skrýt popisky při najetím ukazatele myši"
"Except the hovered app": "Except the hovered app"
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Applications kept in the top menu but also shown in side menu"
"These applications must be selected in the previous option.": "These applications must be selected in the previous option."
"Hide labels on mouse over": "Hide labels on mouse over"
"Except the hovered app": "Except the hovered app"
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Las aplicaciones se mantienen en el menú superior pero también se muestran en el menú lateral"
"These applications must be selected in the previous option.": "Estas aplicaciones deben ser seleccionadas en las opciones anteriores."
"Hide labels on mouse over": "Ocultar las etiquetas al pasar el ratón"
"Except the hovered app": "Except the hovered app"
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Applications conservées dans le menu supérieur mais également affichées dans le menu latéral"
"These applications must be selected in the previous option.": "Ces applications doivent également être sélectionnées dans l'option précédente."
"Hide labels on mouse over": "Masquer le libellé des applications au passage de la souris"
"Except the hovered app": "À l'exception de l'application survolée"
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Applicaties blijven in het topmenu maar worden ook in het zijmenu getoond"
"These applications must be selected in the previous option.": "Deze toepassingen moeten bij de vorige optie zijn geselecteerd."
"Hide labels on mouse over": "Hide labels on mouse over"
"Except the hovered app": "Except the hovered app"
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Applications kept in the top menu but also shown in side menu"
"These applications must be selected in the previous option.": "These applications must be selected in the previous option."
"Hide labels on mouse over": "Скрыть название при наведении мыши"
"Except the hovered app": "Except the hovered app"
+1
View File
@@ -93,3 +93,4 @@
"Applications kept in the top menu but also shown in side menu": ""
"These applications must be selected in the previous option.": ""
"Hide labels on mouse over": ""
"Except the hovered app": ""
+1
View File
@@ -91,3 +91,4 @@
"Applications kept in the top menu but also shown in side menu": "Applications kept in the top menu but also shown in side menu"
"These applications must be selected in the previous option.": "These applications must be selected in the previous option."
"Hide labels on mouse over": "Hide labels on mouse over"
"Except the hovered app": "Except the hovered app"