Optional title abstract

Closes #125 (closed)

components/content/ArticleDoi.vue

 <script setup lang="ts">
+import { useDisplay } from 'vuetify'
+
 const props = defineProps<{
-    doi: string;
+    index: number
+    doi: string
     divider: boolean
     title?: string
     abstract?: string
 }>();
 
 const { article } = useFetchArticle(props.doi)
-
+const { mobile } = useDisplay()
 const show = ref(false)
 console.log(article)
 
@@ -16,26 +19,30 @@ const articleAbstract = computed(() => { return props.abstract ?? article.value?
 
 </script>
 <template>
-    <v-list-item :href="article?.href" :target="article?.target">
-        <template #prepend>
+    <v-list-item :href="article?.href" :target="article?.target" density="compact" class="px-0">
+        <template #prepend v-if="!mobile">
+            <v-avatar color="primary" size="small" density="compact" variant="tonal">
+                {{ props.index }}
+            </v-avatar>
+        </template>
+        <!-- <template #append v-if="!mobile">
             <v-avatar>
                 <v-icon>{{ article?.prependIcon }}</v-icon>
             </v-avatar>
-        </template>
-        <v-card flat color="transparent" density="compact">
-
-            <v-card-item density="compact">
+        </template> -->
+        <v-card flat color="transparent" density="compact" class="my-0">
+            <v-card-item density="compact" :class="mobile ? 'px-0' : null">
                 <v-card-title><span class="text-subtitle-1 font-weight-bold">{{ articleTitle
                 }}</span></v-card-title>
                 <v-card-subtitle> {{ article?.subtitle ?? "no subtitle" }}</v-card-subtitle>
                 <v-card-subtitle> {{ article?.containerTitle ?? "no containerTitle" }} ({{ article?.year
                 }})</v-card-subtitle>
             </v-card-item>
-            <v-card-actions v-if="articleAbstract" density="compact">
-                <v-btn size="x-small" variant="outlined" :append-icon="show ? 'mdi-chevron-up' : 'mdi-chevron-down'"
+            <v-card-item density="compact" :class="mobile ? 'px-0' : null">
+                <v-btn v-if="articleAbstract" size="x-small" variant="outlined"
+                    :append-icon="show ? 'mdi-chevron-up' : 'mdi-chevron-down'"
                     @click.stop.prevent="show = !show">Abstract</v-btn>
-            </v-card-actions>
-
+            </v-card-item>
             <v-expand-transition>
                 <v-card v-show="show" flat color="transparent">
                     <v-card-text>