🎨 Improve CSS around Swiper component

src/views/SettingsView.vue

@@ -1,4 +1,5 @@
 <script setup>
+import ScrollableContainer from "../components/scrollable-container.vue";
 import {
   classList,
   classFilter,
@@ -13,7 +14,7 @@ const gitHash = GITVERSION;
 </script>
 
 <template>
-  <div class="settings">
+  <ScrollableContainer class="settings">
     <!-- Filtering -->
     <h2>{{ $t("settings.heading.filtering") }}</h2>
     <p>{{ $t("settings.text.filtering") }}</p>
@@ -70,15 +71,12 @@ const gitHash = GITVERSION;
     <p>{{ $t("settings.text.about") }}</p>
     <div class="spacer"></div>
     <p class="gray">{{ $t("settings.version") }}: {{ gitHash }}</p>
-  </div>
+  </ScrollableContainer>
 </template>
 
 <style scoped>
 .settings {
-  padding: 15px 10px 80px 10px;
-  height: calc(100% - 100px);
-  overflow-y: auto;
-  padding-bottom: 90px;
+  padding: 15px 10px 0px 10px;
 }
 
 h2 {