From 60f713caa130d6f4ebe28eb6e22bc555e86dd9a1 Mon Sep 17 00:00:00 2001
From: axolotle <nchesnais@mailoo.org>
Date: Wed, 10 Mar 2021 18:37:52 +0100
Subject: [PATCH] add active state to children text links

---
 src/components/text/TextCard.vue | 6 ++++--
 src/pages/Library.vue            | 6 +++++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/text/TextCard.vue b/src/components/text/TextCard.vue
index df1b7fd..6570b11 100644
--- a/src/components/text/TextCard.vue
+++ b/src/components/text/TextCard.vue
@@ -14,10 +14,11 @@
             </template>
           </h4>
 
-          <b-nav class="ml-auto flex-nowrap">
+          <b-nav class="ml-auto flex-nowrap" pills>
             <b-nav-item
               v-for="child in text.children" :key="child.id"
               @click="$emit('open', id, child.id)"
+              :active="children.includes(child.id)"
             >
               {{ child.id }}
             </b-nav-item>
@@ -67,7 +68,8 @@ export default {
   name: 'TextCard',
 
   props: {
-    id: { type: Number, required: true }
+    id: { type: Number, required: true },
+    children: { type: Array, default: null }
   },
 
   data () {
diff --git a/src/pages/Library.vue b/src/pages/Library.vue
index 312a1ec..256761f 100644
--- a/src/pages/Library.vue
+++ b/src/pages/Library.vue
@@ -5,7 +5,11 @@
 
     <!-- FOREGROUND (texts) -->
     <section v-for="parent in parents" :key="parent.id" class="split-screen">
-      <text-card :id="parent.id" @open="openText" @close="closeText" />
+      <text-card
+        :id="parent.id"
+        :children="parent.children"
+        @open="openText" @close="closeText"
+      />
       <div>
         <text-card
           v-for="id in parent.children" :key="id"