PronounsPage/components/AcademicLinks.vue

<template>
    <section v-if="config.links.enabled && Object.keys(config.links.academic).length">
        <h2 class="mb-3">
            <Icon v="vial" />
            <T>links.academic.header</T>
        </h2>
        <section v-if="$te('links.academic.intro')">
            <T>links.academic.intro</T>
            <div v-if="$te('links.academic.discord')" class="alert alert-info">
                <p class="mb-0">
                    <Icon v="comments" :size="2" class="float-start me-2 my-2" />
                    <T>links.academic.discord</T>
                </p>
            </div>
            <Separator icon="list" />
        </section>
        <section v-for="section in config.links.academic">
            <h3 v-if="section.name">
                {{ section.name }}
            </h3>
            <ul class="list-unstyled">
                <LinkEntry v-for="link in section.entries" :key="link.url" :link="link" />
            </ul>
        </section>
    </section>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

import useConfig from '../composables/useConfig.ts';

export default defineComponent({
    setup() {
        return {
            config: useConfig(),
        };
    },
});
</script>