1
0
mirror of https://github.com/ZeroCatDev/Classworks.git synced 2025-07-03 17:59:23 +00:00
Classworks/src/components/AppFooter.vue
2024-11-24 16:57:03 +08:00

65 lines
1.4 KiB
Vue

<template>
<v-footer height="40" app>
<a
v-for="item in items"
:key="item.title"
:href="item.href"
:title="item.title"
class="d-inline-block mx-2 social-link"
rel="noopener noreferrer"
target="_blank"
>
<v-icon
:icon="item.icon"
:size="item.icon === 'mdi-earth' ? 24 : 16"
/>
</a>
<div
class="text-caption text-disabled"
style="position: absolute; right: 16px;"
>
&copy; 2020-{{ (new Date()).getFullYear() }} <span class="d-none d-sm-inline-block">SunWuyuan</span>
<a
class="text-decoration-none on-surface"
href="https://github.com/sunwuyuan/homeworkpage-frontend"
rel="noopener noreferrer"
target="_blank"
>
HomeworkPage
</a>
</div>
</v-footer>
</template>
<script setup>
const items = [
{
title: '孙悟远',
icon: `mdi-earth`,
href: 'https://wuyuan.dev',
},
{
title: 'ZeroCat',
icon: 'mdi-xml',
href: 'https://zerocat.houlangs.com',
},
{
title: 'GitHub',
icon: 'mdi-github',
href: 'https://github.com/sunwuyuan/homeworkpage-frontend',
}
]
</script>
<style scoped lang="sass">
.social-link :deep(.v-icon)
color: rgba(var(--v-theme-on-background), var(--v-disabled-opacity))
text-decoration: none
transition: .2s ease-in-out
&:hover
color: rgba(25, 118, 210, 1)
</style>