Use the new datepicker for start date

src/components/input/datepicker.vue

@@ -134,7 +134,7 @@ export default {
 	},
 	props: {
 		value: {
-			validator: prop => prop instanceof Date || prop === null
+			validator: prop => prop instanceof Date || prop === null || typeof prop === 'string'
 		},
 		chooseDateLabel: {
 			type: String,
@@ -150,7 +150,7 @@ export default {
 	},
 	watch: {
 		value(newVal) {
-			this.date = newVal
+			this.date = new Date(newVal)
 		},
 		flatPickrDate(newVal) {
 			this.date = new Date(newVal)

src/views/tasks/TaskDetailView.vue

@@ -80,18 +80,14 @@
 								Start Date
 							</div>
 							<div class="date-input">
-								<flat-pickr
+								<datepicker
-									:class="{ 'disabled': taskService.loading}"
-									:config="flatPickerConfig"
-									:disabled="taskService.loading || !canWrite"
-									@on-close="() => saveTask()"
-									class="input"
-									placeholder="Click here to set a start date"
-									ref="startDate"
 									v-model="task.startDate"
-								>
+									@close="() => saveTask()"
-								</flat-pickr>
+									choose-date-label="Click here to set a start date"
-								<a @click="() => {task.startDate = null;saveTask()}" v-if="task.startDate && canWrite">
+									:disabled="taskService.loading || !canWrite"
+									ref="startDate"
+								/>
+								<a @click="() => {task.startDate = null;saveTask()}" v-if="task.startDate && canWrite" class="remove">
 									<span class="icon is-small">
 										<icon icon="times"></icon>
 									</span>