Feat/add bulma (#1)

* remove fixture for task and steps

* install bulma

* convert to scss files

* reset and implement first style classes

* design task form

* design task view

* design step record

* 💄 (home) new task and reset styling

* fix step title height

* add a record progress

* ♻️ (record) extract record controls

* ♿️ (record) add text for progress

* 💄 (step record) fix blob size

* ♻️ (record) no more getters who do an action too

src/modules/task/components/TaskList.vue

@@ -6,18 +6,25 @@ const taskStore = useTaskStore()
 </script>
 
 <template>
-  <ul class="task-list">
-    <li v-for="task in taskStore.recentTasks" :key="task.id">
-      <router-link :to="{ name: 'task-view', params: { id: task.id } }">{{
-        task.title
-      }}</router-link>
-      | {{ task.totalEstimation }} minutes |
-      {{ formatDate(task.date) }}
-    </li>
-  </ul>
+  <div class="content">
+    <ul class="task-list">
+      <li v-for="task in taskStore.recentTasks" :key="task.id">
+        <router-link
+          :to="{ name: 'task-view', params: { id: task.id } }"
+          class="button is-link is-outlined"
+          >{{ task.title }}</router-link
+        >
+        <span> {{ task.totalEstimation }} minutes </span>
+        <span>{{ formatDate(task.date) }}</span>
+      </li>
+    </ul>
+  </div>
 </template>
 
 <style scoped>
-.task-list {
+.task-list li {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
 }
 </style>