platypush/platypush-webext
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Better style for popup window categories

Browse source
This commit is contained in:
Fabio Manganiello 2020-06-26 01:29:57 +02:00
parent efea2bef15
commit 3242153d07
1 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/popup/App.vue
View file

@ -29,7 +29,7 @@
</div> </div>
<div class="categories" v-else> <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"> <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'" /> <i class="fas" :class="selectedCategory === category ? 'fa-chevron-up' : 'fa-chevron-down'" />
<span class="name" v-text="category" /> <span class="name" v-text="category" />
@ -166,6 +166,14 @@ export default {
display: flex; display: flex;
} }
.category {
&.selected {
box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.25);
margin: 0 -0.65em;
border-radius: 2em;
}
}
.main { .main {
width: 100%; width: 100%;
height: 100%; height: 100%;