mirror of
https://github.com/nestriness/nestri.git
synced 2025-12-11 00:05:36 +02:00
390ee2ac0f
I have made documentation for Nestri, so everybody easy can find instructions to get started. It will also make it easier for people to help contribute to the documentation. The documentation is built with Nuxt3, [Docus ](https://github.com/nuxt-themes) which uses Nuxt Content.  
62 lines
1.3 KiB
Vue
62 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
const socials = ['twitter', 'facebook', 'instagram', 'tiktok', 'youtube', 'github', 'medium', 'reddit', 'discord']
|
|
|
|
const { config } = useDocus()
|
|
|
|
const icons = computed<any>(() => {
|
|
return Object.entries(config.value.socials || {})
|
|
.map(([key, value]) => {
|
|
if (typeof value === 'object') {
|
|
return value
|
|
} else if (typeof value === 'string' && value && socials.includes(key)) {
|
|
return {
|
|
href: /^https?:\/\//.test(value) ? value : `https://${key}.com/${value}`,
|
|
icon: `fa-brands:${key}`,
|
|
label: value,
|
|
rel: 'noopener noreferrer'
|
|
}
|
|
} else {
|
|
return null
|
|
}
|
|
})
|
|
.filter(Boolean)
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<NuxtLink
|
|
v-for="icon in icons"
|
|
:key="icon.label"
|
|
:rel="icon.rel"
|
|
:title="icon.label"
|
|
:aria-label="icon.label"
|
|
:href="icon.href"
|
|
target="_blank"
|
|
>
|
|
<Icon
|
|
v-if="icon.icon"
|
|
:name="icon.icon"
|
|
/>
|
|
</NuxtLink>
|
|
</template>
|
|
|
|
<style lang="ts" scoped>
|
|
css({
|
|
a: {
|
|
display: 'flex',
|
|
color: '{color.gray.500}',
|
|
padding: '{space.4}',
|
|
|
|
'@dark': {
|
|
color: '{color.gray.400}'
|
|
},
|
|
|
|
'&:hover': {
|
|
color: '{color.gray.700}',
|
|
'@dark': {
|
|
color: '{color.gray.200}',
|
|
}
|
|
},
|
|
}
|
|
})
|
|
</style> |