Files
buildpath/frontend/components/Logo.vue
2024-12-01 11:48:21 +01:00

40 lines
938 B
Vue

<script setup lang="ts">
defineProps<{
imgWidth?: String,
fontSize?: String
}>()
</script>
<template>
<div style="width: fit-content; max-width: 100%; overflow: hidden;">
<NuxtLink style="display: flex; width: fit-content; text-decoration: none;" to="/">
<img id="logo-img" :width="imgWidth == null ? '120' : Number(imgWidth)" src="~/assets/img/buildpath-high-resolution-logo-transparent.png" />
<h1 :style="'font-size: ' + (fontSize == null ? '5.0rem' : fontSize) + ';'" id="logo-text">BuildPath</h1>
</NuxtLink>
</div>
</template>
<style>
#logo-text {
font-weight: 200;
align-content: center;
margin-left: 20px;
user-select: none;
text-decoration: none;
}
#logo-img {
user-select: none;
}
@media only screen and (max-width: 550px) {
#logo-text {
margin-left: 10px;
}
#logo-img {
max-width: 80px;
height: fit-content;
}
}
</style>