unused slot sidebar in filter menu, an d style

webapp/components/FilterMenu/CategoriesFilter.spec.js

@@ -59,14 +59,14 @@ describe('CategoriesFilter.vue', () => {
 
   describe('mount', () => {
     it('starts with all categories button active', () => {
-      const allCategoriesButton = wrapper.find('.categories-filter .item-all-themen .base-button')
+      const allCategoriesButton = wrapper.find('.categories-filter .item-all-topics .base-button')
       expect(allCategoriesButton.attributes().class).toContain('--filled')
     })
 
     it('sets category button attribute `filled` when corresponding category is filtered', async () => {
       getters['posts/filteredCategoryIds'] = jest.fn(() => ['cat9'])
       wrapper = await Wrapper()
-      democracyAndPoliticsButton = wrapper.find('.categories-filter .item-save-themen .base-button')
+      democracyAndPoliticsButton = wrapper.find('.categories-filter .item-save-topics .base-button')
       expect(democracyAndPoliticsButton.attributes().class).toContain('--filled')
     })
 
@@ -84,7 +84,7 @@ describe('CategoriesFilter.vue', () => {
       it('when all button is clicked', async () => {
         getters['posts/filteredCategoryIds'] = jest.fn(() => ['cat9'])
         wrapper = await Wrapper()
-        const allCategoriesButton = wrapper.find('.categories-filter .item-all-themen .base-button')
+        const allCategoriesButton = wrapper.find('.categories-filter .item-all-topics .base-button')
         allCategoriesButton.trigger('click')
         expect(mutations['posts/RESET_CATEGORIES']).toHaveBeenCalledTimes(1)
       })
@@ -93,7 +93,7 @@ describe('CategoriesFilter.vue', () => {
     describe('save categories', () => {
       it('calls the API', async () => {
         wrapper = await Wrapper()
-        const saveButton = wrapper.find('.categories-filter .item-save-themen .base-button')
+        const saveButton = wrapper.find('.categories-filter .item-save-topics .base-button')
         saveButton.trigger('click')
         expect(apolloMutationMock).toBeCalled()
       })

webapp/components/FilterMenu/CategoriesFilter.vue

@@ -1,7 +1,7 @@
 <template>
   <filter-menu-section :title="$t('filter-menu.categories')" class="categories-filter">
-    <template #filter-themen>
-      <li class="item item-all-themen">
+    <template #filter-topics>
+      <li class="item item-all-topics">
         <labeled-button
           :filled="!filteredCategoryIds.length"
           :label="$t('filter-menu.all')"
@@ -9,9 +9,11 @@
           @click="resetCategories"
         />
       </li>
-      <li class="item item-save-themen">
+      <li class="item item-save-topics">
         <labeled-button filled :label="$t('actions.save')" icon="save" @click="saveCategories" />
       </li>
+      <hr />
+      <ds-space margin="base" />
     </template>
 
     <template #filter-list>

webapp/components/FilterMenu/FilterMenuSection.vue

@@ -6,11 +6,11 @@
       <slot name="filter-follower" />
     </ul>
     <ul class="filter-list">
-      <slot name="filter-themen" />
+      <slot name="filter-topics" />
     </ul>
-    <aside class="sidebar">
+    <!-- <aside class="sidebar">
       <slot name="sidebar" />
-    </aside>
+    </aside> -->
     <!-- <div v-if="divider" class="divider" /> -->
     <ul class="filter-list">
       <slot name="filter-list" />
@@ -21,10 +21,10 @@
 <script>
 export default {
   props: {
-    divider: {
-      type: Boolean,
-      default: true,
-    },
+    // divider: {
+    //   type: Boolean,
+    //   default: true,
+    // },
     title: {
       type: String,
     },
@@ -49,14 +49,14 @@ export default {
   //   flex-wrap: wrap;
   //   flex-basis: 80%;
   //   flex-grow: 1;
-  //   margin-bottom: 20px;
-  //   // max-width: $size-width-filter-sidebar;
+  //   max-width: $size-width-filter-sidebar;
   // }
 
   // > .divider {
-  //   border-left: $border-size-base solid $border-color-soft;
+  //   // border-left: $border-size-base solid $border-color-soft;
   //   margin: $space-small;
   //   margin-left: 0;
+  //   border-top: $border-size-base solid $border-color-soft;
   // }
 
   > .filter-list {