💄 (header) replace text by icons

src/assets/icons/card.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-id" width="36" height="36" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2c3a47" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <rect x="3" y="4" width="18" height="16" rx="3" />
+  <circle cx="9" cy="10" r="2" />
+  <line x1="15" y1="8" x2="17" y2="8" />
+  <line x1="15" y1="12" x2="17" y2="12" />
+  <line x1="7" y1="16" x2="17" y2="16" />
+</svg>

src/assets/icons/draft.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-notes" width="36" height="36" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2c3a47" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <rect x="5" y="3" width="14" height="18" rx="2" />
+  <line x1="9" y1="7" x2="15" y2="7" />
+  <line x1="9" y1="11" x2="15" y2="11" />
+  <line x1="9" y1="15" x2="13" y2="15" />
+</svg>

src/assets/icons/mailbox.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mailbox" width="36" height="36" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2c3a47" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M10 21v-6.5a3.5 3.5 0 0 0 -7 0v6.5h18v-6a4 4 0 0 0 -4 -4h-10.5" />
+  <path d="M12 11v-8h4l2 2l-2 2h-4" />
+  <path d="M6 15h1" />
+</svg>

src/components/HeaderNote.vue

@@ -10,19 +10,19 @@
       class="special-folder"
       :to="{ name: 'SpacedRepetitionCard', params: { user, repo } }"
     >
-      cards
+      <img src="@/assets/icons/card.svg" alt="card" />
     </router-link>
     <router-link
       class="special-folder"
       :to="{ name: 'DraftNotes', params: { user, repo } }"
     >
-      draft
+      <img src="@/assets/icons/draft.svg" alt="card" />
     </router-link>
     <router-link
       class="special-folder"
       :to="{ name: 'FleetingNotes', params: { user, repo } }"
     >
-      inbox
+      <img src="@/assets/icons/mailbox.svg" alt="card" />
     </router-link>
   </header>
 </template>