From 9fabd68baed889ea0782b8d5f53b4f9073eabe15 Mon Sep 17 00:00:00 2001
From: Paolo Arena <paolo.arena77@gmail.com>
Date: Fri, 15 Mar 2019 12:23:38 +0100
Subject: [PATCH] Menu Style (active, ...) expand-icon-class="my-menu-separat"
 header-class="my-menu" active-class="my-menu-active"

---
 .env.development                 |  2 +-
 src/layouts/menuone/menuOne.scss | 24 ++++++++++++++++++++++++
 src/layouts/menuone/menuOne.vue  | 21 ++++++++++++++-------
 3 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/.env.development b/.env.development
index 7324646..2327087 100644
--- a/.env.development
+++ b/.env.development
@@ -14,6 +14,6 @@ TEST_EMAIL="paolo.arena77@gmail.com"
 TEST_USERNAME="paoloar77"
 TEST_PASSWORD="mypassword@1A"
 PUBLICKEY_PUSH="BGxRrFWnPoa_ImUaWXmeEOFVI9VNKVKaAPsvsM1XY6wn24yxp9MyOQ4crNYCJKxSXV65Y1GblW5_VLoamedcZ1I"
-IN_CONSTRUCTION="1"
+IN_CONSTRUCTION="0"
 DEBUG="1"
 TELEGRAM_SUPPORT="https://t.me/freeplanet_supporto"
diff --git a/src/layouts/menuone/menuOne.scss b/src/layouts/menuone/menuOne.scss
index e5b9e67..495afef 100644
--- a/src/layouts/menuone/menuOne.scss
+++ b/src/layouts/menuone/menuOne.scss
@@ -50,3 +50,27 @@
   -webkit-transform: rotate(-180deg);
   transform: rotate(-180deg);
 }
+
+.my-menu, .my-menu > i{
+  min-width: 26px;
+  font-size: 1rem;
+}
+
+.my-menu-icon{
+  min-width: 26px;
+  font-size: 1rem;
+}
+
+.my-menu-icon > i{
+  min-width: 26px;
+  font-size: 1.5rem;
+}
+
+.my-menu-active {
+  background-color: rgba(174, 189, 241, 0.71);
+}
+
+.my-menu-separat > i{
+  min-width: 26px;
+  font-size: 1rem;
+}
diff --git a/src/layouts/menuone/menuOne.vue b/src/layouts/menuone/menuOne.vue
index f7da2a9..c04453d 100644
--- a/src/layouts/menuone/menuOne.vue
+++ b/src/layouts/menuone/menuOne.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="list no-border platform-delimiter light-paragraph">
+    <div class="no-border">
         <q-list class="rounded-borders text-primary">
             <template v-for="(parent, index) in getmenu">
                 <div class="q-list-header">{{replaceUnderlineToSpace(index)}}</div>
@@ -10,15 +10,17 @@
                                 :content-inset-level="0.5"
                                 :label="$t(item.name)"
                                 :icon="item.materialIcon"
-                                class="titleSubMenu"
+                                expand-icon-class="my-menu-separat"
+                                header-class="my-menu"
+                                active-class="my-menu-active"
                         >
 
                             <q-expansion-item v-for="(child2, index) in item.routes2" :to="child2.route" :key="index"
                                               :header-inset-level="0.5"
                                               :duration="300"
                                               expand-icon="map"
-                                              :active="child2.label === 'Outbox'"
-                                              class="item item-link drawer-closer cursor-pointer"
+                                              active-class="my-menu-active"
+                                              class="item item-link drawer-closer cursor-pointer my-menu"
                                               :label="$t(child2.name)">
                             </q-expansion-item>
 
@@ -29,14 +31,16 @@
                             <div v-show="true">
                                 <q-item
                                         clickable
+                                        v-ripple
                                         exact
                                         :to="item.route"
-                                        active-class="my-menu-link">
-                                    <q-item-section avatar>
+                                        active-class="my-menu-active"
+                                >
+                                    <q-item-section avatar class="my-menu-icon">
                                         <q-icon :name="item.materialIcon"/>
                                     </q-item-section>
 
-                                    <q-item-section>
+                                    <q-item-section class="my-menu">
                                         {{$t(item.name)}}
                                     </q-item-section>
                                 </q-item>
@@ -44,6 +48,9 @@
                             </div>
                         </q-slide-transition>
                     </div>
+
+                    <!--<q-separator spaced />-->
+
                 </div>
             </template>
         </q-list>