refactore of menus: classes and scss

src/components/AppSearch.vue

@@ -15,7 +15,7 @@ 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/>.
 -->
 <template>
-  <div class="side-menu-search">
+  <div class="cm-search">
     <input
       v-model="model"
       type="text"

src/components/CloserButton.vue

@@ -16,7 +16,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <button
-    class="side-menu-opener side-menu-closer"
+    class="cm-opener cm-closer"
     :arial-label="t('side_menu', 'Close the menu')"
     @click="$emit('click')"
   >

src/components/OpenerButton.vue

@@ -16,7 +16,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <button
-    class="side-menu-opener"
+    class="cm-opener"
     :arial-label="label"
     @click="$emit('click')"
   >

src/components/PageLoader.vue

@@ -15,9 +15,9 @@ 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/>.
 -->
 <template>
-  <div id="side-menu-loader">
+  <div class="cm-loader">
     <div
-      id="side-menu-loader-bar"
+      class="cm-loader-bar"
       :style="createStyle(width)"
     ></div>
   </div>

src/components/SettingsButton.vue

@@ -15,7 +15,7 @@ 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/>.
 -->
 <template>
-  <div class="side-menu-settings">
+  <div class="cm-setting">
     <a :href="href">
       <!--
       {{ label }}

src/components/SideMenuApp.vue

@@ -22,11 +22,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       :title="label"
     >
       <img
-        class="side-menu-app-icon"
+        class="cm-app-icon"
         :src="icon"
         :alt="label"
       />
-      <span class="side-menu-app-text">{{ label }}</span>
+      <span class="cm-app-text">{{ label }}</span>
     </a>
   </li>
 </template>

src/components/SideMenuBigApp.vue

@@ -22,11 +22,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       :title="label"
     >
       <img
-        class="side-menu-app-icon"
+        class="cm-app-icon"
         :src="icon"
         :alt="label"
       />
-      <span class="side-menu-app-text">{{ label }}</span>
+      <span class="cm-app-text">{{ label }}</span>
     </a>
   </li>
 </template>

src/components/settings/form/FormOpener.vue

@@ -16,8 +16,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <FormSelect
-    class="cm-settings-form-opener"
     v-model="model"
+    class="cm-settings-form-opener"
     :options="options"
   />
 </template>

src/components/settings/form/FormRange.vue

@@ -17,8 +17,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 <template>
   <div class="cm-settings-form-range">
     <em
-      class="cm-settings-form-range-prepend"
       v-if="prepend"
+      class="cm-settings-form-range-prepend"
       >{{ t('side_menu', prepend) }}</em
     >
 

src/components/settings/form/FormSize.vue

@@ -16,8 +16,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <FormSelect
-    class="cm-settings-form-size"
     v-model="model"
+    class="cm-settings-form-size"
     :options="options"
   />
 </template>

src/components/settings/form/FormYesNo.vue

@@ -16,8 +16,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 -->
 <template>
   <NcCheckboxRadioSwitch
-    class="cm-settings-form-yesno"
     v-model="model"
+    class="cm-settings-form-yesno"
     type="switch"
   />
 </template>