ParcoursIndex: même disposition que ParcoursAll

En référence à #25

src/components/AuthorsComponent.vue

@@ -19,9 +19,10 @@
           </div>
           <div class="col-md-6 pull-right">
               <div class="vertical-list-container">
-                  <div v-for="author in dataAuthors"
+                  <div
                        class="vertical-list-wrapper">
-                    <h3><span class="bg"></span>
+                    <h3 v-for="author in dataAuthors">
+                      <span class="bg"></span>
                       <router-link :to="{ name: 'authorSingle', params: { id: author.id_author }}">
                         {{ author.versions[0].name }} <sup>{{ author.id_author | romanize }}</sup>
                       </router-link>

src/components/ParcoursAllComponent.vue

@@ -21,11 +21,11 @@
               <h2>Parcours de lecture</h2>
             </div>
           </div>
+
           <div class="col-md-6 pull-right">
             <div class="vertical-list-container">
-              <div v-for="parcours in parcoursAll"
-                   class="vertical-list-wrapper">
-                <h3>
+              <div class="vertical-list-wrapper">
+                <h3 v-for="parcours in parcoursAll">
                   <router-link :to="{ name: 'parcoursIndex', params: { parcoursId: parcours.id_keyword, parcoursSlug: '-' + slugify(parcours.versions[0].title) } }">
                     <span class="bg"></span>{{ parcours.versions[0].title }} <sup>{{ parcours.entities.length | romanize }}</sup>
                   </router-link>

src/components/ParcoursIndexComponent.vue

 <template>
-<div class="parcours-index" v-bind:parcours="parcours">
-  <div class="page-title-container"
-       v-if="parcours && parcours.versions">
-    <h1>{{ parcours.versions[0].title }}</h1>
-  </div>
+  <div class="parcours-index" v-bind:parcours="parcours">
+    <div class="page-title-container">
+      <h1>{{ parcours.versions[0].title }}</h1>
+    </div>
+
+    <scroll-progress-bar></scroll-progress-bar>
 
-  <div v-if="parcours && parcours.versions"
-       class="row parcours-row">
-    <div class="col-md-10 col-md-offset-1 column">
-      <div class="inner-links">
-        <router-link :to="{ name: 'parcoursAll' }">
+    <div v-if="parcours && parcours.versions"
+         class="row scroll row--all">
+      <div class="col-md-5 col-md-offset-1">
+        <div class="inner-links">
+          <router-link :to="{ name: 'parcoursAll' }">
+            <span class="dash"></span>
+            Retour aux parcours
+          </router-link>
+        </div>
+
+        <div class="page-subtitle-container">
           <span class="dash"></span>
-          Retour aux parcours
-        </router-link>
+          <h2>{{ parcours.versions[0].title }}</h2>
+        </div>
       </div>
 
-      <h2>{{ parcours.versions[0].title }}</h2>
-
-      <div class="overflow">
-        <index-nav v-bind:list-items="parcours.entities"
-                   v-bind:item-id="parcoursId"
-                   v-bind:item-slug="'-' + slugify(parcours.versions[0].title)"
-                   route-name="parcoursSingle"
-                   ></index-nav>
+      <div class="col-md-6 pull-right">
+        <div class="vertical-list-container">
+          <div class="vertical-list-wrapper">
+            <h3 v-for="(entity, index) in parcours.entities">
+              <router-link :to="{
+                                name: 'parcoursSingle',
+                                params: { parcoursId: parcours.id_keyword,
+                                parcoursSlug: '-' + slugify(parcours.versions[0].title),
+                                epigramIndex: index + 1
+                                } }">
+                <span class="bg"></span>{{ entity.title }} <sup>{{ index + 1 | romanize }}</sup>
+              </router-link>
+            </h3>
+  <!--
+          <index-nav v-bind:list-items="parcours.entities"
+                     v-bind:item-id="parcoursId"
+                     v-bind:item-slug="'-' + slugify(parcours.versions[0].title)"
+                     route-name="parcoursSingle"
+                     ></index-nav>
+  -->
+          </div>
+        </div>
       </div>
     </div>
+    <div v-else class="notExist">
+      <p>Le parcours que vous cherchez n'existe pas</p>
+      <back-btn></back-btn>
+    </div>
   </div>
-  <div v-else class="notExist">
-    <p>Le parcours que vous cherchez n'existe pas</p>
-    <back-btn></back-btn>
-  </div>
-</div>
 </template>
 
 <script>
@@ -163,14 +183,15 @@ $hover: .5s all ease-out
 .parcours-index
   width: 100%
   height: 100%
-
-  .parcours-row
-    height: 100%
-    .column
-      height: 100%
-      display: flex
-      flex-direction: column
-
+  display: flex
+  flex-direction: column
+
+//  .parcours-row
+//    height: 100%
+//    .column
+//      height: 100%
+//      display: flex
+//      flex-direction: column
 
 .mute
   display: inline-block