Use buttons more consistently

src/components/input/colorPicker.vue

@@ -16,7 +16,7 @@
 			model="hex"
 			picker="square"
 			v-model="color"/>
-		<a @click="reset" class="reset">
+		<a @click="reset" class="button has-no-shadow is-small ml-2">
 			Reset Color
 		</a>
 	</div>

src/components/input/datepicker.vue

@@ -98,7 +98,7 @@
 				/>
 
 				<a
-					class="button is-outlined is-primary has-no-shadow is-fullwidth"
+					class="button is-primary has-no-shadow is-fullwidth"
 					@click="close"
 				>
 					Confirm

src/components/input/editor.vue

@@ -1,14 +1,16 @@
 <template>
 	<div :class="{'is-pulled-up': isEditEnabled}" class="editor">
-		<div class="tabs is-right" v-if="hasPreview && isEditEnabled && !hasEditBottom">
-			<ul>
-				<li>
-					<a v-if="!isEditActive" @click="toggleEdit">Edit</a>
-					<a v-else @click="toggleEdit">Done</a>
-				</li>
-			</ul>
+		<div class="is-pulled-right mb-4" v-if="hasPreview && isEditEnabled && !hasEditBottom">
+			<a v-if="!isEditActive" @click="toggleEdit" class="button has-no-shadow">
+				<icon icon="pen"/>
+			</a>
+			<a v-else @click="toggleEdit" class="button has-no-shadow">
+				Done
+			</a>
 		</div>
 
+		<div class="clear"></div>
+
 		<vue-easymde
 			:configs="config"
 			@change="bubble"
@@ -416,8 +418,8 @@ export default {
 @import '../../styles/theme/variables';
 
 .editor {
-	.tabs ul {
-		margin-left: 0;
+	.clear {
+		clear: both;
 	}
 
 	.preview.content ul li input[type="checkbox"] {