show child descriptions

frontend/rabbi_gerzi/src/stores/elements.ts

@@ -4,6 +4,7 @@ import { defineStore } from 'pinia'
 export interface Element {
   id: number
   title: string
+  description: string
 }
 
 interface ElementResponse {

frontend/rabbi_gerzi/src/views/ElementPage.vue

@@ -65,7 +65,15 @@ watch(
                 class="element-page__child-link"
                 data-cy="child-element-link"
               >
-                {{ childElement.title }}
+                <span class="element-page__child-title">
+                  {{ childElement.title }}
+                </span>
+                <span
+                  v-if="childElement.description !== ''"
+                  class="element-page__child-description"
+                >
+                  {{ childElement.description }}
+                </span>
               </RouterLink>
             </li>
           </ul>
@@ -131,6 +139,19 @@ watch(
     transform 180ms ease;
 }
 
+.element-page__child-title {
+  display: block;
+}
+
+.element-page__child-description {
+  display: block;
+  margin-top: 0.4rem;
+  color: var(--color-text-muted);
+  font-family: var(--font-sans);
+  font-size: 0.95rem;
+  line-height: 1.45;
+}
+
 .element-page__child-link:hover,
 .element-page__child-link:focus-visible {
   border-color: #d4ad5f;