55 lines
839 B
Vue
55 lines
839 B
Vue
<template>
|
|
<h1 class="brand">
|
|
<RouterLink :to="to" class="brand-link">
|
|
<img src="/stechuhr.png" alt="Stechuhr" class="brand-logo" width="32" height="32" />
|
|
<span class="brand-text">Stechuhr</span>
|
|
</RouterLink>
|
|
</h1>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { RouterLink } from 'vue-router'
|
|
|
|
defineProps({
|
|
to: {
|
|
type: String,
|
|
default: '/',
|
|
},
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.brand {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.brand-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
font-weight: bold;
|
|
color: #000;
|
|
padding: 8px 20px 8px 0;
|
|
font-size: 24px;
|
|
text-decoration: none;
|
|
transition: color 0.2s;
|
|
}
|
|
|
|
.brand-link:hover {
|
|
color: #333;
|
|
}
|
|
|
|
.brand-logo {
|
|
display: block;
|
|
flex-shrink: 0;
|
|
width: 32px;
|
|
height: 32px;
|
|
object-fit: contain;
|
|
}
|
|
|
|
.brand-text {
|
|
line-height: 1;
|
|
}
|
|
</style>
|