ignore /assets

Signed-off-by: Simon Vieille <simon@deblan.fr>

.gitea/issue_template/FEATURE_TEMPLATE.md

@@ -0,0 +1,16 @@
+---
+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

@@ -1,34 +0,0 @@
-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

@@ -0,0 +1,32 @@
+---
+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

@@ -1,69 +0,0 @@
-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 ([documentation](https://deblan.gitnet.page/side_menu_doc/tips/#export-the-configuration)).
-      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

.gitignore

@@ -1,4 +1,5 @@
 /js
+/assets
 /node_modules
 /l10n/*
 /releases

.woodpecker.yml

@@ -1,78 +1,25 @@
 pipeline:
   dependencies:
-    image: node:16
-    pull: true
+    image: gitnet.fr/deblan/devenv
     commands:
-      - npm i
+      - make dep
     when:
       event: [tag, push, pull_request]
-      branch: [master, develop, feature/*, fix/*, translations]
+      branch: [master, develop, feature/*]
 
-  osv-detector:
-    image: gitnet.fr/deblan/osv-detector:v0.10
+  build:
+    image: gitnet.fr/deblan/devenv
     commands:
-      - osv-detector package-lock.json
-    failure: ignore
-
-  build-js:
-    image: node:16
-    commands:
-      - npm run build
+      - make build
     when:
-      branch: [master, develop, feature/*, fix/*, translations]
-      event: [tag, push, pull_request]
+      event: [push, pull_request]
 
-  build-translations:
-    image: deblan/php:8.0
-    commands:
-      - php bin/generate_l10n.php
-    when:
-      branch: [master, develop, feature/*, fix/*, translations]
-      event: [tag, push, pull_request]
-
-  create-signature:
-    image: nextcloud:25
-    secrets: [app_certificate, app_public_certificate]
-    environment:
-      SQLITE_DATABASE: /var/www/data/data.db
-      NEXTCLOUD_ADMIN_USER: admin
-      NEXTCLOUD_ADMIN_PASSWORD: admin
-    commands:
-      - echo "$APP_CERTIFICATE" > "/tmp/side_menu.key"
-      - echo "$APP_PUBLIC_CERTIFICATE" > "/tmp/side_menu.crt"
-      - mkdir /tmp/app
-      - cp -r README.md CHANGELOG.md appinfo css lib img l10n js src templates screenshots vendor /tmp/app
-      - /usr/src/nextcloud/occ integrity:sign-app
-        --privateKey=/tmp/side_menu.key
-        --certificate=/tmp/side_menu.crt
-        --path=/tmp/app
-      - mv /tmp/app/appinfo/signature.json appinfo/
-    when:
-      event: [tag]
-
-  # check-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]
-
-  create-package:
-    image: deblan/php:8.0
+  package:
+    image: gitnet.fr/deblan/devenv
     volumes:
       - /var/www/html/artifacts:/var/www/html/artifacts
     secrets: [app_certificate]
     commands:
-      - apt-get update
-      - apt-get install -y zip make
       - mkdir -p "$HOME/.nextcloud/certificates"
       - echo "$APP_CERTIFICATE" > "$HOME/.nextcloud/certificates/side_menu.key"
       - export VERSION=$(grep "<version>" appinfo/info.xml | grep -o "[0-9]*\.[0-9]*\.[0-9]*" --color=never)
@@ -81,7 +28,7 @@ pipeline:
     when:
       event: [tag]
 
-  push-release:
+  release:
     image: plugins/gitea-release
     volumes:
       - /var/www/html/artifacts:/var/www/html/artifacts

CHANGELOG.md

@@ -1,98 +1,8 @@
 ## [Unreleased]
 
-## 3.9.1
-### Fixed
-* fix fixed menu on dashboard (#262)
-
-## 3.9.0
-### Added
-* add compatibility with NC27
-### Fixed
-* fix app redirect (#261)
-
-## 3.8.0
-### Added
-* add option to show hovered label only on top menu (fix #253)
-
-## 3.7.4
-### Fixed
-* fix Integrity failed (#247)
-
-## 3.7.3
-### Fixed
-* fix #244: use app href for redirection
-### Added
-* add signature on build
-
-## 3.7.2
-### Added
-* update pipeline conditions allowing `fix/*`
-### Fixed
-* fix #233: load configuration and then retrieve apps in default side menu display
-
-## 3.7.1
-### Fixed
-* fix build process (#230)
-
-## 3.7.0
-### Added
-* add translations (thanks to AHOHNMYC)
-* add compatibility with NC26
-
-## 3.6.0
-### Added
-* add hidden apps compatible with default menu (#219)
-
-## 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
-* add translations (thanks to zonorti, jorisvandijk, jak2k)
-### Fixed
-* fix #183: hide custom categories list when empty (admin page)
-
-## 3.4.0
-### Added
-* add translations (thanks to Pavelb, nier, Timur, p-bo)
-* add possibility to define Custom Menu as default app and redirect to the first top menu app (#177)
-
-## 3.3.2
-### Fixed
-* fix #173: reduce the height of categories list
-
-## 3.3.1
-### Fixed
-* fix #162: top and side apps does work correctly
-
-## 3.3.0
-### Added
-* add documentation in admin page
-* add app sorter in user config side (#160)
-### Fixed
-* fix #164: open apps in new tab does not work
-* fix #162 #159: top and side apps does work correctly
-
 ## 3.2.1
 ### Fixed
-* fix #150: active app is not visible has active in menu (except in default menu)
+* fix #150: Active app is not visible has active in menu (except in default menu)
 * fix #151: opener position
 
 ## 3.2.0

Makefile

@@ -9,7 +9,7 @@ dep:
 	npm link @nextcloud/vue || sudo npm link @nextcloud/vue
 
 .ONESHELL:
-release:
+release: build translations
 	if [ -z "$$VERSION" ]; then
 		echo "VERSION required"
 		exit 1
@@ -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=$$SONAR_SERVER -Dsonar.branch.name=$$(git branch --show-current)
+	sonar-scanner -Dsonar.projectKey=deblan-side_menu -Dsonar.sources=. -Dsonar.host.url=https://cq.gitnet.fr

README.md

@@ -3,7 +3,6 @@
 
 [![Build Status](https://ci.gitnet.fr/api/badges/deblan/side_menu/status.svg)](https://ci.gitnet.fr/deblan/side_menu)
 [![Translations](https://translate.codeberg.org/widgets/custom-menu/-/application/svg-badge.svg)](https://translate.codeberg.org/engage/custom-menu/)
-![Downloads](https://img.shields.io/badge/dynamic/json?color=brightgreen&label=downloads&query=%24.K_downloads&suffix=K&url=https%3A%2F%2Fapi-side-menu.deblan.org%2Fdownloads.php)
 
 Allows you to modify the position of the main menu by creating a panel on the left of the interface or with a big menu on the top.
 You can also add and sort custom categories, define apps that must be displayed in the top menu, etc. Fully customisable.
@@ -19,12 +18,10 @@ You can customize colors depending of the theme (Dark theme and Breeze Dark).
 
 You like this app and you want to support me? ☕ [Buy me a coffee](https://www.buymeacoffee.com/deblan) or [Donate with liberapay](https://liberapay.com/deblan)
 
-## [📘 Read the documentation](https://deblan.gitnet.page/side_menu_doc/)
-
 Requirements
 ------------
 
-* PHP >= 8.0
+* PHP >= 7.4
 * App `theming` enabled
 
 Installation and upgrade
@@ -50,16 +47,6 @@ Users can disable the menu using the page of personal settings.
 
 Use the shortcut `Ctrl`+`o` to open and to hide the side menu. Use `tab` to navigate.
 
-### Use first top menu app as default app
-
-You can easily let Custom Menu redirect to the first app in the top menu by changing the following parameter in your `config/config.php`:
-
-```
-'defaultapp' => 'side_menu',
-```
-
-If the top menu is empty then it redirects to files.
-
 How to contribute?
 ------------------
 

appinfo/info.xml

@@ -17,7 +17,7 @@ You can report a bug or request a feature by opening an issue.
 
 Requirements:
 
-* PHP >= 8.0
+* PHP >= 7.4
 * App `theming` enabled
 
 If you like this application and if you want to support the development:
@@ -32,12 +32,12 @@ 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.9.1</version>
+    <version>3.2.1</version>
     <licence>agpl</licence>
     <author mail="contact@deblan.fr" homepage="https://www.deblan.io/">Simon Vieille</author>
     <namespace>SideMenu</namespace>
     <documentation>
-        <admin>https://deblan.gitnet.page/side_menu_doc/</admin>
+        <admin>https://gitnet.fr/deblan/side_menu/src/branch/master/README.md</admin>
         <developer>https://gitnet.fr/deblan/side_menu/src/branch/master/README.md</developer>
     </documentation>
     <category>customization</category>
@@ -54,7 +54,7 @@ In case of downtime, you can download **Custom Menu** from [here](https://kim.de
     <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc25_big_menu.png</screenshot>
     <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc25_default_menu.png</screenshot>
     <dependencies>
-        <nextcloud min-version="25" max-version="27"/>
+        <nextcloud min-version="25" max-version="25"/>
         <php min-version="7.4"/>
     </dependencies>
     <settings>

appinfo/routes.php

@@ -19,7 +19,6 @@
 
 return [
     'routes' => [
-        ['name' => 'App#index', 'url' => '/', 'verb' => 'GET'],
         ['name' => 'Css#stylesheet', 'url' => '/css/stylesheet', 'verb' => 'GET'],
         ['name' => 'Js#script', 'url' => '/js/script', 'verb' => 'GET'],
         ['name' => 'Js#config', 'url' => '/js/config', 'verb' => 'GET'],

lib/AppInfo/Application.php

@@ -8,13 +8,13 @@ use OC\User\User;
 use OCA\SideMenu\Service\AppRepository;
 use OCA\SideMenu\Service\CategoryRepository;
 use OCA\SideMenu\Service\ConfigProxy;
+use OCA\SideMenu\Util\AssetUtil;
 use OCP\AppFramework\App;
 use OCP\AppFramework\Bootstrap\IBootContext;
 use OCP\AppFramework\Bootstrap\IBootstrap;
 use OCP\AppFramework\Bootstrap\IRegistrationContext;
 use OCP\IUserSession;
 use OCP\Util;
-use Psr\Container\ContainerInterface;
 
 /**
  * class Application.
@@ -72,21 +72,27 @@ class Application extends App implements IBootstrap
 
     protected function addAssets()
     {
-        Util::addScript(self::APP_ID, 'sideMenu');
-        Util::addStyle(self::APP_ID, 'sideMenu');
+        AssetUtil::getInstance()
+            // Add runtime.js
+            ->addEntrypointAsset('menu', 'js', 0)
+            // Add menu.js
+            ->addEntrypointAsset('menu', 'js', 1)
+            // Add menu.css
+            ->addEntrypointAsset('menu', 'css', 0)
+        ;
 
         $assets = [
-            'stylesheet' => [
-                'route' => 'side_menu.Css.stylesheet',
+            [
                 'type' => 'link',
+                'route' => 'side_menu.Css.stylesheet',
                 'route_attr' => 'href',
                 'attr' => [
                     'rel' => 'stylesheet',
                 ],
             ],
-            'script' => [
-                'route' => 'side_menu.Js.script',
+            [
                 'type' => 'script',
+                'route' => 'side_menu.Js.script',
                 'route_attr' => 'src',
                 'attr' => [
                     'nonce' => $this->cspnm->getNonce(),
@@ -99,7 +105,6 @@ class Application extends App implements IBootstrap
         foreach ($assets as $value) {
             $route = OC::$server->getURLGenerator()->linkToRoute($value['route'], ['v' => $cache]);
             $value['attr'][$value['route_attr']] = $route;
-
             Util::addHeader($value['type'], $value['attr'], '');
         }
     }

lib/Controller/AppController.php

@@ -1,110 +0,0 @@
-<?php
-/**
- * @license GNU AGPL version 3 or any later version
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program.  If not, see <http://www.gnu.org/licenses/>.
- */
-
-namespace OCA\SideMenu\Controller;
-
-use OC;
-use OCA\SideMenu\Service\AppRepository;
-use OCA\SideMenu\Service\ConfigProxy;
-use OCP\AppFramework\Controller;
-use OCP\AppFramework\Http\RedirectResponse;
-use OCP\IRequest;
-use OCP\IURLGenerator;
-use OCP\IUserSession;
-
-class AppController extends Controller
-{
-    /**
-     * @var ConfigProxy
-     */
-    protected $config;
-
-    /**
-     * @var AppRepository
-     */
-    protected $appRepository;
-
-    public function __construct(
-        string $appName,
-        IRequest $request,
-        AppRepository $appRepository,
-        IURLGenerator $urlGenerator,
-        ConfigProxy $config
-    ) {
-        parent::__construct($appName, $request);
-
-        $this->appRepository = $appRepository;
-        $this->urlGenerator = $urlGenerator;
-        $this->config = $config;
-    }
-
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     */
-    public function index(): RedirectResponse
-    {
-        $user = OC::$server[IUserSession::class]->getUser();
-        $topMenuApps = $this->config->getAppValueArray('top-menu-apps', '[]');
-        $hiddenApps = $this->config->getAppValueArray('big-menu-hidden-apps', '[]');
-        $isForced = $this->config->getAppValueBool('force', '0');
-        $userTopMenuApps = $this->config->getUserValueArray($user, 'top-menu-apps', '[]');
-        $apps = $this->appRepository->getOrderedApps($user);
-
-        if (!$isForced && !empty($userTopMenuApps)) {
-            $topMenuApps = $userTopMenuApps;
-        }
-
-        foreach ($apps as $app) {
-            $inTopMenuApps = in_array($app['id'], $topMenuApps);
-            $inHiddenApps = in_array($app['id'], $hiddenApps);
-
-            if (!$inTopMenuApps && $inHiddenApps) {
-                continue;
-            }
-
-            return $this->redirectToApp($app, true);
-        }
-
-        return $this->redirectToApp('files');
-    }
-
-    protected function redirectToApp($app, bool $isHref = false): RedirectResponse
-    {
-        if (!$isHref) {
-            $isIgnoreFrontController = true === OC::$server->getConfig()->getSystemValue(
-                'htaccess.IgnoreFrontController',
-                false
-            );
-
-            $isFrontControllerActive = 'true' === getenv('front_controller_active');
-
-            if ($isIgnoreFrontController || $isFrontControllerActive) {
-                $path = '/apps/%s/';
-            } else {
-                $path = '/index.php/apps/%s/';
-            }
-
-            $url = $this->urlGenerator->getAbsoluteURL(sprintf($path, $app));
-        } else {
-            $url = $app['href'];
-        }
-
-        return new RedirectResponse($url);
-    }
-}

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,7 +58,8 @@ class CssController extends Controller
         ConfigProxy $config,
         ThemingDefaults $theming,
         Color $color
-    ) {
+    )
+    {
         parent::__construct($appName, $request);
 
         $this->user = OC::$server[IUserSession::class]->getUser();
@@ -104,18 +105,16 @@ class CssController extends Controller
                 $topSideMenuApps = $userTopSideMenuApps;
             }
 
-            $isDarkThemeUserEnabled = 'dark' === $this->config->getUserValue($this->user, 'theme', '', 'accessibility');
+            $isDarkThemeUserEnabled = $this->config->getUserValue($this->user, 'theme', '', 'accessibility') === 'dark';
             $isBreezeDarkUserEnabled = $this->config->getUserValue($this->user, 'theme_enabled', '', 'breezedark');
 
-            $isBreezeDarkUserEnabled = '1' === $isBreezeDarkUserEnabled ||
-                ($isBreezeDarkGlobalEnabled && '' === $isBreezeDarkUserEnabled);
+            $isBreezeDarkUserEnabled = $isBreezeDarkUserEnabled === '1' || ($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);
@@ -126,33 +125,25 @@ 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');
 
-            $opacity = $this->config->getAppValueInt('dark-mode-background-color-opacity', '100');
-            $backgroundOpacity = dechex($opacity * 255 / 100);
+            $backgroundOpacity = dechex($this->config->getAppValueInt('dark-mode-background-color-opacity', '100') * 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');
 
-            $opacity = $this->config->getAppValueInt('background-color-opacity', '100');
-            $backgroundOpacity = dechex($opacity * 255 / 100);
+            $backgroundOpacity = dechex($this->config->getAppValueInt('background-color-opacity', '100') * 255 / 100);
         }
 
         $backgroundColor .= $backgroundOpacity;

lib/Controller/JsController.php

@@ -95,16 +95,15 @@ 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');
         $addLogoLink = $this->config->getAppValueBool('add-logo-link', '1');
-        $appsOrder = $this->config->getAppValueArray('apps-order', '[]');
         $avatar = null;
         $settings = null;
 
         if ($this->user) {
-            $userAppsOrder = $this->config->getUserValueArray($this->user, 'apps-order', '[]');
             $userTopMenuApps = $this->config->getUserValueArray($this->user, 'top-menu-apps', '[]');
             $userTopSideMenuApps = $this->config->getUserValueArray($this->user, 'top-side-menu-apps', '[]');
 
@@ -116,10 +115,6 @@ class JsController extends Controller
                 $topSideMenuApps = $userTopSideMenuApps;
             }
 
-            if (!empty($userAppsOrder) && !$isForced) {
-                $appsOrder = $userAppsOrder;
-            }
-
             $userTargetBlankMode = $this->config->getUserValueInt($this->user, 'target-blank-mode', '1');
             $userTargetBlankApps = $this->config->getUserValueArray($this->user, 'target-blank-apps', '[]');
 
@@ -167,14 +162,10 @@ class JsController extends Controller
             'side-with-categories' => $this->config->getAppValueBool('side-with-categories', '0'),
             'big-menu' => $this->config->getAppValueBool('big-menu', '0'),
             'big-menu-hidden-apps' => $this->config->getAppValueArray('big-menu-hidden-apps', '[]'),
-            'apps-order' => $appsOrder,
+            'apps-order' => $this->config->getAppValueArray('apps-order', '[]'),
             'avatar' => $avatar,
             'top-menu-apps' => $topMenuApps,
             'top-side-menu-apps' => $topSideMenuApps,
-            'top-menu-mouse-over-hidden-label' => $this->config->getAppValueInt(
-                'top-menu-mouse-over-hidden-label',
-                '0'
-            ),
             'target-blank-apps' => $targetBlankApps,
             'settings' => $settings,
             'logo' => $this->themingDefaults->getLogo(),

lib/Controller/NavController.php

@@ -93,13 +93,11 @@ class NavController extends Controller
             ]);
         }
 
-        $apps = $this->appRepository->getOrderedApps($user);
+        $apps = $this->appRepository->getOrderedApps();
         $categoriesLabels = $this->categoryRepository->getOrderedCategories();
         $hiddenApps = $this->config->getAppValueArray('big-menu-hidden-apps', '[]');
         $isForced = $this->config->getAppValueBool('force', '0');
         $topMenuApps = $this->config->getAppValueArray('top-menu-apps', '[]');
-        $topSideMenuApps = $this->config->getAppValueArray('top-side-menu-apps', '[]');
-        $userTopSideMenuApps = $this->config->getUserValueArray($user, 'top-side-menu-apps', '[]');
         $userTopMenuApps = $this->config->getUserValueArray($user, 'top-menu-apps', '[]');
         $appsCategories = [];
         $categoriesAppsCount = [];
@@ -108,16 +106,12 @@ class NavController extends Controller
             $topMenuApps = $userTopMenuApps;
         }
 
-        if (!$isForced && !empty($userTopSideMenuApps)) {
-            $topSideMenuApps = $userTopSideMenuApps;
-        }
-
         foreach ($apps as $app) {
-            $inTopMenuApps = in_array($app['id'], $topMenuApps);
-            $inTopSideMenuApps = in_array($app['id'], $topSideMenuApps);
-            $inHiddenApps = in_array($app['id'], $hiddenApps);
+            if (in_array($app['id'], $topMenuApps)) {
+                continue;
+            }
 
-            if (($inTopMenuApps && !$inTopSideMenuApps) || $inHiddenApps) {
+            if (in_array($app['id'], $hiddenApps)) {
                 continue;
             }
 

lib/Controller/PersonalSettingController.php

@@ -43,13 +43,8 @@ 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;
@@ -102,7 +97,7 @@ class PersonalSettingController extends Controller
             }
         }
 
-        if (in_array($name, ['top-menu-apps', 'top-side-menu-apps', 'apps-order'])) {
+        if (in_array($name, ['top-menu-apps', 'top-side-menu-apps'])) {
             $doSave = true;
             $data = json_decode($value, true);
 

lib/Service/AppRepository.php

@@ -2,7 +2,6 @@
 
 namespace OCA\SideMenu\Service;
 
-use OC\User\User;
 use OCP\L10N\IFactory;
 
 /**
@@ -111,19 +110,11 @@ class AppRepository
         );
     }
 
-    public function getOrderedApps(?User $user = null)
+    public function getOrderedApps()
     {
         $apps = $this->getVisibleApps();
         $orders = $this->config->getAppValueArray('apps-order', '[]');
 
-        if (null !== $user && !$this->config->getAppValueBool('force', '0')) {
-            $userOrders = $this->config->getUserValueArray($user, 'apps-order', '[]');
-
-            if (!empty($userOrders)) {
-                $orders = $userOrders;
-            }
-        }
-
         usort($apps, function ($a, $b) use ($orders) {
             $ak = array_keys($orders, $a['id'])[0] ?? null;
             $bk = array_keys($orders, $b['id'])[0] ?? null;

lib/Service/CategoryRepository.php

@@ -74,8 +74,7 @@ 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,24 +125,15 @@ 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-current-app-background-color' => $this->config->getAppValue(
-                'dark-mode-current-app-background-color',
-                $darkenPrimaryColor2
-            ),
+            'dark-mode-background-color-opacity' => $this->config->getAppValueInt('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'),
@@ -168,10 +159,6 @@ 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,13 +54,8 @@ 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;
@@ -86,9 +81,7 @@ class Personal implements ISettings
             'top-side-menu-apps' => $this->config->getUserValueArray($user, 'top-side-menu-apps', '[]'),
             'target-blank-mode' => $this->config->getUserValue($user, 'target-blank-mode', '1'),
             'target-blank-apps' => $this->config->getUserValueArray($user, 'target-blank-apps', '[]'),
-            'apps-order' => $this->config->getUserValueArray($user, 'apps-order', '[]'),
             'apps' => $this->appRepository->getVisibleApps(),
-            'ordered-apps' => $this->appRepository->getOrderedApps($user),
         ];
 
         return new TemplateResponse(Application::APP_ID, 'settings/personal-form', $parameters, '');

lib/Util/AssetUtil.php

@@ -0,0 +1,64 @@
+<?php
+
+namespace OCA\SideMenu\Util;
+
+use OC_Util;
+use OCA\SideMenu\AppInfo\Application;
+
+/**
+ * class AssetUtil.
+ *
+ * @author Simon Vieille <simon@deblan.fr>
+ */
+class AssetUtil
+{
+    protected array $entrypoints;
+    protected static ?AssetUtil $instance = null;
+
+    public function __construct()
+    {
+        $this->entrypoints = json_decode(
+            file_get_contents(__DIR__.'/../../assets/entrypoints.json'),
+            true
+        )['entrypoints'];
+    }
+
+    public static function getInstance(): self
+    {
+        if (null === self::$instance) {
+            self::$instance = new self();
+        }
+
+        return self::$instance;
+    }
+
+    public function addEntrypointAsset($entry, $type, $key): self
+    {
+        $file = basename($this->entrypoints[$entry][$type][$key]);
+        $path = $this->generatePath('assets', $file);
+
+        return $this->addAsset($type, $path);
+    }
+
+    public function addAsset($type, $path): self
+    {
+        $path = preg_replace('/\.(css|js)$/', '', $path);
+
+        if ('css' === $type) {
+            OC_Util::$styles[] = $path;
+        } elseif ('js' === $type) {
+            OC_Util::$scripts[] = $path;
+        }
+
+        return $this;
+    }
+
+    public function generatePath($directory, $file): string
+    {
+        return implode('/', [
+            Application::APP_ID,
+            $directory,
+            $file,
+        ]);
+    }
+}

package.json

@@ -2,9 +2,9 @@
 	"license": "agpl",
 	"private": true,
 	"scripts": {
-		"build": "NODE_ENV=production ./node_modules/.bin/webpack-cli --progress --config webpack.js",
-		"dev": "NODE_ENV=development ./node_modules/.bin/webpack-cli --progress --config webpack.js",
-		"watch": "NODE_ENV=development ./node_modules/.bin/webpack-cli --progress --watch --config webpack.js",
+		"build": "./node_modules/.bin/encore prod",
+		"dev": "./node_modules/.bin/encore dev",
+		"watch": "./node_modules/.bin/encore dev --watch",
 		"lint": "./node_modules/.bin/eslint --ext .js,.vue src",
 		"lint:fix": "./node_modules/.bin/eslint --ext .js,.vue src --fix",
 		"stylelint": "./node_modules/.bin/stylelint src",
@@ -12,7 +12,6 @@
 	},
 	"dependencies": {
 		"axios": "^0.24.0",
-		"trim": "^1.0.1",
 		"vue": "^2.6.11"
 	},
 	"browserslist": [
@@ -24,13 +23,16 @@
 	"devDependencies": {
 		"@babel/core": "^7.9.0",
 		"@babel/plugin-syntax-dynamic-import": "^7.8.3",
+		"@babel/plugin-transform-runtime": "^7.19.6",
 		"@babel/preset-env": "^7.9.0",
+		"@babel/runtime": "^7.20.0",
 		"@nextcloud/axios": "^1.8.0",
 		"@nextcloud/browserslist-config": "^1.0.0",
 		"@nextcloud/eslint-config": "^8.1.2",
 		"@nextcloud/initial-state": "^2.0.0",
 		"@nextcloud/l10n": "^1.6.0",
 		"@nextcloud/vue": "^7.0.0",
+		"@symfony/webpack-encore": "^4.1.1",
 		"babel-eslint": "^10.1.0",
 		"babel-loader": "^8.1.0",
 		"css-loader": "^3.4.2",
@@ -45,8 +47,8 @@
 		"eslint-plugin-vue": "^9.0.0",
 		"eslint-webpack-plugin": "^3.0.0",
 		"file-loader": "^6.0.0",
-		"sass": "^1.49.9",
-		"sass-loader": "^13.0.2",
+		"sass": "^1.55.0",
+		"sass-loader": "^13.1.0",
 		"stylelint": "^14.0.0",
 		"stylelint-config-recommended-scss": "^7.0.0",
 		"stylelint-scss": "^4.0.0",
@@ -55,7 +57,7 @@
 		"vue-loader": "^15",
 		"vue-style-loader": "^4.1.3",
 		"vue-template-compiler": "^2.7.13",
-		"webpack": "^5.0.0",
+		"webpack": "^5.74.0",
 		"webpack-cli": "^4.0.0",
 		"webpack-merge": "^4.2.2",
 		"webpack-node-externals": "^1.7.2"

src/AdminCategoriesCustom.vue

@@ -16,7 +16,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <div>
-    <ul class="side-menu-setting-list" :class="{hide: values.length === 0}">
+    <ul class="side-menu-setting-list">
       <li v-for="item in values" class="side-menu-setting-list-item" v-on:click="showEditForm(item)">
         <span v-text="item.en"></span>
       </li>
@@ -77,12 +77,6 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 }
 </style>
 
-<style scoped>
-.hide {
-  display: none;
-}
-</style>
-
 <script>
 import NcModal from '@nextcloud/vue/dist/Components/NcModal'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions'

src/AppMenu.vue

@@ -22,22 +22,17 @@
 
 <template>
   <nav class="app-menu show">
-    <ul
-      class="app-menu-main"
-      :class="{ 'app-menu-main__hidden-label': hiddenLabels === 1, 'app-menu-main__show-hovered': hiddenLabels === 2 }"
-      v-if="apps !== null"
-      >
+    <ul class="app-menu-main" 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 === 1, 'app-menu-main__show-hovered': hiddenLabels === 2 }"
+        :class="{ 'app-menu-entry__active': app.active }"
         :style="makeStyle(app)"
         >
         <a :href="app.href"
           :class="{ 'has-unread': app.unread > 0 }"
           :aria-label="appLabel(app)"
-          :target="targetBlankApps.indexOf(app.id) !== -1 ? '_blank' : undefined"
           :aria-current="app.active ? 'page' : false">
           <img :src="app.icon" alt="">
           <div class="app-menu-entry--label">
@@ -53,7 +48,6 @@
         :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 }">
@@ -81,8 +75,6 @@ export default {
       apps: null,
       appLimit: 0,
       observer: null,
-      targetBlankApps: [],
-      hiddenLabels: true
     }
   },
   mounted() {
@@ -101,8 +93,6 @@ export default {
       }
     })
 
-    this.targetBlankApps = window.targetBlankApps
-    this.hiddenLabels = window.topMenuAppsMouseOverHiddenLabel
     this.observer = new ResizeObserver(this.resize)
     this.observer.observe(this.$el)
     this.resize()
@@ -111,19 +101,13 @@ export default {
     this.observer.disconnect()
   },
   methods: {
-    appLabel(app) {
-      return app.name
+    appLabel() {
+      return (app) => app.name
         + (app.active ? ' (' + t('core', 'Currently open') + ')' : '')
         + (app.unread > 0 ? ' (' + n('core', '{count} notification', '{count} notifications', app.unread, { count: app.unread }) + ')' : '')
     },
     appList() {
-      let items = Object.values(this.apps)
-
-      items.sort((a, b) => {
-        return a.order < b.order ? -1 : 1;
-      })
-
-      return items
+      return Object.values(this.apps)
     },
     mainAppList() {
       return this.appList().slice(0, this.appLimit)
@@ -233,8 +217,8 @@ $header-icon-size: 20px;
       overflow: hidden;
     }
 
-    &: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 {
+    &:hover,
+    &:focus-within {
       opacity: 1;
       .app-menu-entry--label {
         opacity: 1;
@@ -245,6 +229,7 @@ $header-icon-size: 20px;
         overflow: visible;
       }
     }
+
   }
 
   // Show labels
@@ -253,28 +238,7 @@ $header-icon-size: 20px;
   .app-menu-entry:hover,
   .app-menu-entry:focus {
     opacity: 1;
-  }
 
-  &: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 {
-      margin-top: -6px;
-    }
-
-    .app-menu-entry--label {
-      opacity: 1;
-      bottom: 0;
-    }
-
-    &::before, .app-menu-entry::before {
-      opacity: 0;
-    }
-  }
-
-  &.app-menu-main__show-hovered .app-menu-entry:hover,
-  &.app-menu-main__show-hovered .app-menu-entry: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" :alt="label">
+        <img v-bind:src="avatar">
       </span>
     </a>
   </div>

src/SideMenu.vue

@@ -16,7 +16,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <div id="side-menu">
-    <div class="side-menu-header" v-if="settings || !openerHover || (!avatar && !alwaysDisplayed && logo) || avatar">
+    <div class="side-menu-header">
       <SettingsButton
         v-if="settings"
         v-bind:href="settings.href"
@@ -26,7 +26,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       <OpenerButton />
 
       <Logo
-        v-if="!avatar && !alwaysDisplayed && logo" v-bind:classes="{'side-menu-logo': true, 'avatardiv': false}"
+        v-if="!avatar && logo" v-bind:classes="{'side-menu-logo': true, 'avatardiv': false}"
         v-bind:image="logo"
         v-bind:link="logoLink"
       />
@@ -38,10 +38,9 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       />
     </div>
 
-    <ul class="side-menu-apps-list" :class="{'side-menu-apps-list--with-settings': !!settings}">
+    <ul class="side-menu-apps-list">
       <SideMenuApp
         v-for="(app, key) in apps"
-        v-if="!hiddenApps.includes(app.id)"
         v-bind:classes="{'side-menu-app': true, 'active': app.active}"
         v-bind:key="key"
         v-bind:icon="app.icon"
@@ -77,10 +76,7 @@ export default {
       avatar: null,
       forceLightIcon: false,
       targetBlankApps: [],
-      hiddenApps: [],
       settings: null,
-      openerHover: false,
-      alwaysDisplayed: false,
     }
   },
   methods: {
@@ -95,11 +91,7 @@ export default {
 
       for (let id in ncApps) {
         if (window.topMenuApps.includes(id) && !window.topSideMenuApps.includes(id)) {
-          continue
-        }
-
-        if (this.hiddenApps.includes(id)) {
-          continue
+          continue;
         }
 
         let app = ncApps[id]
@@ -110,10 +102,10 @@ export default {
 
       finalApps.sort((a, b) => {
         if (a.order === null || b.order === null) {
-          return a.name < b.name ? -1 : 1
+          return a.name < b.name ? -1 : 1;
         }
 
-        return a.order < b.order ? -1 : 1
+        return a.order < b.order ? -1 : 1;
       })
 
       this.apps = finalApps
@@ -124,25 +116,23 @@ export default {
     },
 
     retrieveConfig() {
+      axios
+        .get(OC.generateUrl('/apps/side_menu/js/config'))
+        .then((response) => {
+          const config = response.data
+
+          this.targetBlankApps = config['target-blank-apps']
+          this.forceLightIcon = config['force-light-icon']
+          this.avatar = config['avatar']
+          this.logo = config['logo']
+          this.logoLink = config['logo-link']
+          this.settings = config['settings']
+        })
     },
   },
   mounted() {
-    axios
-      .get(OC.generateUrl('/apps/side_menu/js/config'))
-      .then((response) => {
-        const config = response.data
-
-        this.targetBlankApps = config['target-blank-apps']
-        this.forceLightIcon = config['force-light-icon']
-        this.avatar = config['avatar']
-        this.logo = config['logo']
-        this.logoLink = config['logo-link']
-        this.settings = config['settings']
-        this.openerHover = config['opener-hover']
-        this.alwaysDisplayed = config['always-displayed']
-        this.hiddenApps = config['big-menu-hidden-apps']
-        this.retrieveApps()
-      })
+    this.retrieveConfig()
+    this.retrieveApps()
   }
 }
 </script>

src/admin.js

@@ -15,6 +15,8 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
+import 'regenerator-runtime/runtime'
+import './css/admin.scss'
 import AdminCategoriesCustom from './AdminCategoriesCustom.vue'
 import Vue from 'vue'
 

src/css/admin.scss

@@ -73,7 +73,7 @@
 
 .side-menu-setting-list {
   margin: 10px 4px 4px 0px;
-  border: 2px solid var(--color-border-dark);
+  border: 1px solid var(--color-border-dark);
   border-radius: 15px;
 }
 
@@ -137,10 +137,6 @@
   padding-right: 20px;
 }
 
-.side-menu-setting-label--top {
-  vertical-align: top;
-}
-
 .side-menu-setting-form {
   display: table-cell;
   min-width: 300px;
@@ -179,42 +175,3 @@
 .btn-reset--progress {
   transform: rotate(-359deg);
 }
-
-.badges {
-  margin-bottom: 14px;
-  margin-top: 4px;
-}
-
-.badge {
-  border-width: 1px;
-  padding: 2px 8px;
-  margin-right: 2px;
-  margin-bottom: 5px;
-  display: inline-block;
-  border-radius: 4px;
-  font-size: 13px;
-}
-
-.badge-1 {
-  background: #d4ce14;
-  border-color: #cad413;
-  color: #373a05;
-}
-
-.badge-2 {
-  background: #96d47f;
-  border-color: #7ed49b;
-  color: #333;
-}
-
-.badge-3 {
-  background: #d4540a;
-  border-color: #d4700c;
-  color: #fff;
-}
-
-.badge-4 {
-  background: #9d81d4;
-  border-color: #c681d4;
-  color: #fff;
-}

src/css/menu.scss

@@ -73,7 +73,7 @@
 }
 
 .side-menu-opener {
-  background: var(--side-menu-opener, url('../img/side-menu-opener.svg'));
+  background: var(--side-menu-opener, url('../../img/side-menu-opener.svg'));
   background-color: transparent !important;
   height: 40px !important;
   width: 40px !important;
@@ -90,7 +90,7 @@
 }
 
 .side-menu-closer {
-  background: url('../img/side-menu-opener-closer.svg');
+  background: url('../../img/side-menu-opener-closer.svg');
   display: none;
 }
 
@@ -113,7 +113,7 @@
   vertical-align: middle;
   margin-top: -4px;
   margin-right: 10px;
-  filter: invert(var(--side-menu-icon-invert-filter, 0%));
+  /*filter: invert(var(--side-menu-icon-invert-filter, 0%));*/
   opacity: var(--side-menu-icon-opacity, 1);
 }
 
@@ -198,7 +198,7 @@
 }
 
 .side-menu-categories {
-  max-height: calc(100vh - 55px);
+  max-height: calc(100vh - 5px);
   overflow: auto;
   position: relative;
   top: 5px;
@@ -235,12 +235,11 @@
 
 .side-menu-always-displayed body {
   width: calc(100% - 50px) !important;
-  position: absolute;
-  left: 50px;
 }
 
-.side-menu-always-displayed #header {
-  position: absolute !important;
+.side-menu-always-displayed body {
+  position: absolute;
+  left: 50px;
 }
 
 .side-menu-always-displayed #side-menu {
@@ -248,14 +247,9 @@
 }
 
 .side-menu-always-displayed .side-menu-apps-list {
-  height: 100vh;
-  top: 0;
-  overflow: hidden;
-}
-
-.side-menu-always-displayed .side-menu-apps-list--with-settings {
   height: calc(100vh - 49px);
   top: 49px;
+  overflow: hidden;
 }
 
 .side-menu-always-displayed .side-menu-apps-list:hover {

src/l10n/fixtures/cs.yaml

@@ -3,14 +3,21 @@
 "No": "Ne"
 "Yes": "Ano"
 "Menu": "Nabídka"
-? '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.'
-: 'Pro otevření/skrytí postranní nabídky použijte zkratku <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">O</span> („O“ jako otevřít). Pro pohyb po použijte klávesu <span class="keyboard-key">Tab</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.'
+: 'Pro otevření/skrytí postranní nabídky použijte zkratku <span class="keyboard-key">Ctrl</span>+<span
+  class="keyboard-key">O</span> („O“ jako otevřít). Pro pohyb po použijte klávesu
+  <span class="keyboard-key">Tab</span>.'
 "Top menu": "Horní nabídka"
-"Apps that not must be moved in the side menu": "Aplikace, které nepřesouvat do postranní nabídky"
-"If there is no selection then the global configuration is applied.": "Pokud neexistuje žádný výběr, je uplatněno globální nastavení."
+"Apps that not must be moved in the side menu": "Aplikace, které nepřesouvat do postranní\
+  \ nabídky"
+"If there is no selection then the global configuration is applied.": "Pokud neexistuje\
+  \ žádný výběr, je uplatněno globální nastavení."
 "Experimental": "Experimentální"
 "Save": "Uložit"
-"You like this app and you want to support me?": "Líbí se vám tato aplikace a chcete podpořit její vývoj?"
+"You like this app and you want to support me?": "Líbí se vám tato aplikace a chcete\
+  \ podpořit její vývoj?"
 "Buy me a coffee ☕": "Kupte mi kafe ☕"
 "Hidden": "Skryté"
 "Small": "Malé"
@@ -37,16 +44,25 @@
 "After the logo": "Za logem"
 "Position": "Pozice"
 "Show only the opener (hidden logo)": "Zobrazovat pouze otevírací tlačítko (logo skryto)"
-"Do not display the side menu and the opener if there is no application (eg: public pages).": "Nezobrazovat postranní nabídku a její otevírací tlačítko pokud nejsou dostupné žádné aplikace (např. na veřejných stránkách)."
+"Do not display the side menu and the opener if there is no application (eg: public pages).": "Nezobrazovat\
+  \ postranní nabídku a její otevírací tlačítko pokud nejsou dostupné žádné aplikace\
+  \ (např. na veřejných stránkách)."
 "Panel": "Panel"
-"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Otevřít nabídku při najetím ukazatelem na tlačítko nabídky (automaticky vypnuto pro dotykové obrazovky)"
+"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Otevřít\
+  \ nabídku při najetím ukazatelem na tlačítko nabídky (automaticky vypnuto pro dotykové\
+  \ obrazovky)"
 "Display the big menu": "Zobrazit velkou nabídku"
 "Display the logo": "Zobrazit logo"
+"This feature is not compatible with the <code>big menu</code> display.": "Tato funkce\
+  \ není kompatibilní se zobrazením <code>velké nabídky</code>."
 "Icons and texts": "Ikony a texty"
 "Loader enabled": "Načítání zapnuto"
 "Tips": "Tipy"
 "Always displayed": "Vždy zobrazeno"
-"This is the automatic behavior when the menu is always displayed.": "Toto je automatické chování, kdy je nabídka vždy zobrazena."
+"The logo will be hidden when the menu is always displayed.": "Pokud je nabídka zobrazena\
+  \ trvale, logo bude skryto."
+"This is the automatic behavior when the menu is always displayed.": "Toto je automatické\
+  \ chování, kdy je nabídka vždy zobrazena."
 "Not compatible with touch screens.": "Nekompatibilní s dotykovými obrazovkami."
 "Big menu": "Velká nabídka"
 "Live preview": "Živý náhled"
@@ -60,10 +76,13 @@
 "Export the configuration": "Exportovat nastavení"
 "Purge the cache": "Vyprázdnit mezipaměť"
 "Show the link to settings": "Zobrazit odkaz na nastavení"
-"The menu is enabled by default for users": "Nabídka je ve výchozím stavu pro uživatele zapnutá"
+"The menu is enabled by default for users": "Nabídka je ve výchozím stavu pro uživatele\
+  \ zapnutá"
 "Except when the configuration is forced.": "S výjimkou, kdy je nastavení vynuceno."
-"Apps that should not be displayed in the menu": "Aplikace, které by neměly být v nabídce zobrazeny"
-"This feature is only compatible with the <code>big menu</code> display.": "Tato funkce je kompatibilní pouze s <code>velkou nabídkou</code>."
+"Apps that should not be displayed in the menu": "Aplikace, které by neměly být v\
+  \ nabídce zobrazeny"
+"This feature is only compatible with the <code>big menu</code> display.": "Tato funkce\
+  \ je kompatibilní pouze s <code>velkou nabídkou</code>."
 "The logo is a link to the default app": "Logo je odkaz na výchozí aplikaci"
 "Others": "Ostatní"
 "Categories": "Kategorie"
@@ -72,11 +91,14 @@
 "Name": "Název"
 "Customed": "Přizpůsobeno"
 "Show and hide the list of categories": "Zobrazit/skrýt seznam kategorií"
-"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Tyto parametry jsou použity v případě, že je zapnutý (Breeze) tmavý motiv vzhledu."
+"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Tyto\
+  \ parametry jsou použity v případě, že je zapnutý (Breeze) tmavý motiv vzhledu."
 "Dark mode colors": "Barvy tmavého režimu"
 "With categories": "S kategoriemi"
 "Custom categories": "Vlastní kategorie"
 "Customize application categories": "Přizpůsobte kategorie aplikací"
+"Apps only visible in the top menu": "Aplikace jsou viditelné pouze v horní nabídce"
+"Apps visible in the top and side menus": "Aplikace viditelné v horní a boční nabídce"
 "Reset to default": "Vrátit zpět na výchozí hodnoty"
 "Hidden icon": "Skrytá ikona"
 "Small icon": "Malá ikona"
@@ -86,9 +108,4 @@
 "Small text": "Malý text"
 "Normal text": "Normální text"
 "Big text": "Velký text"
-"Applications": "Aplikace"
-"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"
-"Except the hovered app": "Except the hovered app"
+"Applications": "Applications"

src/l10n/fixtures/de.yaml

@@ -3,14 +3,21 @@
 "No": "Nein"
 "Yes": "Ja"
 "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.'
-: '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.'
+? '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.'
+: '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ü verschoben werden sollen"
-"If there is no selection then the global configuration is applied.": "Wenn keine Auswahl vorhanden ist, wird die globale Konfiguration angewendet."
+"Apps that not must be moved in the side menu": "Anwendungen, die nicht ins Seitenmenü\
+  \ verschoben werden sollen"
+"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 mich unterstützen?"
+"You like this app and you want to support me?": "Du magst diese Anwendung und möchtest\
+  \ mich unterstützen?"
 "Buy me a coffee ☕": "Gib mir einen Kaffee aus ☕"
 "Hidden": "Ausblenden"
 "Small": "Klein"
@@ -37,16 +44,25 @@
 "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 das Seitenmenü und das Menü-Symbol nicht an, wenn keine Anwendung vorhanden ist (z.B. bei öffentlichen Seiten)."
+"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)."
 "Panel": "Panel"
-"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)"
+"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)"
 "Display the big menu": "Großes Menü anzeigen"
 "Display the logo": "Logo anzeigen"
+"This feature is not compatible with the <code>big menu</code> display.": "Diese Funktion\
+  \ ist nicht mit dem <code>großen Menü</code> kompatibel."
 "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 automatische Verhalten, wenn das Menü immer angezeigt wird."
+"The logo will be hidden when the menu is always displayed.": "Das Logo wird ausgeblendet,\
+  \ wenn das Menü immer angezeigt wird."
+"This is the automatic behavior when the menu is always displayed.": "Dies ist das\
+  \ 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"
@@ -55,15 +71,20 @@
 "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, die Einstellungen dieser Anwendung zu ändern."
+"You do not have permission to change the settings.": "Du hast keine Berechtigung,\
+  \ 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 aktiviert"
-"Except when the configuration is forced.": "Gilt nicht, wenn die Konfiguration erzwungen wird."
-"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 menu is enabled by default for users": "Das Menü ist standardmäßig für alle Benutzer\
+  \ aktiviert"
+"Except when the configuration is forced.": "Gilt nicht, wenn die Konfiguration erzwungen\
+  \ wird."
+"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"
@@ -72,11 +93,15 @@
 "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 Optionen werden auf <code>Dark Theme</code> oder <code>Breeze Dark Theme</code> angewendet."
+"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."
 "Dark mode colors": "Farben für den dunklen Modus"
 "With categories": "Mit Kategorien"
 "Custom categories": "Benutzerdefinierte Kategorien"
 "Customize application categories": "Anwendungskategorien anpassen"
+"Apps only visible in the top menu": "Apps nur im oberen Menü sichtbar"
+"Apps visible in the top and side menus": "Apps im oberen und seitlichen Menü sichtbar"
 "Reset to default": "Auf Standard zurücksetzen"
 "Hidden icon": "Verstecktes Symbol"
 "Small icon": "Kleines Symbol"
@@ -86,9 +111,4 @@
 "Small text": "Kleiner Text"
 "Normal text": "Normaler Text"
 "Big text": "Großer Text"
-"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 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"
+"Applications": "Applications"

src/l10n/fixtures/es.yaml

@@ -1,94 +0,0 @@
-"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"
-"Except the hovered app": "Except the hovered app"

src/l10n/fixtures/fr.yaml

@@ -3,14 +3,21 @@
 "No": "Non"
 "Yes": "Oui"
 "Menu": "Menu"
-? '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.'
-: 'Utiliser le raccourcis clavier <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span> pour ouvrir et fermer le menu latéral. Utiliser <span class="keyboard-key">tab</span> pour naviguer.'
+? '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.'
+: 'Utiliser le raccourcis clavier <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span>
+  pour ouvrir et fermer le menu latéral. Utiliser <span class="keyboard-key">tab</span>
+  pour naviguer.'
 "Top menu": "Menu supérieur"
-"Apps that not must be moved in the side menu": "Les applications qui ne doivent pas être affichées dans le menu latéral"
-"If there is no selection then the global configuration is applied.": "Si il n'y a aucune sélection alors la configuration globale sera appliquée."
+"Apps that not must be moved in the side menu": "Les applications qui ne doivent pas\
+  \ être affichées dans le menu latéral"
+"If there is no selection then the global configuration is applied.": "Si il n'y a\
+  \ aucune sélection alors la configuration globale sera appliquée."
 "Experimental": "Expérimental"
 "Save": "Sauvegarder"
-"You like this app and you want to support me?": "Vous aimer cette application et vous souhaitez m'aider ?"
+"You like this app and you want to support me?": "Vous aimer cette application et\
+  \ vous souhaitez m'aider ?"
 "Buy me a coffee ☕": "Offrez moi un café ☕"
 "Hidden": "Caché"
 "Small": "Petit"
@@ -44,17 +51,26 @@
 "Before the logo": "Avant le logo"
 "After the logo": "Après le logo"
 "Position": "Position"
-"Show only the opener (hidden logo)": "Afficher uniquement le bouton d'ouverture (masquer le logo)"
-"Do not display the side menu and the opener if there is no application (eg: public pages).": "Ne pas afficher le menu latéral et le bouton d'ouverture s'il n'y a aucune application (exemple : page publiques)."
+"Show only the opener (hidden logo)": "Afficher uniquement le bouton d'ouverture (masquer\
+  \ le logo)"
+"Do not display the side menu and the opener if there is no application (eg: public pages).": "Ne\
+  \ pas afficher le menu latéral et le bouton d'ouverture s'il n'y a aucune application\
+  \ (exemple : page publiques)."
 "Panel": "Panneau"
-"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Ouvrir le menu au passage de la souris (automatiquement désactivé sur les écrans tactiles)"
+"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Ouvrir\
+  \ le menu au passage de la souris (automatiquement désactivé sur les écrans tactiles)"
 "Display the big menu": "Afficher le menu large"
 "Display the logo": "Afficher le logo"
+"This feature is not compatible with the <code>big menu</code> display.": "Cette fonctionnalité\
+  \ n'est pas compatible avec l'affichage <code>Menu large</code>."
 "Icons and texts": "Icônes et textes"
 "Loader enabled": "Activation de l'indicateur de chargement"
 "Tips": "Astuces"
 "Always displayed": "Toujours affiché"
-"This is the automatic behavior when the menu is always displayed.": "C'est le comportement automatique lorsque le menu est toujours affiché."
+"The logo will be hidden when the menu is always displayed.": "Le logo sera masque\
+  \ si le menu est toujours affiché."
+"This is the automatic behavior when the menu is always displayed.": "C'est le comportement\
+  \ automatique lorsque le menu est toujours affiché."
 "Not compatible with touch screens.": "Incompatible avec les écrans tactiles."
 "Big menu": "Menu large"
 "Live preview": "Aperçu en direct"
@@ -63,16 +79,21 @@
 "Use my selection": "Utiliser ma sélection"
 "Show and hide the list of applications": "Afficher et masquer la liste des applications"
 "Use the avatar instead of the logo": "Utiliser l'avatar à la place du logo"
-"You do not have permission to change the settings.": "Vous n'avez pas la permission de changer les paramètres."
+"You do not have permission to change the settings.": "Vous n'avez pas la permission\
+  \ de changer les paramètres."
 "Force this configuration to users": "Forcer cette configuration aux utilisateurs"
 "Export the configuration": "Exporter la configuration"
 "Purge the cache": "Purger le cache"
 "Show the link to settings": "Afficher le lien vers les paramètres"
-"The menu is enabled by default for users": "Le menu est activé par défaut pour les utilisateurs"
+"The menu is enabled by default for users": "Le menu est activé par défaut pour les\
+  \ utilisateurs"
 "Except when the configuration is forced.": "Sauf lorsque la configuration est forcée."
-"Apps that should not be displayed in the menu": "Applications qui ne doivent pas être affichées dans le menu"
-"This feature is only compatible with the <code>big menu</code> display.": "Compatible avec l'affichage <code>Menu large</code>."
-"The logo is a link to the default app": "Le logo est un lien vers l'application par défaut"
+"Apps that should not be displayed in the menu": "Applications qui ne doivent pas\
+  \ être affichées dans le menu"
+"This feature is only compatible with the <code>big menu</code> display.": "Compatible\
+  \ avec l'affichage <code>Menu large</code>."
+"The logo is a link to the default app": "Le logo est un lien vers l'application par\
+  \ défaut"
 "Others": "Autres"
 "Categories": "Catégories"
 "Customize sorting": "Personnaliser le tri"
@@ -80,15 +101,16 @@
 "Name": "Nom"
 "Customed": "Personnalisé"
 "Show and hide the list of categories": "Afficher et masquer la liste des catégories"
-"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Ces paramètres sont utilisés lorsque le thème sombre ou le thème Breeze Dark sont activés."
+"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Ces\
+  \ paramètres sont utilisés lorsque le thème sombre ou le thème Breeze Dark sont\
+  \ activés."
 "Dark mode colors": "Couleurs du mode sombre"
 "With categories": "Avec les catégories"
 "Custom categories": "Catégories personnalisées"
 "Customize application categories": "Personnaliser les catégories des applications"
+"Apps only visible in the top menu": "Applications visibles uniquement dans le menu\
+  \ supérieur"
+"Apps visible in the top and side menus": "Applications visibles dans le menus supérieur\
+  \ et latéral"
 "Reset to default": "Restaurer les valeurs par défaut"
 "Applications": "Applications"
-"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"
-"Except the hovered app": "À l'exception de l'application survolée"

src/l10n/fixtures/nl.yaml

@@ -1,94 +0,0 @@
-"Custom menu": "Aangepast menu"
-"Enable the custom menu": "Het aangepaste menu inschakelen"
-"No": "Nee"
-"Yes": "Ja"
-"Menu": "Menu"
-? '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.'
-: 'Gebruik de snelkoppeling <span class="keyboard-key">Ctrl</span>+<span class="keyboard-key">o</span> om het zijmenu te openen en te verbergen. Gebruik <span class="keyboard-key">tab</span> om te navigeren.'
-"Top menu": "Bovenste menu"
-"Apps that not must be moved in the side menu": "Apps die niet moeten worden verplaatst in het zijmenu"
-"If there is no selection then the global configuration is applied.": "Als er geen keuze is, wordt de globale configuratie toegepast."
-"Experimental": "Experimenteel"
-"Save": "Opslaan"
-"You like this app and you want to support me?": "Vind je deze app leuk en wil je me steunen?"
-"Buy me a coffee ☕": "Koop een koffie voor me ☕"
-"Hidden": "Verborgen"
-"Small": "Klein"
-"Normal": "Normaal"
-"Big": "Groot"
-"Hidden icon": "Verborgen icoon"
-"Small icon": "Klein icoon"
-"Normal icon": "Normaal icoon"
-"Big icon": "Groot icoon"
-"Hidden text": "Verborgen tekst"
-"Small text": "Kleine tekst"
-"Normal text": "Normale tekst"
-"Big text": "Grote tekst"
-"Colors": "Kleuren"
-"Background color": "Achtergrond kleur"
-"Background color of current app": "Achtergrondkleur van huidige app"
-"Text color": "Tekst kleur"
-"Loader": "Lader"
-"Icon": "Icoon"
-"Same color": "Zelfde kleur"
-"Opposite color": "Tegenovergestelde kleur"
-"Transparent": "Transparant"
-"Opaque": "Ondoorzichtig"
-"Opener": "Opener"
-"Default": "Standaard"
-"Default (dark)": "Standaard (donker)"
-"Hamburger": "Hamburger"
-"Hamburger (dark)": "Hamburger (donker)"
-"Hamburger 2": "Hamburger 2"
-"Hamburger 2 (dark)": "Hamburger 2 (donker)"
-"Before the logo": "Voor het logo"
-"After the logo": "Na het logo"
-"Position": "Positie"
-"Show only the opener (hidden logo)": "Toon alleen de opener (verborgen logo)"
-"Do not display the side menu and the opener if there is no application (eg: public pages).": "Geef het zijmenu en de opener niet weer als er geen toepassing is (bijv. openbare pagina's)."
-"Panel": "Paneel"
-"Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "Open het menu wanneer de muis over de opener gaat (automatisch uitgeschakeld op aanraakschermen)"
-"Display the big menu": "Toon het grote menu"
-"Display the logo": "Toon het logo"
-"Icons and texts": "Iconen en teksten"
-"Loader enabled": "Lader ingeschakeld"
-"Tips": "Tips"
-"Always displayed": "Altijd weergegeven"
-"This is the automatic behavior when the menu is always displayed.": "Dit is het automatische gedrag wanneer het menu altijd wordt weergegeven."
-"Not compatible with touch screens.": "Niet compatibel met aanraakschermen."
-"Big menu": "Groot menu"
-"Live preview": "Live voorbeeld"
-"Open apps in new tab": "Open apps in nieuwe tab"
-"Use the global setting": "Gebruik de globale instellingen"
-"Use my selection": "Gebruik mijn selectie"
-"Show and hide the list of applications": "De lijst met toepassingen tonen en verbergen"
-"Use the avatar instead of the logo": "Gebruik avatar in plaats van het logo"
-"You do not have permission to change the settings.": "Je hebt geen toestemming om de instellingen te veranderen."
-"Force this configuration to users": "Forceer deze configuratie aan gebruikers"
-"Export the configuration": "Exporteer de configuratie"
-"Purge the cache": "De cache wissen"
-"Show the link to settings": "Toon de link naar de instellingen"
-"The menu is enabled by default for users": "Het menu is standaard ingeschakeld voor gebruikers"
-"Except when the configuration is forced.": "Behalve als de configuratie geforceerd is."
-"Apps that should not be displayed in the menu": "Apps die niet in het menu weergegeven mogen worden"
-"This feature is only compatible with the <code>big menu</code> display.": "Deze functie is alleen compatibel met het <code>grote menu</code> scherm."
-"The logo is a link to the default app": "Het logo is een link naar de standaard app"
-"Others": "Overige"
-"Categories": "Categorieën"
-"Customize sorting": "Sortering aanpassen"
-"Order by": "Sorteer op"
-"Name": "Naam"
-"Customed": "Aangepast"
-"Show and hide the list of categories": "De lijst met categorieën tonen en verbergen"
-"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Deze parameters worden gebruikt wanneer Dark theme of Breeze Dark Theme zijn ingeschakeld."
-"Dark mode colors": "Donkere modus kleuren"
-"With categories": "Met categorieën"
-"Custom categories": "Aangepaste categorieën"
-"Customize application categories": "Toepassingscategorieën aanpassen"
-"Reset to default": "Terugzetten naar standaard"
-"Applications": "Applicaties"
-"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"
-"Except the hovered app": "Except the hovered app"

src/l10n/fixtures/ru.yaml

@@ -1,94 +0,0 @@
-"Custom menu": "Custom menu"
-"Enable the custom menu": "Включить пользовательское меню"
-"No": "Нет"
-"Yes": "Да"
-"Menu": "Меню"
-? '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.'
-: 'Используйте сочетание клавиш <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.": "Если тут ничего не отмечено, применяются глобальные настройки."
-"Experimental": "Экспериментальный"
-"Save": "Сохранить"
-"You like this app and you want to support me?": "Вам нравится приложение или вы хотите поддержать меня?"
-"Buy me a coffee ☕": "Купить мне чашку кофе ☕"
-"Hidden": "Скрыто"
-"Small": "Маленький"
-"Normal": "Средний"
-"Big": "Большой"
-"Hidden icon": "Без иконки"
-"Small icon": "Маленькая иконка"
-"Normal icon": "Средняя иконка"
-"Big icon": "Большая иконка"
-"Hidden text": "Без текста"
-"Small text": "Маленький текст"
-"Normal text": "Средний текст"
-"Big text": "Большой текст"
-"Colors": "Цвета"
-"Background color": "Цвет фона"
-"Background color of current app": "Цвет фона выбранного приложения"
-"Text color": "Цвет текста"
-"Loader": "Загрузчик"
-"Icon": "Иконка"
-"Same color": "Такой же цвет"
-"Opposite color": "Противоположный цвет"
-"Transparent": "Прозрачный"
-"Opaque": "Непрозрачный"
-"Opener": "Открывалка"
-"Default": "По умолчанию"
-"Default (dark)": "По умолчанию (тёмный)"
-"Hamburger": "Гамбургер"
-"Hamburger (dark)": "Гамбургер (тёмный)"
-"Hamburger 2": "Гамбургер 2"
-"Hamburger 2 (dark)": "Гамбургер 2 (тёмный)"
-"Before the logo": "Перед логотипом"
-"After the logo": "После логотипа"
-"Position": "Положение"
-"Show only the opener (hidden logo)": "Показать только открывающую часть (скрытый логотип)"
-"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)": "Открывать меню при наведении мыши на экран (автоматически отключается на сенсорных экранах)"
-"Display the big menu": "Отобразить большое меню"
-"Display the logo": "Показать логотип"
-"Icons and texts": "Иконки и текст"
-"Loader enabled": "Загрузчик включен"
-"Tips": "Советы"
-"Always displayed": "Всегда отображается"
-"This is the automatic behavior when the menu is always displayed.": "This is the automatic behavior when the menu is always displayed."
-"Not compatible with touch screens.": "Не совместимо с сенсорными экранами."
-"Big menu": "Большое меню"
-"Live preview": "Live preview"
-"Open apps in new tab": "Открывать приложения в новой вкладке"
-"Use the global setting": "Использовать глобальные настройки"
-"Use my selection": "Использовать мои настройки"
-"Show and hide the list of applications": "Показать или скрыть список приложений"
-"Use the avatar instead of the logo": "Использовать аватар вместо логотипа"
-"You do not have permission to change the settings.": "У вас нет разрешения изменять настройки."
-"Force this configuration to users": "Force this configuration to users"
-"Export the configuration": "Экспортировать конфигурацию"
-"Purge the cache": "Очистить кэш"
-"Show the link to settings": "Показать ссылку на настройки"
-"The menu is enabled by default for users": "Это меню включено по умолчанию для пользователей"
-"Except when the configuration is forced.": "Except when the configuration is forced."
-"Apps that should not be displayed in the menu": "Ппрограммы, скрытые из меню"
-"This feature is only compatible with the <code>big menu</code> display.": "This feature is only compatible with the <code>big menu</code> display."
-"The logo is a link to the default app": "Логотип открывает приложение по умолчанию"
-"Others": "Прочие"
-"Categories": "Категории"
-"Customize sorting": "Настроить сортировку"
-"Order by": "В порядке"
-"Name": "Название"
-"Customed": "Customed"
-"Show and hide the list of categories": "Показать или скрыть список категорий"
-"This parameters are used when Dark theme or Breeze Dark Theme are enabled.": "Эти настройки используются темами Тёмная и Тёмная Breeze."
-"Dark mode colors": "Цвета тёмной темы"
-"With categories": "С категориями"
-"Custom categories": "Пользовательские категории"
-"Customize application categories": "Изменить категории приложений"
-"Reset to default": "Сбросить к значениям по умолчанию"
-"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 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"

src/l10n/fixtures/tpl/base.yaml

@@ -52,10 +52,12 @@
 "Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": ""
 "Display the big menu": ""
 "Display the logo": ""
+"This feature is not compatible with the <code>big menu</code> display.": ""
 "Icons and texts": ""
 "Loader enabled": ""
 "Tips": ""
 "Always displayed": ""
+"The logo will be hidden when the menu is always displayed.": ""
 "This is the automatic behavior when the menu is always displayed.": ""
 "Not compatible with touch screens.": ""
 "Big menu": ""
@@ -87,10 +89,7 @@
 "With categories": ""
 "Custom categories": ""
 "Customize application categories": ""
+"Apps only visible in the top menu": ""
+"Apps visible in the top and side menus": ""
 "Reset to default": ""
 "Applications": ""
-"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": ""
-"Except the hovered app": ""

src/l10n/fixtures/zh_CN.yaml

@@ -3,8 +3,7 @@
 "No": "取消"
 "Yes": "确定"
 "Menu": "菜单"
-? "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."
-: "使用快捷键 <span class=\"keyboard-key\">Ctrl</span>+<span class=\"keyboard-key\">o</span> 打开或隐藏侧边栏菜单。使用<span class=\"keyboard-key\">tab</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.": "使用快捷键 <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.": "如不选择，将应用全局设定。"
@@ -42,10 +41,12 @@
 "Open the menu when the mouse is hover the opener (automatically disabled on touch screens)": "鼠标悬停时打开菜单 (触摸屏时将自动禁用)"
 "Display the big menu": "显示大型菜单"
 "Display the logo": "显示logo"
+"This feature is not compatible with the <code>big menu<\/code> display.": "此功能与显示<code>大型菜单<\/code>不兼容。"
 "Icons and texts": "图标与文字"
 "Loader enabled": "菜单指示器已激活"
 "Tips": "技巧"
 "Always displayed": "一直显示"
+"The logo will be hidden when the menu is always displayed.": "一直显示菜单时logo将被隐藏。"
 "This is the automatic behavior when the menu is always displayed.": "一直显示菜单时的自动动作。"
 "Not compatible with touch screens.": "与触屏不兼容。"
 "Big menu": "大型菜单"
@@ -63,7 +64,7 @@
 "The menu is enabled by default for users": "用户的默认菜单已激活"
 "Except when the configuration is forced.": "除非设置被强制使用。"
 "Apps that should not be displayed in the menu": "禁止在菜单中显示的应用"
-"This feature is only compatible with the <code>big menu</code> display.": "此功能只和<code>大型菜单</code>兼容。"
+"This feature is only compatible with the <code>big menu<\/code> display.": "此功能只和<code>大型菜单<\/code>兼容。"
 "The logo is a link to the default app": "logo链接到默认应用"
 "Others": "其他"
 "Categories": "类别"
@@ -77,6 +78,8 @@
 "With categories": "有类别"
 "Custom categories": "自定义类别"
 "Customize application categories": "自定义应用程序类别"
+"Apps only visible in the top menu": "应用程序仅在顶部菜单中可见"
+"Apps visible in the top and side menus": "顶部和侧边菜单中可见的应用程序"
 "Reset to default": "重置为默认设置"
 "Hidden icon": "隐藏图标"
 "Small icon": "小图标"
@@ -87,8 +90,3 @@
 "Normal text": "普通文本"
 "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 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"

src/menu.js

@@ -15,6 +15,8 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  */
 
+import 'regenerator-runtime/runtime'
+import './css/menu.scss'
 import Vue from 'vue'
 import AppMenu from './AppMenu.vue'
 import SideMenu from './SideMenu.vue'
@@ -23,11 +25,15 @@ import SideMenuWithCategories from './SideMenuWithCategories.vue'
 import PageLoader from './PageLoader'
 import SMcreateElement from './lib/createElement'
 
-Vue.prototype.OC = OC
-Vue.prototype.t = OC.L10N.translate
+setInterval(() => {
+  console.log(window.OC)
+}, 100)
 
-window.SMcreateElement = SMcreateElement
-window.PageLoader = PageLoader
+// Vue.prototype.OC = window.OC
+// Vue.prototype.t = OC.L10N.translate
+//
+// window.SMcreateElement = SMcreateElement
+// window.PageLoader = PageLoader
 
 const mountSideMenuComponent = () => {
   const container = document.querySelector('#side-menu')

templates/js/script.php

@@ -22,12 +22,11 @@ if ($_['always-displayed']) {
   const nextcloud = document.querySelector('#nextcloud')
 
   const isTouchDevice = window.matchMedia("(pointer: coarse)").matches
+  const targetBlankApps = <?php echo json_encode($_['target-blank-apps']) ?>
 
-  window.targetBlankApps = <?php echo json_encode($_['target-blank-apps']), "\n" ?>
   window.topMenuApps = <?php echo json_encode($_['top-menu-apps']), "\n"; ?>
-  window.topSideMenuApps = <?php echo json_encode($_['top-side-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')
@@ -73,10 +72,6 @@ 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)
 
@@ -178,11 +173,9 @@ if ($_['always-displayed']) {
     PageLoader()
   <?php endif; ?>
 
-  if (nextcloud) {
-    <?php if ($_['opener-position'] === 'before'): ?>
-      nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud)
-    <?php else: ?>
-      nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud.nextSibling)
-    <?php endif; ?>
-  }
+  <?php if ($_['opener-position'] === 'before'): ?>
+    nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud)
+  <?php else: ?>
+    nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud.nextSibling)
+  <?php endif; ?>
 })();

templates/settings/admin-form.php

@@ -41,108 +41,8 @@ $choicesSizes = [
 
 $labelShowHideApps = 'Show and hide the list of applications';
 $labelReset = 'Reset to default';
-$labelDefault = 'Default';
-$labelWithCategories = 'With categories';
-$labelBigMenu = 'Big menu';
-$labelAlwaysDisplayed = 'Always displayed';
-
 ?>
 <div id="side-menu-section">
-
-    <div class="section">
-        <h2>
-            <?php p($l->t('Panel')); ?>
-        </h2>
-
-        <?php
-            $displays = [
-                'default' => !$_['always-displayed'] && !$_['big-menu'] && !$_['side-with-categories'],
-                'always-displayed' => $_['always-displayed'] && !$_['big-menu'] && !$_['side-with-categories'],
-                'side-with-categories' => $_['side-with-categories'] && !$_['always-displayed'] && !$_['big-menu'],
-                'big-menu' => $_['big-menu'] && !$_['always-displayed'] && !$_['side-with-categories'],
-            ];
-        ?>
-
-        <div>
-            <label>
-                <?php p($l->t($labelDefault)); ?>
-            </label>
-        </div>
-        <p>
-            <img
-                class="side-menu-display <?php echo $displays['default'] ? 'is-active' : '' ?>"
-                data-alwaysdiplayed="0"
-                data-bigmenu="0"
-                data-sidewithcategories="0"
-                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-default.svg')); ?>" alt="<?php p($l->t($labelDefault)); ?>">
-        </p>
-
-        <div>
-            <label>
-                <?php p($l->t($labelWithCategories)); ?>
-            </label>
-        </div>
-        <p>
-            <img
-                class="side-menu-display <?php echo $displays['side-with-categories'] ? 'is-active' : '' ?>"
-                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($labelWithCategories)); ?>">
-        </p>
-
-        <div>
-            <label for="side-menu-opener">
-                <?php p($l->t($labelBigMenu)); ?>
-            </label>
-        </div>
-        <p>
-            <img
-                class="side-menu-display <?php echo $displays['big-menu'] ? 'is-active' : '' ?>"
-                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($labelBigMenu)); ?>">
-        </p>
-
-        <div>
-            <label for="side-menu-opener">
-                <?php p($l->t($labelAlwaysDisplayed)); ?>
-            </label>
-        </div>
-        <p><em><?php p($l->t('Not compatible with touch screens.')); ?></em></p>
-        <p>
-            <img
-                class="side-menu-display <?php echo $displays['always-displayed'] ? 'is-active' : '' ?>"
-                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($labelAlwaysDisplayed)); ?>">
-        </p>
-
-        <input
-            type="hidden"
-            class="side-menu-setting"
-            name="always-displayed"
-            id="side-menu-always-displayed"
-            value="<?php echo (int) $_['always-displayed'] ?>"
-        >
-        <input
-            type="hidden"
-            class="side-menu-setting"
-            name="big-menu"
-            id="side-menu-big-menu"
-            value="<?php echo (int) $_['big-menu'] ?>"
-        >
-        <input
-            type="hidden"
-            class="side-menu-setting"
-            name="side-with-categories"
-            id="side-menu-side-with-categories"
-            value="<?php echo (int) $_['side-with-categories'] ?>"
-        >
-    </div>
-
     <div class="section">
         <h2>
             <?php p($l->t('Colors')); ?>
@@ -150,13 +50,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <small><span class="info"><?php p($l->t('Live preview')); ?></span></small>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-        </div>
-
         <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label side-menu-setting-label-short">
@@ -313,7 +206,7 @@ $labelAlwaysDisplayed = 'Always displayed';
         <div class="side-menu-setting-table">
             <?php
                 $choices = [
-                    $labelDefault => 'side-menu-opener',
+                    'Default' => 'side-menu-opener',
                     'Default (dark)' => 'side-menu-opener-dark',
                     'Hamburger' => 'side-menu-opener-hamburger',
                     'Hamburger (dark)' => 'side-menu-opener-hamburger-dark',
@@ -341,13 +234,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <?php p($l->t('Dark mode colors')); ?>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-        </div>
-
         <p>
             <?php echo $l->t('This parameters are used when Dark theme or Breeze Dark Theme are enabled.'); ?>
         </p>
@@ -506,7 +392,7 @@ $labelAlwaysDisplayed = 'Always displayed';
         <div class="side-menu-setting-table">
             <?php
                 $choices = [
-                    $labelDefault => 'side-menu-opener',
+                    'Default' => 'side-menu-opener',
                     'Default (dark)' => 'side-menu-opener-dark',
                     'Hamburger' => 'side-menu-opener-hamburger',
                     'Hamburger (dark)' => 'side-menu-opener-hamburger-dark',
@@ -536,13 +422,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <?php p($l->t('Opener')); ?>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-        </div>
-
         <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <?php
@@ -594,7 +473,105 @@ $labelAlwaysDisplayed = 'Always displayed';
                     </select>
                 </div>
             </div>
+        </div>
+    </div>
 
+    <div class="section">
+        <h2>
+            <?php p($l->t('Panel')); ?>
+        </h2>
+
+        <?php
+            $displays = [
+                'default' => !$_['always-displayed'] && !$_['big-menu'] && !$_['side-with-categories'],
+                'always-displayed' => $_['always-displayed'] && !$_['big-menu'] && !$_['side-with-categories'],
+                'side-with-categories' => $_['side-with-categories'] && !$_['always-displayed'] && !$_['big-menu'],
+                'big-menu' => $_['big-menu'] && !$_['always-displayed'] && !$_['side-with-categories'],
+            ];
+        ?>
+
+        <div>
+            <label>
+                <?php p($l->t('Default')); ?>
+            </label>
+        </div>
+        <p>
+            <img
+                class="side-menu-display <?php echo $displays['default'] ? 'is-active' : '' ?>"
+                data-alwaysdiplayed="0"
+                data-bigmenu="0"
+                data-sidewithcategories="0"
+                src="<?php print_unescaped(image_path('side_menu', 'admin/layout-default.svg')); ?>" alt="<?php p($l->t('Default')); ?>">
+        </p>
+
+        <div>
+            <label>
+                <?php p($l->t('With categories')); ?>
+            </label>
+        </div>
+        <p>
+            <img
+                class="side-menu-display <?php echo $displays['side-with-categories'] ? 'is-active' : '' ?>"
+                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')); ?>">
+        </p>
+
+        <div>
+            <label for="side-menu-opener">
+                <?php p($l->t('Big menu')); ?>
+            </label>
+        </div>
+        <p>
+            <img
+                class="side-menu-display <?php echo $displays['big-menu'] ? 'is-active' : '' ?>"
+                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')); ?>">
+        </p>
+
+        <div>
+            <label for="side-menu-opener">
+                <?php p($l->t('Always displayed')); ?>
+            </label>
+        </div>
+        <p><em><?php p($l->t('Not compatible with touch screens.')); ?></em></p>
+        <p>
+            <img
+                class="side-menu-display <?php echo $displays['always-displayed'] ? 'is-active' : '' ?>"
+                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')); ?>">
+        </p>
+
+        <input
+            type="hidden"
+            class="side-menu-setting"
+            name="always-displayed"
+            id="side-menu-always-displayed"
+            value="<?php echo (int) $_['always-displayed'] ?>"
+        >
+        <input
+            type="hidden"
+            class="side-menu-setting"
+            name="big-menu"
+            id="side-menu-big-menu"
+            value="<?php echo (int) $_['big-menu'] ?>"
+        >
+        <input
+            type="hidden"
+            class="side-menu-setting"
+            name="side-with-categories"
+            id="side-menu-side-with-categories"
+            value="<?php echo (int) $_['side-with-categories'] ?>"
+        >
+        <br>
+
+
+        <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
                     <?php p($l->t('Open the menu when the mouse is hover the opener (automatically disabled on touch screens)')); ?>
@@ -612,18 +589,16 @@ $labelAlwaysDisplayed = 'Always displayed';
                     </select>
                 </div>
             </div>
-        </div>
-    </div>
 
-    <div class="section">
-        <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
                     <?php p($l->t('Display the logo')); ?>
-
-                    <div class="badges">
-                        <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-                    </div>
+                    <br>
+                    <em>
+                        <?php echo $l->t('This feature is not compatible with the <code>big menu</code> display.'); ?>
+                        <br>
+                        <?php p($l->t('The logo will be hidden when the menu is always displayed.')); ?>
+                    </em>
                 </div>
                 <div class="side-menu-setting-form">
                     <select id="side-menu-display-logo" name="display-logo" class="side-menu-setting">
@@ -639,10 +614,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
                     <?php p($l->t('Use the avatar instead of the logo')); ?>
-
-                    <div class="badges">
-                        <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-                    </div>
                 </div>
                 <div class="side-menu-setting-form">
                     <select id="side-menu-use-avatar" name="use-avatar" class="side-menu-setting">
@@ -658,10 +629,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
                     <?php p($l->t('The logo is a link to the default app')); ?>
-
-                    <div class="badges">
-                        <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-                    </div>
                 </div>
                 <div class="side-menu-setting-form">
                     <select id="side-menu-add-logo-link" name="add-logo-link" class="side-menu-setting">
@@ -677,13 +644,8 @@ $labelAlwaysDisplayed = 'Always displayed';
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
                     <?php p($l->t('Apps that should not be displayed in the menu')); ?>
-
-                    <div class="badges">
-                        <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-                        <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-                        <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-                        <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-                    </div>
+                    <br>
+                    <em><?php echo $l->t('This feature is only compatible with the <code>big menu</code> display.'); ?></em>
                 </div>
                 <div class="side-menu-setting-form">
                     <a class="side-menu-toggler" data-target="#big-menu-hidden-apps" href="#_">
@@ -803,17 +765,10 @@ $labelAlwaysDisplayed = 'Always displayed';
             <?php p($l->t('Top menu')); ?>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-        </div>
-
         <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
-                    <?php p($l->t('Applications kept in the top menu')); ?>
+                    <?php p($l->t('Apps only visible in the top menu')); ?>
                 </div>
                 <div class="side-menu-setting-form">
                     <a class="side-menu-toggler" data-target="#top-menu-apps" href="#_">
@@ -844,9 +799,7 @@ $labelAlwaysDisplayed = 'Always displayed';
 
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
-                    <?php p($l->t('Applications kept in the top menu but also shown in side menu')); ?>
-                    <br>
-                    <em><?php p($l->t('These applications must be selected in the previous option.')); ?></em>
+                    <?php p($l->t('Apps visible in the top and side menus')); ?>
                 </div>
                 <div class="side-menu-setting-form">
                     <a class="side-menu-toggler" data-target="#top-side-menu-apps" href="#_">
@@ -874,26 +827,6 @@ $labelAlwaysDisplayed = 'Always displayed';
                     </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>
-                <?php
-                    $choices = array_merge(
-                        $choicesYesNo,
-                        ['Except the hovered app' => '2']
-                    );
-                ?>
-                <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 ($choices 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>
 
@@ -902,13 +835,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <?php p($l->t('Applications')); ?>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-        </div>
-
         <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <div class="side-menu-setting-label">
@@ -949,11 +875,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <?php p($l->t('Categories')); ?>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-        </div>
-
         <div class="side-menu-setting-table">
             <div class="side-menu-setting-row">
                 <?php
@@ -977,7 +898,7 @@ $labelAlwaysDisplayed = 'Always displayed';
             </div>
 
             <div class="side-menu-setting-row">
-                <div class="side-menu-setting-label side-menu-setting-label--top">
+                <div class="side-menu-setting-label">
                     <?php p($l->t('Custom categories')); ?>
                 </div>
                 <div class="side-menu-setting-form">
@@ -1064,13 +985,6 @@ $labelAlwaysDisplayed = 'Always displayed';
             <?php p($l->t('Tips')); ?>
         </h2>
 
-        <div class="badges">
-            <span class="badge badge-1"><?php p($l->t($labelDefault)); ?></span>
-            <span class="badge badge-2"><?php p($l->t($labelWithCategories)); ?></span>
-            <span class="badge badge-3"><?php p($l->t($labelBigMenu)); ?></span>
-            <span class="badge badge-4"><?php p($l->t($labelAlwaysDisplayed)); ?></span>
-        </div>
-
         <p>
             <em><?php echo $l->t('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.'); ?></em>
         </p>

templates/settings/personal-form.php

@@ -27,7 +27,6 @@ $choicesYesNo = [
 
 
 $labelShowHideApps = 'Show and hide the list of applications';
-$labelReset = 'Reset to default';
 ?>
 <div id="side-menu-section">
     <?php if ($_['force']): ?>
@@ -42,6 +41,10 @@ $labelReset = 'Reset to default';
         </div>
     <?php else: ?>
         <div class="section">
+            <h2>
+                <?php p($l->t('Menu')); ?>
+            </h2>
+
             <p>
                 <em><?php echo $l->t('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.'); ?></em>
             </p>
@@ -120,7 +123,7 @@ $labelReset = 'Reset to default';
             <div class="side-menu-setting-table">
                 <div class="side-menu-setting-row">
                     <div class="side-menu-setting-label">
-                        <?php p($l->t('Applications kept in the top menu')); ?>
+                        <?php p($l->t('Apps only visible in the top menu')); ?>
                         <p>
                             <em>
                                 <?php p($l->t('If there is no selection then the global configuration is applied.')); ?>
@@ -160,10 +163,9 @@ $labelReset = 'Reset to default';
             <div class="side-menu-setting-table">
                 <div class="side-menu-setting-row">
                     <div class="side-menu-setting-label">
-                        <?php p($l->t('Applications kept in the top menu but also shown in side menu')); ?>
+                        <?php p($l->t('Apps visible in the top and side menus')); ?>
                         <p>
                             <em>
-                                <?php p($l->t('These applications must be selected in the previous option.')); ?><br>
                                 <?php p($l->t('If there is no selection then the global configuration is applied.')); ?>
                             </em>
                         </p>
@@ -198,44 +200,6 @@ $labelReset = 'Reset to default';
                 </div>
             </div>
         </div>
-        <div class="section">
-            <h2>
-                <?php p($l->t('Applications')); ?>
-            </h2>
-
-            <div class="side-menu-setting-table">
-                <div class="side-menu-setting-row">
-                    <div class="side-menu-setting-label">
-                        <?php p($l->t('Customize sorting')); ?>
-                    </div>
-                    <div class="side-menu-setting-form">
-                        <a class="side-menu-toggler" data-target="#apps-order-list" href="#_">
-                            🖱️ <?php p($l->t($labelShowHideApps)); ?>
-                        </a>
-
-                        <div class="theme-undo icon icon-history btn-reset btn-reset--down" data-toggle="tooltip" data-original-title="<?php echo p($l->t($labelReset)); ?>" data-reset="<?php echo htmlentities(json_encode([
-                            'side-menu-apps-order' => '[]',
-                        ])) ?>"></div>
-
-                        <div id="apps-order-list" style="display: none">
-                            <ul class="side-menu-setting-list">
-                                <?php foreach ($_['ordered-apps'] as $key => $app): ?>
-                                    <li data-id="<?php echo $app['id']; ?>" class="side-menu-setting-list-item">
-                                        <span class="arrow">
-                                            ⇅
-                                        </span>
-
-                                        <?php echo p($l->t($app['name'])); ?>
-                                    </li>
-                                <?php endforeach; ?>
-                            </ul>
-                        </div>
-
-                        <input type="hidden" value='<?php echo json_encode($_['apps-order']) ?>' name="apps-order" class="side-menu-setting" id="side-menu-apps-order" data-personal>
-                    </div>
-                </div>
-            </div>
-        </div>
     <?php endif ?>
 
     <div class="section">

webpack.config.js

@@ -0,0 +1,34 @@
+const Encore = require('@symfony/webpack-encore');
+
+// Manually configure the runtime environment if not already configured yet by the "encore" command.
+// It's useful when you use tools that rely on webpack.config.js file.
+if (!Encore.isRuntimeEnvironmentConfigured()) {
+    Encore.configureRuntimeEnvironment(process.env.NODE_ENV || 'dev');
+}
+
+Encore
+    .setOutputPath('assets/')
+    .setPublicPath('./')
+    .addEntry('admin', './src/admin.js')
+    .addEntry('menu', './src/menu.js')
+    .setManifestKeyPrefix('./')
+    .enableSingleRuntimeChunk()
+    .cleanupOutputBeforeBuild()
+    .enableVueLoader()
+    .enableSourceMaps(!Encore.isProduction())
+    .enableVersioning(Encore.isProduction())
+    .configureBabel((config) => {
+        config.plugins.push('@babel/plugin-proposal-class-properties');
+    })
+    .configureBabelPresetEnv((config) => {
+        config.useBuiltIns = 'usage';
+        config.corejs = 3;
+    })
+    .copyFiles({
+        from: './img',
+        to: 'images/[path][name].[hash:8].[ext]'
+    })
+    .enableSassLoader()
+;
+
+module.exports = Encore.getWebpackConfig();

webpack.js

@@ -1,54 +0,0 @@
-const path = require('path')
-const { VueLoaderPlugin } = require('vue-loader')
-const StyleLintPlugin = require('stylelint-webpack-plugin')
-
-module.exports = {
-    devtool: "source-map",
-    entry: {
-        'admin': path.join(__dirname, 'src', 'admin.js'),
-        'sideMenu': path.join(__dirname, 'src', 'SideMenu.js'),
-    },
-    output: {
-        path: path.resolve(__dirname, './js'),
-        publicPath: '/js',
-        filename: '[name].js?v=[hash]',
-        chunkFilename: 'chunks/[name]-[hash].js',
-    },
-    module: {
-        rules: [
-            {
-                test: /\.css$/,
-                use: ['vue-style-loader', 'css-loader'],
-            },
-            {
-                test: /\.scss$/,
-                use: ['vue-style-loader', 'css-loader', 'sass-loader'],
-            },
-            {
-                test: /\.vue$/,
-                loader: 'vue-loader',
-            },
-            {
-                test: /\.js$/,
-                loader: 'babel-loader',
-                exclude: /node_modules/,
-            },
-            {
-                test: /\.(png|jpg|gif|svg)$/,
-                loader: 'url-loader',
-                options: {
-                    name: '[name].[ext]?[hash]',
-                    limit: 8192,
-                },
-            },
-        ],
-    },
-    plugins: [
-        new VueLoaderPlugin(),
-        new StyleLintPlugin(),
-    ],
-    resolve: {
-        extensions: ['*', '.js', '.vue'],
-        symlinks: false,
-    },
-}