feat: add message component (#1082)

This PR adds a simple message component that replaces bulma's default message.

Co-authored-by: kolaente <k@knt.li>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/1082
Reviewed-by: dpschen <dpschen@noreply.kolaente.de>
Co-authored-by: konrad <k@knt.li>
Co-committed-by: konrad <k@knt.li>

src/components/misc/api-config.vue

@@ -30,27 +30,25 @@
 			<a @click="() => (configureApi = true)">{{ $t('apiConfig.change') }}</a>
 		</div>
 
-		<div
-			class="notification is-success mt-2"
-			v-if="successMsg !== '' && errorMsg === ''"
-		>
+		<message variant="success" v-if="successMsg !== '' && errorMsg === ''" class="mt-2">
 			{{ successMsg }}
-		</div>
-		<div
-			class="notification is-danger mt-2"
-			v-if="errorMsg !== '' && successMsg === ''"
-		>
+		</message>
+		<message variant="danger" v-if="errorMsg !== '' && successMsg === ''" class="mt-2">
 			{{ errorMsg }}
-		</div>
+		</message>
 	</div>
 </template>
 
 <script>
+import Message from '@/components/misc/message'
 import {parseURL} from 'ufo'
 import {checkAndSetApiUrl} from '@/helpers/checkAndSetApiUrl'
 
 export default {
 	name: 'apiConfig',
+	components: {
+		Message,
+	},
 	data() {
 		return {
 			configureApi: false,