feat: improve icons (#903)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: vikunja/frontend#903
Reviewed-by: konrad <k@knt.li>
Co-authored-by: dpschen <dpschen@noreply.kolaente.de>
Co-committed-by: dpschen <dpschen@noreply.kolaente.de>

src/icons.js

@@ -7,7 +7,6 @@ import {
 	faBars,
 	faBell,
 	faCalendar,
-	faCalendarWeek,
 	faCheck,
 	faCheckDouble,
 	faChessKnight,
@@ -36,14 +35,17 @@ import {
 	faPen,
 	faPencilAlt,
 	faPercent,
+	faPlay,
 	faPlus,
 	faPowerOff,
 	faSearch,
 	faShareAlt,
 	faSignOutAlt,
+	faSitemap,
 	faSort,
 	faSortUp,
 	faStar as faStarSolid,
+	faStop,
 	faTachometerAlt,
 	faTags,
 	faTasks,
@@ -74,7 +76,6 @@ library.add(faBell)
 library.add(faBellSlash)
 library.add(faCalendar)
 library.add(faCalendarAlt)
-library.add(faCalendarWeek)
 library.add(faCheck)
 library.add(faCheckDouble)
 library.add(faChessKnight)
@@ -105,16 +106,19 @@ library.add(faPaste)
 library.add(faPen)
 library.add(faPencilAlt)
 library.add(faPercent)
+library.add(faPlay)
 library.add(faPlus)
 library.add(faPowerOff)
 library.add(faSave)
 library.add(faSearch)
 library.add(faShareAlt)
 library.add(faSignOutAlt)
+library.add(faSitemap)
 library.add(faSort)
 library.add(faSortUp)
 library.add(faStar)
 library.add(faStarSolid)
+library.add(faStop)
 library.add(faSun)
 library.add(faTachometerAlt)
 library.add(faTags)

src/views/tasks/TaskDetailView.vue

@@ -34,7 +34,7 @@
 							<div class="column" v-if="activeFields.priority">
 								<!-- Priority -->
 								<div class="detail-title">
-									<icon :icon="['far', 'star']"/>
+									<icon icon="exclamation"/>
 									{{ $t('task.attributes.priority') }}
 								</div>
 								<priority-select
@@ -88,7 +88,7 @@
 							<div class="column" v-if="activeFields.startDate">
 								<!-- Start Date -->
 								<div class="detail-title">
-									<icon icon="calendar-week"/>
+									<icon icon="play"/>
 									{{ $t('task.attributes.startDate') }}
 								</div>
 								<div class="date-input">
@@ -115,7 +115,7 @@
 							<div class="column" v-if="activeFields.endDate">
 								<!-- End Date -->
 								<div class="detail-title">
-									<icon icon="calendar-week"/>
+									<icon icon="stop"/>
 									{{ $t('task.attributes.endDate') }}
 								</div>
 								<div class="date-input">
@@ -141,7 +141,7 @@
 							<div class="column" v-if="activeFields.reminders">
 								<!-- Reminders -->
 								<div class="detail-title">
-									<icon icon="history"/>
+									<icon :icon="['far', 'clock']"/>
 									{{ $t('task.attributes.reminders') }}
 								</div>
 								<reminders
@@ -155,7 +155,7 @@
 							<div class="column" v-if="activeFields.repeatAfter">
 								<!-- Repeat after -->
 								<div class="detail-title">
-									<icon :icon="['far', 'clock']"/>
+									<icon icon="history"/>
 									{{ $t('task.attributes.repeat') }}
 								</div>
 								<repeat-after
@@ -214,7 +214,7 @@
 					<div class="content details mb-0" v-if="activeFields.relatedTasks">
 						<h3>
 							<span class="icon is-grey">
-								<icon icon="tasks"/>
+								<icon icon="sitemap"/>
 							</span>
 							{{ $t('task.attributes.relatedTasks') }}
 						</h3>
@@ -288,7 +288,7 @@
 						<x-button
 							@click="setFieldActive('priority')"
 							type="secondary"
-							:icon="['far', 'star']"
+							icon="exclamation"
 						>
 							{{ $t('task.detail.actions.priority') }}
 						</x-button>
@@ -304,28 +304,28 @@
 						<x-button
 							@click="setFieldActive('startDate')"
 							type="secondary"
-							icon="calendar-week"
+							icon="play"
 						>
 							{{ $t('task.detail.actions.startDate') }}
 						</x-button>
 						<x-button
 							@click="setFieldActive('endDate')"
 							type="secondary"
-							icon="calendar-week"
+							icon="stop"
 						>
 							{{ $t('task.detail.actions.endDate') }}
 						</x-button>
 						<x-button
 							@click="setFieldActive('reminders')"
 							type="secondary"
-							icon="history"
+							:icon="['far', 'clock']"
 						>
 							{{ $t('task.detail.actions.reminders') }}
 						</x-button>
 						<x-button
 							@click="setFieldActive('repeatAfter')"
 							type="secondary"
-							:icon="['far', 'clock']"
+							icon="history"
 						>
 							{{ $t('task.detail.actions.repeatAfter') }}
 						</x-button>
@@ -350,7 +350,7 @@
 							@shortkey="setFieldActive('relatedTasks')"
 							type="secondary"
 							v-shortkey="['r']"
-							icon="tasks"
+							icon="sitemap"
 						>
 							{{ $t('task.detail.actions.relatedTasks') }}
 						</x-button>