filters colored which were selected by filter

webapp/components/Category/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <ds-tag class="category-tag">
+  <ds-tag class="category-tag" :class="filterActive ? 'filterActive' : ''">
     <base-icon :name="icon" />
     {{ name }}
   </ds-tag>
@@ -11,6 +11,7 @@ export default {
   props: {
     icon: { type: String, required: true },
     name: { type: String, default: '' },
+    filterActive: { type: Boolean, default: false, required: false },
   },
 }
 </script>
@@ -28,4 +29,7 @@ export default {
     font-size: $font-size-base;
   }
 }
+.filterActive{
+  background-color: $color-success-active;
+}
 </style>

webapp/components/PostTeaser/PostTeaser.vue

@@ -37,6 +37,7 @@
               placement: 'bottom-start',
             }"
             :icon="category.icon"
+            :filterActive="postsFilter ? postsFilter.id_in.includes(category.id) : false"
           />
         </div>
         <div v-else class="categories-placeholder"></div>
@@ -107,6 +108,10 @@ export default {
       type: Object,
       default: () => {},
     },
+    postsFilter: {
+      type: Object,
+      default: () => {},
+    },
   },
   data() {
     return {

webapp/pages/index.vue

@@ -93,6 +93,7 @@
         >
           <post-teaser
             :post="post"
+            :postsFilter="postsFilter['categories_some']"
             @removePostFromList="posts = removePostFromList(post, posts)"
             @pinPost="pinPost(post, refetchPostList)"
             @unpinPost="unpinPost(post, refetchPostList)"