layout refactoring, started nominum item display

src/components/Layouts/MainContentLayout.vue

@@ -1,7 +1,7 @@
 <template>
   <div
     :id="id"
-    class="full-width row"
+    class="full-width row main-content-layout"
   >
     <header class="col-3">
       <slot name="header" />

src/pages/Edition.vue

@@ -1,5 +1,5 @@
 <template>
-  <MainContentLayout id="edition-toc">
+  <MainContentLayout id="edition">
     <template v-if="!content" #header>
       <span>Loading ...</span>
     </template>

src/pages/Nominum.vue

@@ -1,10 +1,37 @@
 <template>
   <MainContentLayout id="nominum">
-    <template v-slot:header>
-      <h1 v-if="content">{{ content.title }}</h1>
-      <span v-if="!content">Loading ...</span>
+    <template v-if="!content" v-slot:header>
+      <span class="loading">Loading ...</span>
     </template>
 
+    <template v-if="content" v-slot:header>
+      <h1>{{ content.title }}</h1>
+      <p>
+        {{ content.birthDate }}, {{ content.birthPlace }}<br>
+        {{ content.deathDate }}, {{ content.deathPlace }}
+      </p>
+    </template>
+
+    <!-- default slot -->
+    <section class="occurences">
+      <ul>
+        <li
+          v-for="ed in content.occurences"
+          :key="ed.item"
+        >
+          <h3>{{ ed.item }}</h3>
+          <ul>
+            <li
+              v-for="oc in ed.occurences"
+              :key="oc.uuid"
+            >
+              <h4>{{ oc.title }}</h4>
+            </li>
+          </ul>
+        </li>
+      </ul>
+    </section>
+
     <template v-slot:nav />
   </MainContentLayout>
 </template>