shops - quest: refactor filter logic + quest items margins

website/client/components/shops/quests/index.vue

@@ -81,7 +81,7 @@
 
       div(
         v-for="category in categories",
-        v-if="viewOptions[category.identifier].selected"
+        v-if="!anyFilterSelected || viewOptions[category.identifier].selected"
       )
         h2.mb-3 {{ category.text }}
 
@@ -250,6 +250,7 @@
       background-color: #edecee;
       display: inline-block;
       padding: 8px;
+      margin-right: 12px;
     }
 
     .item-wrapper {
@@ -258,6 +259,7 @@
 
     .items > div:not(:last-of-type) {
       margin-right: 16px;
+      margin-bottom: 16px;
     }
   }
 
@@ -415,7 +417,7 @@ export default {
         if (this.shop.categories) {
           this.shop.categories.map((category) => {
             this.$set(this.viewOptions, category.identifier, {
-              selected: true,
+              selected: false,
             });
           });
 
@@ -424,6 +426,10 @@ export default {
           return [];
         }
       },
+
+      anyFilterSelected () {
+        return Object.values(this.viewOptions).some(g => g.selected);
+      },
     },
     methods: {
       questItems (category, sortBy, searchBy, hideLocked, hidePinned) {