From 3242153d078531d61f9890d786360584951218ee Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <blacklight86@gmail.com>
Date: Fri, 26 Jun 2020 01:29:57 +0200
Subject: [PATCH] Better style for popup window categories

---
 src/popup/App.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/popup/App.vue b/src/popup/App.vue
index 25e0627..57e70d9 100644
--- a/src/popup/App.vue
+++ b/src/popup/App.vue
@@ -29,7 +29,7 @@
         </div>
 
         <div class="categories" v-else>
-          <div class="category" v-for="(actions, category) in actionsByCategory" :key="category">
+          <div class="category" :class="{ selected: selectedCategory === category }" v-for="(actions, category) in actionsByCategory" :key="category">
             <div class="head" v-if="category.length" @click="selectedCategory = selectedCategory === category ? null : category">
               <i class="fas" :class="selectedCategory === category ? 'fa-chevron-up' : 'fa-chevron-down'" />
               <span class="name" v-text="category" />
@@ -166,6 +166,14 @@ export default {
   display: flex;
 }
 
+.category {
+  &.selected {
+    box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.25);
+    margin: 0 -0.65em;
+    border-radius: 2em;
+  }
+}
+
 .main {
   width: 100%;
   height: 100%;