refactore of menus: classes and scss

src/menus/SideMenuWithCategories.vue

@@ -16,12 +16,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <div
-    id="side-menu"
     ref="menu"
-    class="side-menu-with-categories"
+    class="cm--sidemenuwithcategories"
     :class="{ open: open }"
   >
-    <div class="side-menu-header">
+    <div class="cm-header">
       <SettingsButton
         v-if="settings"
         :href="settings.href"
@@ -35,31 +34,32 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       />
     </div>
 
-    <div class="side-menu-categories-wrapper">
-      <div class="side-menu-categories">
+    <div class="cm-categories-wrapper">
+      <div class="cm-categories">
         <template
           v-for="(category, key) in items"
           :key="key"
         >
           <div
             v-if="containsAppsMatchingSearch(category.apps, search)"
-            class="side-menu-category"
+            class="cm-category"
           >
             <h2
               v-if="category.name != ''"
-              class="side-menu-category-title"
+              class="cm-category-title"
             >
               {{ category.name }}
             </h2>
 
-            <ul class="side-menu-apps-list">
+            <ul class="cm-apps">
               <template
                 v-for="(app, appId) in category.apps"
                 :key="appId"
               >
                 <SideMenuBigApp
                   v-if="isAppMatchingSearch(app, search)"
-                  :classes="{ 'side-menu-app': true, active: activeApp === appId }"
+                  class="cm-app"
+                  :classes="{ active: activeApp === appId }"
                   :icon="app.icon"
                   :label="app.name"
                   :href="app.href"