44 lines
1001 B
Vue
44 lines
1001 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="/">
|
|
<NuxtImg id="logo-img" alt="BuildPath"
|
|
format="webp"
|
|
:width="imgWidth == null ? '120' : Number(imgWidth)"
|
|
src="/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;
|
|
max-height: 103px;
|
|
height: fit-content;
|
|
}
|
|
}
|
|
</style> |