Merge pull request 'release v3.5.2' (#213) from develop into master

Reviewed-on: https://gitnet.fr/deblan/side_menu/pulls/213

.gitea/issue_template/FEATURE_TEMPLATE.md

@@ -1,16 +0,0 @@
----
-name: "New feature"
-about: "Use this template if you want to request a feature"
-title: "[FEATURE] "
-labels:
-  - enhancement
----
-## Feature
-
-### Description
-
-...
-
-### Benefits
-
-...

.gitea/issue_template/FEATURE_TEMPLATE.yml

@@ -0,0 +1,34 @@
+name: New feature
+about: Use this template if you want to request a feature
+title: "[FEATURE] "
+labels:
+  - enhancement
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Thanks for taking the time to fill out this feature request!
+
+  - type: textarea
+    id: description
+    attributes:
+      label: Description
+      description: Describe the feature.
+    validations:
+      required: true
+
+  - type: textarea
+    id: benefits
+    attributes:
+      label: Benefits
+      description: Describe the benefits of this feature.
+    validations:
+      required: true
+
+  - type: textarea
+    id: extra
+    attributes:
+      label: More informations
+      description: If you want to share more things, this is here!
+    validations:
+      required: false

.gitea/issue_template/ISSUE_TEMPLATE.md

@@ -1,32 +0,0 @@
----
-name: "New issue"
-about: "Use this template if you have a bug"
-title: "[BUG] "
-labels:
-  - bug
----
-## Issue
-
-### Environment
-
-* Custom menu version: 
-* Nextcloud version: 
-* PHP version: 
-* Web server (Nginx, Apache2): 
-* Web browser and version (Firefox 80, Google Chrome 74, etc): 
-
-```
-Insert your configuration here. You can export the configuration using the admin page.
-```
-
-### Steps to reproduce
-
-...
-
-### Observed Results
-
-...
-
-### Expected Results
-
-...

.gitea/issue_template/ISSUE_TEMPLATE.yml

@@ -0,0 +1,69 @@
+name: New issue
+about: Use this template if you have a bug
+title: "[Bug] "
+labels:
+  - bug
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Thanks for taking the time to fill out this bug report!
+
+  - type: textarea
+    id: environment
+    attributes:
+      label: Environment
+      value: |
+        * Custom menu version: 
+        * Nextcloud version: 
+        * PHP version: 
+        * Web server (Nginx, Apache2): 
+        * Web browser and version (Firefox 80, Google Chrome 74, etc): 
+    validations:
+      required: true
+
+  - type: textarea
+    id: configuration
+    attributes:
+      label: Configuration
+      description: Export the configuration using the admin page and copy/paste here.
+      value: |
+        ```
+        {
+          ...
+        }
+        ```
+    validations:
+      required: true
+
+  - type: textarea
+    id: steps
+    attributes:
+      label: Steps to reproduce
+      description: How reproduce the bug?
+    validations:
+      required: false
+
+  - type: textarea
+    id: resuts
+    attributes:
+      label: Observed Results
+      description: What happened?
+    validations:
+      required: false
+
+  - type: textarea
+    id: expected
+    attributes:
+      label: Expected Results
+      description: What should happen?
+    validations:
+      required: false
+
+  - type: textarea
+    id: extra
+    attributes:
+      label: More informations
+      description: If you want to share more things, this is here!
+    validations:
+      required: false

.woodpecker.yml

@@ -5,16 +5,37 @@ pipeline:
       - make dep
     when:
       event: [tag, push, pull_request]
-      branch: [master, develop, feature/*]
+      branch: [master, develop, feature/*, translations]
+
+  osv_detector:
+    image: gitnet.fr/deblan/docker-osv-detector:v0.9
+    commands:
+      - osv-detector package-lock.json
+    failure: ignore
 
   build:
     image: gitnet.fr/deblan/devenv
     commands:
       - make build
     when:
-      branch: [master, develop, feature/*]
+      branch: [master, develop, feature/*, translations]
       event: [push, pull_request]
 
+  code_quality:
+    image: sonarsource/sonar-scanner-cli
+    secrets: [sonar_token, sonar_host, sonar_project]
+    commands:
+      - sonar-scanner
+        -Dsonar.projectKey=$SONAR_PROJECT
+        -Dsonar.sources=.
+        -Dsonar.host.url=$SONAR_HOST
+        -Dsonar.pullrequest.key=$CI_COMMIT_PULL_REQUEST
+        -Dsonar.pullrequest.branch=$CI_COMMIT_SOURCE_BRANCH
+        -Dsonar.pullrequest.base=$CI_COMMIT_TARGET_BRANCH
+    failure: ignore
+    when:
+      event: [pull_request]
+
   package:
     image: gitnet.fr/deblan/devenv
     volumes:

CHANGELOG.md

@@ -1,9 +1,29 @@
 ## [Unreleased]
 
+## 3.5.2
+### Fixed
+* add check if menu exists before adding event listeners (#210)
+
+## 3.5.1
+### Added
+* add translations (thanks to p-bo adn gallegonovato)
+### Fixed
+* fix #189: sorting not applied on mobile
+
+## 3.5.0
+### Added
+* add dependency check (ci)
+* add code quality check (ci)
+* add translations (thanks to gallegonovato)
+* add option to disable the display labels in the top menu (#194)
+### Fixed
+* fix missing img alt (settings image)
+* fix code quality alerts
+
 ## 3.4.1
-## Added
+### Added
 * add translations (thanks to zonorti, jorisvandijk, jak2k)
-## Fixed
+### Fixed
 * fix #183: hide custom categories list when empty (admin page)
 
 ## 3.4.0

Makefile

@@ -34,4 +34,4 @@ translations:
 .ONESHELL:
 run-code-quality-analysis:
 	export SONAR_TOKEN="$$SONAR_TOKEN_DEBLAN_SIDE_MENU"
-	sonar-scanner -Dsonar.projectKey=deblan-side_menu -Dsonar.sources=. -Dsonar.host.url=https://cq.gitnet.fr
+	sonar-scanner -Dsonar.projectKey=deblan-side_menu -Dsonar.sources=. -Dsonar.host.url=$$SONAR_SERVER -Dsonar.branch.name=$$(git branch --show-current)

appinfo/info.xml

@@ -32,7 +32,7 @@ Notice
 Because I believe in a free and decentralized Internet, [Gitnet](https://gitnet.fr) is **self-hosted at home**.
 In case of downtime, you can download **Custom Menu** from [here](https://kim.deblan.fr/~side_menu/).
 ]]></description>
-    <version>3.4.1</version>
+    <version>3.5.2</version>
     <licence>agpl</licence>
     <author mail="contact@deblan.fr" homepage="https://www.deblan.io/">Simon Vieille</author>
     <namespace>SideMenu</namespace>

css/admin.css

@@ -186,7 +186,7 @@
 }
 
 .badge {
-  border-size: 1px;
+  border-width: 1px;
   padding: 2px 8px;
   margin-right: 2px;
   margin-bottom: 5px;

css/sideMenu.css

@@ -235,9 +235,6 @@
 
 .side-menu-always-displayed body {
   width: calc(100% - 50px) !important;
-}
-
-.side-menu-always-displayed body {
   position: absolute;
   left: 50px;
 }

lib/Controller/AppController.php

@@ -86,7 +86,11 @@ class AppController extends Controller
 
     protected function redirectToApp($appId): RedirectResponse
     {
-        $isIgnoreFrontController = true === OC::$server->getConfig()->getSystemValue('htaccess.IgnoreFrontController', false);
+        $isIgnoreFrontController = true === OC::$server->getConfig()->getSystemValue(
+            'htaccess.IgnoreFrontController',
+            false
+        );
+
         $isFrontControllerActive = 'true' === getenv('front_controller_active');
 
         if ($isIgnoreFrontController || $isFrontControllerActive) {

lib/Controller/CssController.php

@@ -21,14 +21,14 @@ namespace OCA\SideMenu\Controller;
 use OC;
 use OC\User\User;
 use OCA\SideMenu\AppInfo\Application;
+use OCA\SideMenu\Service\Color;
 use OCA\SideMenu\Service\ConfigProxy;
+use OCA\Theming\ThemingDefaults;
 use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http\Response;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\IRequest;
 use OCP\IUserSession;
-use OCA\Theming\ThemingDefaults;
-use OCA\SideMenu\Service\Color;
 
 class CssController extends Controller
 {
@@ -58,8 +58,7 @@ class CssController extends Controller
         ConfigProxy $config,
         ThemingDefaults $theming,
         Color $color
-    )
+    ) {
-    {
         parent::__construct($appName, $request);
 
         $this->user = OC::$server[IUserSession::class]->getUser();
@@ -105,16 +104,18 @@ class CssController extends Controller
                 $topSideMenuApps = $userTopSideMenuApps;
             }
 
-            $isDarkThemeUserEnabled = $this->config->getUserValue($this->user, 'theme', '', 'accessibility') === 'dark';
+            $isDarkThemeUserEnabled = 'dark' === $this->config->getUserValue($this->user, 'theme', '', 'accessibility');
             $isBreezeDarkUserEnabled = $this->config->getUserValue($this->user, 'theme_enabled', '', 'breezedark');
 
-            $isBreezeDarkUserEnabled = $isBreezeDarkUserEnabled === '1' || ($isBreezeDarkGlobalEnabled && $isBreezeDarkUserEnabled === '');
+            $isBreezeDarkUserEnabled = '1' === $isBreezeDarkUserEnabled ||
+                ($isBreezeDarkGlobalEnabled && '' === $isBreezeDarkUserEnabled);
         } else {
             $isDarkThemeUserEnabled = false;
             $isBreezeDarkUserEnabled = false;
         }
 
-        $isDarkMode = ($isAccessibilityAppEnabled && $isDarkThemeUserEnabled) || ($isBreezeDarkAppEnabled && $isBreezeDarkUserEnabled);
+        $isDarkMode = ($isAccessibilityAppEnabled && $isDarkThemeUserEnabled) ||
+            ($isBreezeDarkAppEnabled && $isBreezeDarkUserEnabled);
 
         $primaryColor = $this->theming->getColorPrimary();
         $lightenPrimaryColor = $this->color->adjustBrightness($primaryColor, 0.2);
@@ -125,25 +126,33 @@ class CssController extends Controller
         if ($isDarkMode) {
             $backgroundColor = $this->config->getAppValue('dark-mode-background-color', $darkenPrimaryColor);
             $backgroundColorTo = $this->config->getAppValue('dark-mode-background-color-to', $darkenPrimaryColor);
-            $currentAppBackgroundColor = $this->config->getAppValue('dark-mode-current-app-background-color', $darkenPrimaryColor2);
+            $currentAppBackgroundColor = $this->config->getAppValue(
+                'dark-mode-current-app-background-color',
+                $darkenPrimaryColor2
+            );
             $loaderColor = $this->config->getAppValue('dark-mode-loader-color', $lightenPrimaryColor);
             $textColor = $this->config->getAppValue('dark-mode-text-color', $textColor);
             $iconInvertFilter = abs($this->config->getAppValueInt('dark-mode-icon-invert-filter', '0')).'%';
             $iconOpacity = abs($this->config->getAppValueInt('dark-mode-icon-opacity', '100') / 100);
             $opener = $this->config->getAppValue('dark-mode-opener', 'side-menu-opener');
 
-            $backgroundOpacity = dechex($this->config->getAppValueInt('dark-mode-background-color-opacity', '100') * 255 / 100);
+            $opacity = $this->config->getAppValueInt('dark-mode-background-color-opacity', '100');
+            $backgroundOpacity = dechex($opacity * 255 / 100);
         } else {
             $backgroundColor = $this->config->getAppValue('background-color', $darkenPrimaryColor);
             $backgroundColorTo = $this->config->getAppValue('background-color-to', $darkenPrimaryColor);
-            $currentAppBackgroundColor = $this->config->getAppValue('current-app-background-color', $darkenPrimaryColor2);
+            $currentAppBackgroundColor = $this->config->getAppValue(
+                'current-app-background-color',
+                $darkenPrimaryColor2
+            );
             $loaderColor = $this->config->getAppValue('loader-color', $lightenPrimaryColor);
             $textColor = $this->config->getAppValue('text-color', $textColor);
             $iconInvertFilter = abs($this->config->getAppValueInt('icon-invert-filter', '0')).'%';
             $iconOpacity = abs($this->config->getAppValueInt('icon-opacity', '100') / 100);
             $opener = $this->config->getAppValue('opener', 'side-menu-opener');
 
-            $backgroundOpacity = dechex($this->config->getAppValueInt('background-color-opacity', '100') * 255 / 100);
+            $opacity = $this->config->getAppValueInt('background-color-opacity', '100');
+            $backgroundOpacity = dechex($opacity * 255 / 100);
         }
 
         $backgroundColor .= $backgroundOpacity;

lib/Controller/JsController.php

@@ -95,7 +95,6 @@ class JsController extends Controller
     {
         $topMenuApps = $this->config->getAppValueArray('top-menu-apps', '[]');
         $topSideMenuApps = $this->config->getAppValueArray('top-side-menu-apps', '[]');
-        $topMenuAppsOrder = $this->config->getAppValueArray('top-menu-apps-order', '[]');
         $targetBlankApps = $this->config->getAppValueArray('target-blank-apps', '[]');
         $useAvatar = $this->config->getAppValueBool('use-avatar', '0');
         $isForced = $this->config->getAppValueBool('force', '0');
@@ -172,6 +171,10 @@ class JsController extends Controller
             'avatar' => $avatar,
             'top-menu-apps' => $topMenuApps,
             'top-side-menu-apps' => $topSideMenuApps,
+            'top-menu-mouse-over-hidden-label' => $this->config->getAppValueBool(
+                'top-menu-mouse-over-hidden-label',
+                '0'
+            ),
             'target-blank-apps' => $targetBlankApps,
             'settings' => $settings,
             'logo' => $this->themingDefaults->getLogo(),

lib/Controller/PersonalSettingController.php

@@ -43,8 +43,13 @@ class PersonalSettingController extends Controller
      */
     protected $userSession;
 
-    public function __construct($appName, IRequest $request, IConfig $config, ConfigProxy $configProxy, IUserSession $userSession)
+    public function __construct(
-    {
+        $appName,
+        IRequest $request,
+        IConfig $config,
+        ConfigProxy $configProxy,
+        IUserSession $userSession
+    ) {
         parent::__construct($appName, $request);
 
         $this->config = $config;

lib/Service/CategoryRepository.php

@@ -74,7 +74,8 @@ class CategoryRepository
         }
 
         foreach ($categoriesLabels as $k => $category) {
-            $categoriesLabels[$category['id']] = $category['translations'][$currentLanguage]['name'] ?? $category['translations']['en']['name'];
+            $categoriesLabels[$category['id']] = $category['translations'][$currentLanguage]['name'] ??
+                $category['translations']['en']['name'];
 
             unset($categoriesLabels[$k]);
         }

lib/Settings/Admin.php

@@ -125,15 +125,24 @@ class Admin implements ISettings
             'background-color' => $backgroundColor,
             'background-color-to' => $backgroundColorTo,
             'background-color-opacity' => $this->config->getAppValueInt('background-color-opacity', '100'),
-            'current-app-background-color' => $this->config->getAppValue('current-app-background-color', $darkenPrimaryColor2),
+            'current-app-background-color' => $this->config->getAppValue(
+                'current-app-background-color',
+                $darkenPrimaryColor2
+            ),
             'loader-color' => $this->config->getAppValue('loader-color', $lightenPrimaryColor),
             'icon-invert-filter' => $this->config->getAppValueInt('icon-invert-filter', '0'),
             'icon-opacity' => $this->config->getAppValueInt('icon-opacity', '100'),
             'text-color' => $this->config->getAppValue('text-color', $textColor),
             'dark-mode-background-color' => $darkModeBackgroundColor,
             'dark-mode-background-color-to' => $darkModeBackgroundColorTo,
-            'dark-mode-background-color-opacity' => $this->config->getAppValueInt('dark-mode-background-color-opacity', '100'),
+            'dark-mode-background-color-opacity' => $this->config->getAppValueInt(
-            'dark-mode-current-app-background-color' => $this->config->getAppValue('dark-mode-current-app-background-color', $darkenPrimaryColor2),
+                'dark-mode-background-color-opacity',
+                '100'
+            ),
+            'dark-mode-current-app-background-color' => $this->config->getAppValue(
+                'dark-mode-current-app-background-color',
+                $darkenPrimaryColor2
+            ),
             'dark-mode-loader-color' => $this->config->getAppValue('dark-mode-loader-color', $textColor),
             'dark-mode-icon-invert-filter' => $this->config->getAppValueInt('dark-mode-icon-invert-filter', '0'),
             'dark-mode-icon-opacity' => $this->config->getAppValueInt('dark-mode-icon-opacity', '100'),
@@ -159,6 +168,10 @@ class Admin implements ISettings
             'force' => $this->config->getAppValue('force', '0'),
             'target-blank-apps' => $this->config->getAppValueArray('target-blank-apps', '[]'),
             'top-menu-apps' => $this->config->getAppValueArray('top-menu-apps', '[]'),
+            'top-menu-mouse-over-hidden-label' => $this->config->getAppValue(
+                'top-menu-mouse-over-hidden-label',
+                '0'
+            ),
             'apps-order' => $this->config->getAppValueArray('apps-order', '[]'),
             'ordered-apps' => $this->appRepository->getOrderedApps(),
             'top-side-menu-apps' => $this->config->getAppValueArray('top-side-menu-apps', '[]'),

lib/Settings/Personal.php

@@ -54,8 +54,13 @@ class Personal implements ISettings
      */
     private $appRepository;
 
-    public function __construct(IL10N $l, ILogger $logger, ConfigProxy $config, IUserSession $userSession, AppRepository $appRepository)
+    public function __construct(
-    {
+        IL10N $l,
+        ILogger $logger,
+        ConfigProxy $config,
+        IUserSession $userSession,
+        AppRepository $appRepository
+    ) {
         $this->l = $l;
         $this->logger = $logger;
         $this->config = $config;

src/AppMenu.vue

@@ -22,12 +22,16 @@
 
 <template>
   <nav class="app-menu show">
-    <ul class="app-menu-main" v-if="apps !== null">
+    <ul
+      class="app-menu-main"
+      :class="{ 'app-menu-main__hidden-label': hiddenLabels }"
+      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 }"
+        :class="{ 'app-menu-entry__active': app.active, 'app-menu-entry__hidden-label': hiddenLabels }"
         :style="makeStyle(app)"
         >
         <a :href="app.href"
@@ -49,6 +53,7 @@
         :aria-label="appLabel(app)"
         :aria-current="app.active ? 'page' : false"
         :href="app.href"
+        :style="makeStyle(app)"
         class="app-menu-popover-entry">
         <template #icon>
           <div class="app-icon" :class="{ 'has-unread': app.unread > 0 }">
@@ -77,6 +82,7 @@ export default {
       appLimit: 0,
       observer: null,
       targetBlankApps: [],
+      hiddenLabels: true
     }
   },
   mounted() {
@@ -96,6 +102,7 @@ export default {
     })
 
     this.targetBlankApps = window.targetBlankApps
+    this.hiddenLabels = window.topMenuAppsMouseOverHiddenLabel
     this.observer = new ResizeObserver(this.resize)
     this.observer.observe(this.$el)
     this.resize()
@@ -104,13 +111,19 @@ export default {
     this.observer.disconnect()
   },
   methods: {
-    appLabel() {
+    appLabel(app) {
-      return (app) => app.name
+      return app.name
         + (app.active ? ' (' + t('core', 'Currently open') + ')' : '')
         + (app.unread > 0 ? ' (' + n('core', '{count} notification', '{count} notifications', app.unread, { count: app.unread }) + ')' : '')
     },
     appList() {
-      return Object.values(this.apps)
+      let items = Object.values(this.apps)
+
+      items.sort((a, b) => {
+        return a.order < b.order ? -1 : 1;
+      })
+
+      return items
     },
     mainAppList() {
       return this.appList().slice(0, this.appLimit)
@@ -220,8 +233,8 @@ $header-icon-size: 20px;
       overflow: hidden;
     }
 
-    &:hover,
+    &:not(.app-menu-entry__hidden-label):hover,
-    &:focus-within {
+    &:not(.app-menu-entry__hidden-label):focus-within {
       opacity: 1;
       .app-menu-entry--label {
         opacity: 1;
@@ -241,7 +254,12 @@ $header-icon-size: 20px;
   .app-menu-entry:hover,
   .app-menu-entry:focus {
     opacity: 1;
+  }
 
+  &:not(.app-menu-main__hidden-label):hover,
+  &:not(.app-menu-main__hidden-label):focus-within,
+  .app-menu-entry:not(.app-menu-entry__hidden-label):hover,
+  .app-menu-entry:not(.app-menu-entry__hidden-label):focus {
     img {
       margin-top: -6px;
     }

src/SettingsButton.vue

@@ -20,7 +20,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       {{ label }}
 
       <span class="avatardiv avatardiv-shown">
-        <img v-bind:src="avatar">
+        <img v-bind:src="avatar" :alt="label">
       </span>
     </a>
   </div>

src/SideMenu.vue

@@ -53,7 +53,6 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 </template>
 
 <script>
-import trim from 'trim'
 import axios from 'axios'
 import OpenerButton from './OpenerButton'
 import SettingsButton from './SettingsButton'

src/l10n/fixtures/cs.yaml

@@ -90,3 +90,4 @@
 "Applications kept in the top menu": "Aplikace ponechané v horní nabídce"
 "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"

src/l10n/fixtures/de.yaml

@@ -3,21 +3,14 @@
 "No": "Nein"
 "Yes": "Ja"
 "Menu": "Menü"
-? 'Use the shortcut <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span>
+? 'Use the shortcut <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span> to open and to hide the side menu. Use <span class="keyboard-key">tab</span> to navigate.'
-  to open and to hide the side menu. Use <span class="keyboard-key">tab</span> to
+: 'Verwende die Tastenkombination <span class="keyboard-key">Strg</span>+<span class="keyboard-key">o</span>, um das Seitenmenü ein- und auszublenden. Verwende <span class="keyboard-key">tab</span> zum Navigieren.'
-  navigate.'
-: 'Verwende die Tastenkombination <span class="keyboard-key">Strg</span>+<span class="keyboard-key">o</span>,
-  um das Seitenmenü ein- und auszublenden. Verwende <span class="keyboard-key">tab</span>
-  zum Navigieren.'
 "Top menu": "Obere Navigationsleiste"
-"Apps that not must be moved in the side menu": "Anwendungen, die nicht ins Seitenmenü\
+"Apps that not must be moved in the side menu": "Anwendungen, die nicht ins Seitenmenü verschoben werden sollen"
-  \ verschoben werden sollen"
+"If there is no selection then the global configuration is applied.": "Wenn keine Auswahl vorhanden ist, wird die globale Konfiguration angewendet."
-"If there is no selection then the global configuration is applied.": "Wenn keine\
-  \ Auswahl vorhanden ist, wird die globale Konfiguration angewendet."
 "Experimental": "Experimentell"
 "Save": "Speichern"
-"You like this app and you want to support me?": "Du magst diese Anwendung und möchtest\
+"You like this app and you want to support me?": "Du magst diese Anwendung und möchtest mich unterstützen?"
-  \ mich unterstützen?"
 "Buy me a coffee ☕": "Gib mir einen Kaffee aus ☕"
 "Hidden": "Ausblenden"
 "Small": "Klein"
@@ -44,21 +37,16 @@
 "After the logo": "Nach dem Logo"
 "Position": "Position"
 "Show only the opener (hidden logo)": "Nur das Menü-Symbol anzeigen (Logo wird ausgeblendet)"
-"Do not display the side menu and the opener if there is no application (eg: public pages).": "Zeige\
+"Do not display the side menu and the opener if there is no application (eg: public pages).": "Zeige das Seitenmenü und das Menü-Symbol nicht an, wenn keine Anwendung vorhanden ist (z.B. bei öffentlichen Seiten)."
-  \ das Seitenmenü und das Menü-Symbol nicht an, wenn keine Anwendung vorhanden ist\
-  \ (z.B. bei öffentlichen Seiten)."
 "Panel": "Panel"
-"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Öffne\
+"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Öffne das Menü, wenn die Maus über das Menü-Symbol bewegt wird (auf Touchscreens automatisch deaktiviert)"
-  \ das Menü, wenn die Maus über das Menü-Symbol bewegt wird (auf Touchscreens automatisch\
-  \ deaktiviert)"
 "Display the big menu": "Großes Menü anzeigen"
 "Display the logo": "Logo anzeigen"
 "Icons and texts": "Symbole und Texte"
 "Loader enabled": "Ladestandanzeige aktiviert"
 "Tips": "Tipps"
 "Always displayed": "Immer anzeigen"
-"This is the automatic behavior when the menu is always displayed.": "Dies ist das\
+"This is the automatic behavior when the menu is always displayed.": "Dies ist das automatische Verhalten, wenn das Menü immer angezeigt wird."
-  \ automatische Verhalten, wenn das Menü immer angezeigt wird."
 "Not compatible with touch screens.": "Nicht kompatibel mit Touchscreens."
 "Big menu": "Großes Menü"
 "Live preview": "Live-Vorschau"
@@ -67,20 +55,15 @@
 "Use my selection": "Verwende meine Auswahl"
 "Show and hide the list of applications": "Ein- und Ausblenden der Anwendungsliste"
 "Use the avatar instead of the logo": "Avatar anstelle des Logos anzeigen"
-"You do not have permission to change the settings.": "Du hast keine Berechtigung,\
+"You do not have permission to change the settings.": "Du hast keine Berechtigung, die Einstellungen dieser Anwendung zu ändern."
-  \ die Einstellungen dieser Anwendung zu ändern."
 "Force this configuration to users": "Konfiguration für alle Benutzer erzwingen"
 "Export the configuration": "Konfiguration exportieren"
 "Purge the cache": "Cache leeren"
 "Show the link to settings": "Link zu den Einstellungen anzeigen"
-"The menu is enabled by default for users": "Das Menü ist standardmäßig für alle Benutzer\
+"The menu is enabled by default for users": "Das Menü ist standardmäßig für alle Benutzer aktiviert"
-  \ aktiviert"
+"Except when the configuration is forced.": "Gilt nicht, wenn die Konfiguration erzwungen wird."
-"Except when the configuration is forced.": "Gilt nicht, wenn die Konfiguration erzwungen\
+"Apps that should not be displayed in the menu": "Anwendungen, die nicht im Menü angezeigt werden sollen"
-  \ wird."
+"This feature is only compatible with the <code>big menu</code> display.": "Kompatibel mit dem <code>großen Menü</code>."
-"Apps that should not be displayed in the menu": "Anwendungen, die nicht im Menü angezeigt\
-  \ werden sollen"
-"This feature is only compatible with the <code>big menu</code> display.": "Kompatibel\
-  \ mit dem <code>großen Menü</code>."
 "The logo is a link to the default app": "Das Logo ist ein Link zur Standard-App"
 "Others": "Andere"
 "Categories": "Kategorien"
@@ -89,9 +72,7 @@
 "Name": "Name"
 "Customed": "Benutzerdefiniert"
 "Show and hide the list of categories": "Liste der Kategorien ein- und ausblenden"
-"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Diese\
+"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Diese Optionen werden auf <code>Dark Theme</code> oder <code>Breeze Dark Theme</code> angewendet."
-  \ Optionen werden auf <code>Dark Theme</code> oder <code>Breeze Dark Theme</code>\
-  \ angewendet."
 "Dark mode colors": "Farben für den dunklen Modus"
 "With categories": "Mit Kategorien"
 "Custom categories": "Benutzerdefinierte Kategorien"
@@ -105,9 +86,8 @@
 "Small text": "Kleiner Text"
 "Normal text": "Normaler Text"
 "Big text": "Großer Text"
-"Applications": "Applications"
+"Applications": "Anwendungen"
 "Applications kept in the top menu": "Applications kept in the top menu"
-"Applications kept in the top menu but also shown in side menu": "Applications kept\
+"Applications kept in the top menu but also shown in side menu": "Applications kept in the top menu but also shown in side menu"
-  \ 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."
-"These applications must be selected in the previous option.": "These applications\
+"Hide labels on mouse over": "Hide labels on mouse over"
-  \ must be selected in the previous option."

src/l10n/fixtures/es.yaml

@@ -0,0 +1,93 @@
+"Custom menu": "Menú personalizado"
+"Enable the custom menu": "Habilitar el menú personalizado"
+"No": "No"
+"Yes": "Sí"
+"Menu": "Menú"
+? 'Use the shortcut <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span> to open and to hide the side menu. Use <span class="keyboard-key">tab</span> to navigate.'
+: 'Usa la combinación de teclas <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span> para activar y desactivar el menú lateral. Use <span class="keyboard-key">tab</span> para navegar.'
+"Top menu": "Menu principal"
+"Apps that not must be moved in the side menu": "Aplicaciones que no se deben mover al menú lateral"
+"If there is no selection then the global configuration is applied.": "Si no hay selección, se aplica la configuración global."
+"Experimental": "En pruebas"
+"Save": "Guardar"
+"You like this app and you want to support me?": "¿Te gusta esta aplicación y quieres apoyarme?"
+"Buy me a coffee ☕": "Cómprame un café ☕"
+"Hidden": "Oculto"
+"Small": "Pequeño"
+"Normal": "Normal"
+"Big": "Grande"
+"Hidden icon": "Ocultar Icono"
+"Small icon": "Icono pequeño"
+"Normal icon": "Icono normal"
+"Big icon": "Icono grande"
+"Hidden text": "Texto oculto"
+"Small text": "Texto pequeño"
+"Normal text": "Texto normal"
+"Big text": "Texto grande"
+"Colors": "Colores"
+"Background color": "Color de fondo"
+"Background color of current app": "Color de fondo de la aplicación actual"
+"Text color": "Color del texto"
+"Loader": "Cargador"
+"Icon": "Icono"
+"Same color": "El mismo color"
+"Opposite color": "Color opuesto"
+"Transparent": "Transparente"
+"Opaque": "Opaco"
+"Opener": "Abrir"
+"Default": "Por defecto"
+"Default (dark)": "Por defecto (oscuro)"
+"Hamburger": "Hamburguesa"
+"Hamburger (dark)": "Hamburger (negro)"
+"Hamburger 2": "Hamburguesa 2"
+"Hamburger 2 (dark)": "Hamburger 2 (negro)"
+"Before the logo": "Antes del logotipo"
+"After the logo": "Después del logotipo"
+"Position": "Posición"
+"Show only the opener (hidden logo)": "Mostrar solo abrir (ocultar logotipo)"
+"Do not display the side menu and the opener if there is no application (eg: public pages).": "No mostrar el menú lateral y el abridor si no hay aplicación (por ejemplo: páginas públicas)."
+"Panel": "Panel"
+"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Abra el menú cuando el ratón esté sobre el icono (se desactiva automáticamente en las pantallas táctiles)"
+"Display the big menu": "Mostrar el menú grande"
+"Display the logo": "Mostrar el logotipo"
+"Icons and texts": "Iconos y textos"
+"Loader enabled": "Cargador activado"
+"Tips": "Consejos"
+"Always displayed": "Siempre se muestra"
+"This is the automatic behavior when the menu is always displayed.": "Este es el comportamiento automático cuando aún se muestra el menú."
+"Not compatible with touch screens.": "No es compatible con las pantallas táctiles."
+"Big menu": "Menú grande"
+"Live preview": "Previsualización en directo"
+"Open apps in new tab": "Abrir las aplicaciones en una nueva pestaña"
+"Use the global setting": "Utilizar la configuración global"
+"Use my selection": "Utilizar mi selección"
+"Show and hide the list of applications": "Mostrar y ocultar la lista de aplicaciones"
+"Use the avatar instead of the logo": "Utilizar un avatar en lugar de un logotipo"
+"You do not have permission to change the settings.": "No tienes permiso para cambiar la configuración."
+"Force this configuration to users": "Forzar esta configuración a todos los usuarios"
+"Export the configuration": "Exportar la configuración"
+"Purge the cache": "Vaciar la caché"
+"Show the link to settings": "Mostrar un enlace a la configuración"
+"The menu is enabled by default for users": "El menú está activado por defecto para los usuarios"
+"Except when the configuration is forced.": "Excepto cuando la configuración es forzada."
+"Apps that should not be displayed in the menu": "Aplicaciones que no deben aparecer en el menú"
+"This feature is only compatible with the <code>big menu</code> display.": "Esta función sólo es compatible con la pantalla del <code>menú grande</code>."
+"The logo is a link to the default app": "El logotipo es un enlace a la aplicación por defecto"
+"Others": "Otros"
+"Categories": "Categorías"
+"Customize sorting": "Personalizar la clasificación"
+"Order by": "Ordenar por"
+"Name": "Nombre"
+"Customed": "Personalizado"
+"Show and hide the list of categories": "Mostrar y ocultar la lista de categorías"
+"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Estos parámetros se utilizan cuando el tema oscuro o el tema oscuro de Breeze están activados."
+"Dark mode colors": "Colores del modo oscuro"
+"With categories": "Con categorías"
+"Custom categories": "Categorías personalizadas"
+"Customize application categories": "Personalizar las categorías de las aplicaciones"
+"Reset to default": "Restablecer los valores por defecto"
+"Applications": "Aplicaciones"
+"Applications kept in the top menu": "Aplicaciones guardadas en el menú superior"
+"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"

src/l10n/fixtures/fr.yaml

@@ -90,3 +90,4 @@
 "Applications kept in the top menu": "Applications conservées dans le menu supérieur"
 "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"

src/l10n/fixtures/nl.yaml

@@ -90,3 +90,4 @@
 "Applications kept in the top menu": "Applicaties bewaard in het bovenste menu"
 "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"

src/l10n/fixtures/ru.yaml

@@ -31,10 +31,10 @@
 "Loader": "Загрузчик"
 "Icon": "Иконка"
 "Same color": "Такой же цвет"
-"Opposite color": "Opposite color"
+"Opposite color": "Противоположный цвет"
 "Transparent": "Прозрачный"
-"Opaque": "Opaque"
+"Opaque": "Непрозрачный"
-"Opener": "Opener"
+"Opener": "Открывалка"
 "Default": "По-умолчанию"
 "Default (dark)": "По-умолчанию (тёмный)"
 "Hamburger": "Гамбургер"
@@ -44,10 +44,10 @@
 "Before the logo": "Перед логотипом"
 "After the logo": "После логотипа"
 "Position": "Позиция"
-"Show only the opener (hidden logo)": "Show only the opener (hidden logo)"
+"Show only the opener (hidden logo)": "Показать только открывающую часть (скрытый логотип)"
-"Do not display the side menu and the opener if there is no application (eg: public pages).": "Do not display the side menu and the opener if there is no application (eg: public pages)."
+"Do not display the side menu and the opener if there is no application (eg: public pages).": "Не отображать боковое меню и открывалку, если нет приложения (например, публичные страницы)."
 "Panel": "Панеот"
-"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Open the menu when the mouse is hover the opener (automatically disabled on touch screens)"
+"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Открывать меню при наведении мыши на экран (автоматически отключается на сенсорных экранах)"
 "Display the big menu": "Отобразить большое меню"
 "Display the logo": "Показать лого"
 "Icons and texts": "Иконки и текст"
@@ -90,3 +90,4 @@
 "Applications kept in the top menu": "Applications kept in the top menu"
 "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"

src/l10n/fixtures/tpl/base.yaml

@@ -92,3 +92,4 @@
 "Applications kept in the top menu": ""
 "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": ""

src/l10n/fixtures/zh_CN.yaml

@@ -3,11 +3,8 @@
 "No": "取消"
 "Yes": "确定"
 "Menu": "菜单"
-? "Use the shortcut <span class=\"keyboard-key\">Ctrl</span>+<span class=\"keyboard-key\"\
+? "Use the shortcut <span class=\"keyboard-key\">Ctrl</span>+<span class=\"keyboard-key\">o</span> to open and to hide the side menu. Use <span class=\"keyboard-key\">tab</span> to navigate."
-  >o</span> to open and to hide the side menu. Use <span class=\"keyboard-key\">tab</span>\
+: "使用快捷键 <span class=\"keyboard-key\">Ctrl</span>+<span class=\"keyboard-key\">o</span> 打开或隐藏侧边栏菜单。使用<span class=\"keyboard-key\">tab</span> 来导航。"
-  \ to navigate."
-: "使用快捷键 <span class=\"keyboard-key\">Ctrl</span>+<span class=\"keyboard-key\">o</span>\
-  \ 打开或隐藏侧边栏菜单。使用<span class=\"keyboard-key\">tab</span> 来导航。"
 "Top menu": "顶部菜单"
 "Apps that not must be moved in the side menu": "禁止在侧边栏菜单移动的应用"
 "If there is no selection then the global configuration is applied.": "如不选择，将应用全局设定。"
@@ -40,11 +37,9 @@
 "After the logo": "在logo后"
 "Position": "位置"
 "Show only the opener (hidden logo)": "只显示容器 (隐藏logo)"
-"Do not display the side menu and the opener if there is no application (eg: public pages).": "N如果没有应用，不显示侧边栏菜单和容器\
+"Do not display the side menu and the opener if there is no application (eg: public pages).": "N如果没有应用，不显示侧边栏菜单和容器 (例如 : 公共页面)。"
-  \ (例如 : 公共页面)。"
 "Panel": "面板"
-"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "鼠标悬停时打开菜单\
+"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "鼠标悬停时打开菜单 (触摸屏时将自动禁用)"
-  \ (触摸屏时将自动禁用)"
 "Display the big menu": "显示大型菜单"
 "Display the logo": "显示logo"
 "Icons and texts": "图标与文字"
@@ -93,7 +88,6 @@
 "Big text": "大文本"
 "Applications": "Applications"
 "Applications kept in the top menu": "Applications kept in the top menu"
-"Applications kept in the top menu but also shown in side menu": "Applications kept\
+"Applications kept in the top menu but also shown in side menu": "Applications kept in the top menu but also shown in side menu"
-  \ 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."
-"These applications must be selected in the previous option.": "These applications\
+"Hide labels on mouse over": "Hide labels on mouse over"
-  \ must be selected in the previous option."

templates/js/script.php

@@ -27,6 +27,7 @@ if ($_['always-displayed']) {
   window.topMenuApps = <?php echo json_encode($_['top-menu-apps']), "\n"; ?>
   window.topSideMenuApps = <?php echo json_encode($_['top-side-menu-apps']), "\n"; ?>
   window.menuAppsOrder = <?php echo json_encode($_['apps-order']), "\n"; ?>
+  window.topMenuAppsMouseOverHiddenLabel = <?php echo json_encode($_['top-menu-mouse-over-hidden-label']), "\n"; ?>
 
   <?php if ($display === 'big-menu'): ?>
     sideMenu.setAttribute('data-bigmenu', '1')
@@ -72,6 +73,10 @@ if ($_['always-displayed']) {
     const headerMenuOpener = document.querySelector('#header .side-menu-opener')
     const sideMenuOpener = document.querySelectorAll('#side-menu .side-menu-opener')
 
+    if (!headerMenuOpener) {
+      return
+    }
+
     sideMenuFocus = () => {
       let a = document.querySelector('.side-menu-app.active a', sideMenu)
 
@@ -173,9 +178,11 @@ if ($_['always-displayed']) {
     PageLoader()
   <?php endif; ?>
 
-  <?php if ($_['opener-position'] === 'before'): ?>
+  if (nextcloud) {
-    nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud)
+    <?php if ($_['opener-position'] === 'before'): ?>
-  <?php else: ?>
+      nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud)
-    nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud.nextSibling)
+    <?php else: ?>
-  <?php endif; ?>
+      nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud.nextSibling)
+    <?php endif; ?>
+  }
 })();

templates/settings/admin-form.php

@@ -41,6 +41,9 @@ $choicesSizes = [
 
 $labelShowHideApps = 'Show and hide the list of applications';
 $labelReset = 'Reset to default';
+$labelWithCategories = 'With categories';
+$labelBigMenu = 'Big menu';
+$labelAlwaysDisplayed = 'Always displayed';
 
 ?>
 <div id="side-menu-section">
@@ -75,7 +78,7 @@ $labelReset = 'Reset to default';
 
         <div>
             <label>
-                <?php p($l->t('With categories')); ?>
+                <?php p($l->t($labelWithCategories)); ?>
             </label>
         </div>
         <p>
@@ -84,12 +87,12 @@ $labelReset = 'Reset to default';
                 data-alwaysdiplayed="0"
                 data-bigmenu="0"
                 data-sidewithcategories="1"
-                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-side-with-categories.svg')); ?>" alt="<?php p($l->t('With categories')); ?>">
+                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-side-with-categories.svg')); ?>" alt="<?php p($l->t($labelWithCategories)); ?>">
         </p>
 
         <div>
             <label for="side-menu-opener">
-                <?php p($l->t('Big menu')); ?>
+                <?php p($l->t($labelBigMenu)); ?>
             </label>
         </div>
         <p>
@@ -98,12 +101,12 @@ $labelReset = 'Reset to default';
                 data-alwaysdiplayed="0"
                 data-bigmenu="1"
                 data-sidewithcategories="0"
-                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-big-menu.svg')); ?>" alt="<?php p($l->t('Big menu')); ?>">
+                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-big-menu.svg')); ?>" alt="<?php p($l->t($labelBigMenu)); ?>">
         </p>
 
         <div>
             <label for="side-menu-opener">
-                <?php p($l->t('Always displayed')); ?>
+                <?php p($l->t($labelAlwaysDisplayed)); ?>
             </label>
         </div>
         <p><em><?php p($l->t('Not compatible with touch screens.')); ?></em></p>
@@ -113,7 +116,7 @@ $labelReset = 'Reset to default';
                 data-alwaysdiplayed="1"
                 data-bigmenu="0"
                 data-sidewithcategories="0"
-                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-always-displayed.svg')); ?>" alt="<?php p($l->t('Always displayed')); ?>">
+                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-always-displayed.svg')); ?>" alt="<?php p($l->t($labelAlwaysDisplayed)); ?>">
         </p>
 
         <input
@@ -148,9 +151,9 @@ $labelReset = 'Reset to default';
 
         <div class="badges">
             <span class="badge badge-1"><?php p($l->t('Default')); ?></span>
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t('Always displayed')); ?></span>
+            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
         </div>
 
         <div class="side-menu-setting-table">
@@ -339,9 +342,9 @@ $labelReset = 'Reset to default';
 
         <div class="badges">
             <span class="badge badge-1"><?php p($l->t('Default')); ?></span>
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t('Always displayed')); ?></span>
+            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
         </div>
 
         <p>
@@ -534,9 +537,9 @@ $labelReset = 'Reset to default';
 
         <div class="badges">
             <span class="badge badge-1"><?php p($l->t('Default')); ?></span>
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t('Always displayed')); ?></span>
+            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
         </div>
 
         <div class="side-menu-setting-table">
@@ -675,8 +678,8 @@ $labelReset = 'Reset to default';
                     <?php p($l->t('Apps that should not be displayed in the menu')); ?>
 
                     <div class="badges">
-                        <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+                        <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-                        <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+                        <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
                     </div>
                 </div>
                 <div class="side-menu-setting-form">
@@ -799,9 +802,9 @@ $labelReset = 'Reset to default';
 
         <div class="badges">
             <span class="badge badge-1"><?php p($l->t('Default')); ?></span>
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t('Always displayed')); ?></span>
+            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
         </div>
 
         <div class="side-menu-setting-table">
@@ -868,6 +871,20 @@ $labelReset = 'Reset to default';
                     </div>
                 </div>
             </div>
+            <div class="side-menu-setting-row">
+                <div class="side-menu-setting-label">
+                    <?php p($l->t('Hide labels on mouse over')); ?>
+                </div>
+                <div class="side-menu-setting-form">
+                    <select id="side-menu-top-menu-mouse-over-hidden-label" name="top-menu-mouse-over-hidden-label" class="side-menu-setting">
+                        <?php foreach ($choicesYesNo as $label => $value): ?>
+                            <option value="<?php echo $value ?>" <?php if ($value === $_['top-menu-mouse-over-hidden-label']): ?>selected<?php endif; ?>>
+                                <?php echo $l->t($label);  ?>
+                            </option>
+                        <?php endforeach; ?>
+                    </select>
+                </div>
+            </div>
         </div>
     </div>
 
@@ -878,9 +895,9 @@ $labelReset = 'Reset to default';
 
         <div class="badges">
             <span class="badge badge-1"><?php p($l->t('Default')); ?></span>
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t('Always displayed')); ?></span>
+            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
         </div>
 
         <div class="side-menu-setting-table">
@@ -924,8 +941,8 @@ $labelReset = 'Reset to default';
         </h2>
 
         <div class="badges">
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
         </div>
 
         <div class="side-menu-setting-table">
@@ -1040,9 +1057,9 @@ $labelReset = 'Reset to default';
 
         <div class="badges">
             <span class="badge badge-1"><?php p($l->t('Default')); ?></span>
-            <span class="badge badge-2"><?php p($l->t('With categories')); ?></span>
+            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t('Big menu')); ?></span>
+            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t('Always displayed')); ?></span>
+            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
         </div>
 
         <p>