TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-24 05:05:20 -04:00
Code Issues Packages Projects Releases Wiki Activity

<LanguageMap> put it below locale list, some styling

Browse Source
This commit is contained in:
Valentyne Stigloher 2024-05-26 15:22:11 +02:00
parent 7cbf78f18e
commit c9a6765011
2 changed files with 21 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/LanguageMap.vue
View File

@ -11,6 +11,8 @@ import walsLanguages from '../assets/languages.csv';
import locales from '../locale/locales.ts';
import { clearUrl } from '~/src/helpers.ts';
const MOBILE_BREAKPOINT = 992;
const localesByWalsCode = locales.reduce((acc, language) => {
if (language.walsCode && language.published) {
acc[language.walsCode] = language;
@ -33,12 +35,8 @@ export default dark.extend({
'https://tinyworldmap.com/dist/v3/tiny-world-borders.js',
);
var map = window.L.map('map', { attributionControl: false }).setView([45, 15], 3);
// alternatively, for full-width map:
// typeof(window) !== 'undefined' && window.innerWidth < MOBILE_BREAKPOINT
// ? [45, 15]
// : [40, 65],
const pos = window.innerWidth < MOBILE_BREAKPOINT ? [45, 15] : [40, 65];
const map = window.L.map('map', { attributionControl: false }).setView(pos, 3);
window.L.control.attribution({ position: 'bottomright' })
.addAttribution('&copy; <a href="https://doi.org/10.5281/zenodo.7385533" target="_blank" title="Dryer, Matthew S. & Haspelmath, Martin (eds.) 2013. The World Atlas of Language Structures Online. Leipzig: Max Planck Institute for Evolutionary Anthropology.">WALS</a>')

36
routes/select.vue
View File

@ -1,26 +1,24 @@
<template>
<Page>
<div class="row flex-md-row-reverse">
<div class="col-12 col-md-6">
<LanguageMap class="my-4" />
</div>
<div class="col-12 col-md-6">
<div class="list-group my-4">
<a
v-for="(options, locale) in $locales"
:key="locale"
:href="options.url"
class="list-group-item list-group-item-action list-group-item-hoverable"
>
<div class="h3">
<LocaleIcon :locale="options" class="mx-2" />
{{ options.name }}
<small v-if="options.extra" class="text-muted">({{ options.extra }})</small>
</div>
</a>
</div>
<div class="flex-md-row-reverse">
<div class="list-group d-flex flex-wrap flex-row">
<a
v-for="(options, locale) in $locales"
:key="locale"
:href="options.url"
class="list-group-item list-group-item-action list-group-item-hoverable w-md-50"
>
<div class="h3">
<LocaleIcon :locale="options" class="mx-2" />
{{ options.name }}
<small v-if="options.extra" class="text-muted">({{ options.extra }})</small>
</div>
</a>
</div>
</div>
<template #below>
<LanguageMap />
</template>
</Page>
</template>