<template>
    <section v-if="Object.keys(locales).length >= 3">
        <h2 class="mb-3">
            <Icon v="language"/>
            <T>links.languageVersions</T>
        </h2>
        <ul class="list-unstyled" style="column-count: 2;">
            <li v-for="(options, locale) in locales" :key="locale" v-if="locale !== config.locale" class="mb-1">
                <a :href="options.url">
                    <Icon v="long-arrow-right"/>
                    <!--<LocaleIcon :locale="options" class="me-1"/>-->
                    {{options.name}}
                    <small v-if="options.extra" class="text-muted">({{options.extra}})</small>
                </a>
            </li>
            <li>
                <LocaleLink locale="en" link="/new-version" class="small">
                    <Icon v="plus"/>
                    <T>localise.shorter</T>
                </LocaleLink>
            </li>
        </ul>
    </section>
</template>
