fix: last element not cut off anymore and list is scrollable

src/components/annotations/annotations.vue

 <template>
-  <div class="annotations">
+  <div class="item">
     <q-tabs
       v-model="currentTab"
       active-color="$q.dark.isActive ? 'white' : 'accent'"
@@ -17,33 +17,33 @@
       />
     </q-tabs>
 
-    <div
+    <!-- <div
       v-if="currentAnnotations.length"
       class="q-ma-sm"
-    >
-      <AnnotationToggles />
-
-      <AnnotationList
-        :configured-annotations="currentAnnotations"
-        :get-icon="getIcon"
-        :status-check="statusCheck"
-        :toggle="toggle"
-      />
-
-      <AnnotationOptions
-        :selected-all="selectedAll"
-        :selected-none="selectedNone"
-        :on-highlight-all="onHighlightAll"
-        :on-highlight-none="onHighlightNone"
-      />
-    </div>
-
-    <div
+    > -->
+    <AnnotationToggles />
+
+    <AnnotationList
+      :configured-annotations="currentAnnotations"
+      :get-icon="getIcon"
+      :status-check="statusCheck"
+      :toggle="toggle"
+    />
+
+    <AnnotationOptions
+      :selected-all="selectedAll"
+      :selected-none="selectedNone"
+      :on-highlight-all="onHighlightAll"
+      :on-highlight-none="onHighlightNone"
+    />
+    <!-- </div> -->
+
+    <!-- <div
       v-else
       class="q-pa-sm"
     >
       <Notification :message="$t(messages.none)" />
-    </div>
+    </div> -->
   </div>
 </template>
 
@@ -54,7 +54,7 @@ import AnnotationToggles from '@/components/annotations/toggles.vue';
 import AnnotationList from '@/components/annotations/list.vue';
 import AnnotationOptions from '@/components/annotations/options.vue';
 
-import Notification from '@/components/notification.vue';
+// import Notification from '@/components/notification.vue';
 
 export default {
   name: 'Annotations',
@@ -62,7 +62,7 @@ export default {
     AnnotationToggles,
     AnnotationList,
     AnnotationOptions,
-    Notification,
+    // Notification,
   },
   props: {
     annotations: {
@@ -308,3 +308,17 @@ export default {
   display: none;
 }
 </style>
+
+<style lang="scss" scoped>
+.item {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+
+.item-content {
+  height: 100vh;
+  overflow: auto;
+  padding: 8px;
+}
+</style>

src/components/annotations/list.vue

 <template>
-  <q-list
-    class="annotation-list"
-  >
+  <q-list class="item-content">
     <q-item
       v-for="annotation in configuredAnnotations"
       :id="'list' + annotation.strippedId"
@@ -58,16 +56,6 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.annotation-list {
-  height: 100vh;
-  overflow: auto;
-  padding: 8px;
-}
-
-.q-item {
-  min-height: unset;
-}
-
 .q-item__section--avatar {
   min-width: 24px;
 }
@@ -75,4 +63,14 @@ export default {
 .q-item__section--side {
   padding-right: unset;
 }
+
+.q-item {
+  min-height: unset;
+}
+
+.item-content {
+  height: 100vh;
+  overflow: auto;
+  padding: 8px;
+}
 </style>