index/components/blocks/Flooter.vue

60 lines
1.1 KiB
Vue

<script setup lang="ts">
const props = defineProps({
opaque: Boolean,
})
const config = useAppConfig()
const currentYear = new Date().getFullYear()
</script>
<template>
<footer
class="user-select-none pass-through text-align-center line-height-1-5"
>
<span
class="font-small"
:class="{
'footer-transparent': !props.opaque,
'text-shadow': !props.opaque,
}"
>
© 2018-{{ currentYear }},
<a
:class="{
'link-hi-force-dark': !props.opaque,
'link-hi': props.opaque,
}"
:href="config.url"
>Enderman</a
>. All rights reserved.
<wbr />
<sub class="nobr">
β{{ config.build.version ? config.build.version : '?.?.?' }} ({{
config.build.date ? config.build.date : '1970-01-01'
}})
</sub>
</span>
</footer>
</template>
<style scoped lang="scss">
.footer-transparent {
color: white;
opacity: 0.25;
transition: ease 0.3s;
&:hover {
opacity: 1;
}
}
.line-height-1-5 {
line-height: 14px * 1.5;
}
.text-shadow {
text-shadow: black 0 2px 5px;
}
</style>