<template>
	<a class="navbar-brand" :href="href">
		<img class="app-logo" :src="src" :alt="alt" :width="width" :height="height" />
	</a>
</template>

<script>
export default {
	name: 'Logo',
	props: {
		href: { type: String, default: '/' },
		src: { type: String, default: '/images/logo-kopkb.png' },
		alt: { type: String, default: 'MyKoPKB Logo' },
		width: { type: [Number, String], default: 150 },
		height: { type: [Number, String], default: 44 },
	},
};
</script>

<style>
.app-logo {
	display: block;
	width: 100px;
	height: 55px;
	object-fit: contain;
}
</style>
