button animation

src/components/Note.vue

@@ -56,24 +56,7 @@ const setRootNote = () => {
       :note="activeNote"
       v-if="activeNote"
     />
-    <div class="card mt-3 border-[1px]" v-if="references.length > 0">
-      <div class="card-body px-3 py-3">
-        <ul class="menu rounded-md">
-          <li class="menu-title !opacity-100">
-            <span class="card-title text-secondary">
-              References
-              <div class="badge-outline badge">{{ references.length }}</div>
-            </span>
-          </li>
-          <li v-for="reference in references">
-            <a class="rounded-md" @click="activeNote = reference">
-              <i class="far fa-file-alt fa-fw" />
-              {{ reference.title }}
-            </a>
-          </li>
-        </ul>
-      </div>
-    </div>
+    <NoteReferences :references="references" />
     <hr class="my-3" />
     <div class="flex text-sm text-secondary">
       <span>{{ note.wordCount }} {{ note.wordCount === 1 ? 'word' : 'words' }}</span>