steven/gpx.studio
1
0
Fork 0
mirror of https://github.com/gpxstudio/gpx.studio.git synced 2025-09-02 16:52:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

rework links

Browse Source
This commit is contained in:
vcoppe
2024-07-08 23:22:37 +02:00
parent ad7ff5ddba
commit 04447f4034
7 changed files with 37 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
website/src/lib/components/Footer.svelte
View File

@@ -28,7 +28,7 @@
<Button <Button
variant="link" variant="link"
class="h-6 px-0 text-muted-foreground" class="h-6 px-0 text-muted-foreground"
href={getURLForLanguage('/[...language]', $locale)} href={getURLForLanguage($locale, '/')}
> >
<Home size="16" class="mr-1" /> <Home size="16" class="mr-1" />
{$_('homepage.home')} {$_('homepage.home')}
@@ -36,7 +36,7 @@
<Button <Button
variant="link" variant="link"
class="h-6 px-0 text-muted-foreground" class="h-6 px-0 text-muted-foreground"
href={getURLForLanguage('/[...language]/app', $locale)} href={getURLForLanguage($locale, '/app')}
> >
<Map size="16" class="mr-1" /> <Map size="16" class="mr-1" />
{$_('homepage.app')} {$_('homepage.app')}
@@ -44,7 +44,7 @@
<Button <Button
variant="link" variant="link"
class="h-6 px-0 text-muted-foreground" class="h-6 px-0 text-muted-foreground"
href={getURLForLanguage('/[...language]/help', $locale)} href={getURLForLanguage($locale, '/help')}
> >
<BookOpenText size="16" class="mr-1" /> <BookOpenText size="16" class="mr-1" />
{$_('menu.help')} {$_('menu.help')}

5
website/src/lib/components/LanguageSelect.svelte
View File

@@ -1,5 +1,4 @@
<script lang="ts"> <script lang="ts">
import { page } from '$app/stores';
import * as Select from '$lib/components/ui/select'; import * as Select from '$lib/components/ui/select';
import { languages } from '$lib/languages'; import { languages } from '$lib/languages';
import { getURLForLanguage } from '$lib/utils'; import { getURLForLanguage } from '$lib/utils';
@@ -26,7 +25,7 @@
</Select.Trigger> </Select.Trigger>
<Select.Content> <Select.Content>
{#each Object.entries(languages) as [lang, label]} {#each Object.entries(languages) as [lang, label]}
<a href={getURLForLanguage($page.route.id, lang)}> <a href={getURLForLanguage(lang)}>
<Select.Item value={lang}>{label}</Select.Item> <Select.Item value={lang}>{label}</Select.Item>
</a> </a>
{/each} {/each}
@@ -36,7 +35,7 @@
<!-- hidden links for svelte crawling --> <!-- hidden links for svelte crawling -->
<div class="hidden"> <div class="hidden">
{#each Object.entries(languages) as [lang, label]} {#each Object.entries(languages) as [lang, label]}
<a href={getURLForLanguage($page.route.id, lang)}> <a href={getURLForLanguage(lang)}>
{label} {label}
</a> </a>
{/each} {/each}

7
website/src/lib/components/Menu.svelte
View File

@@ -73,7 +73,6 @@
import { mode, setMode, systemPrefersMode } from 'mode-watcher'; import { mode, setMode, systemPrefersMode } from 'mode-watcher';
import { _, locale } from 'svelte-i18n'; import { _, locale } from 'svelte-i18n';
import { languages } from '$lib/languages'; import { languages } from '$lib/languages';
import { page } from '$app/stores';
import { getURLForLanguage } from '$lib/utils'; import { getURLForLanguage } from '$lib/utils';
const { const {
@@ -125,7 +124,7 @@
<div <div
class="w-fit flex flex-row items-center justify-center p-1 bg-background rounded-b-md md:rounded-md pointer-events-auto shadow-md" class="w-fit flex flex-row items-center justify-center p-1 bg-background rounded-b-md md:rounded-md pointer-events-auto shadow-md"
> >
<a href={getURLForLanguage('/[...language]', $locale)} target="_blank"> <a href={getURLForLanguage($locale, '/')} target="_blank">
<Logo class="h-5 mt-0.5 mx-2 md:hidden" iconOnly={true} /> <Logo class="h-5 mt-0.5 mx-2 md:hidden" iconOnly={true} />
<Logo class="h-5 mt-0.5 mx-2 hidden md:block" /> <Logo class="h-5 mt-0.5 mx-2 hidden md:block" />
</a> </a>
@@ -366,7 +365,7 @@
<Menubar.SubContent> <Menubar.SubContent>
<Menubar.RadioGroup bind:value={$locale}> <Menubar.RadioGroup bind:value={$locale}>
{#each Object.entries(languages) as [lang, label]} {#each Object.entries(languages) as [lang, label]}
<a href={getURLForLanguage($page.route.id, lang)}> <a href={getURLForLanguage(lang)}>
<Menubar.RadioItem value={lang}>{label}</Menubar.RadioItem> <Menubar.RadioItem value={lang}>{label}</Menubar.RadioItem>
</a> </a>
{/each} {/each}
@@ -417,7 +416,7 @@
<div class="h-fit flex flex-row items-center ml-1 gap-1"> <div class="h-fit flex flex-row items-center ml-1 gap-1">
<Button <Button
variant="ghost" variant="ghost"
href={getURLForLanguage('/[...language]/help', $locale)} href={getURLForLanguage($locale, '/help')}
target="_blank" target="_blank"
class="cursor-default h-fit rounded-sm px-3 py-0.5" class="cursor-default h-fit rounded-sm px-3 py-0.5"
> >

20
website/src/lib/components/Nav.svelte
View File

@@ -9,31 +9,19 @@
<nav class="w-full sticky top-0 bg-background z-10"> <nav class="w-full sticky top-0 bg-background z-10">
<div class="mx-6 py-2 flex flex-row items-center border-b gap-4 md:gap-8"> <div class="mx-6 py-2 flex flex-row items-center border-b gap-4 md:gap-8">
<a href={getURLForLanguage('/[...language]', $locale)} class="shrink-0 translate-y-0.5"> <a href={getURLForLanguage($locale, '/')} class="shrink-0 translate-y-0.5">
<Logo class="h-8 sm:hidden" iconOnly={true} /> <Logo class="h-8 sm:hidden" iconOnly={true} />
<Logo class="h-8 hidden sm:block" /> <Logo class="h-8 hidden sm:block" />
</a> </a>
<Button <Button variant="link" class="text-base px-0" href={getURLForLanguage($locale, '/')}>
variant="link"
class="text-base px-0"
href={getURLForLanguage('/[...language]', $locale)}
>
<Home size="18" class="mr-1.5" /> <Home size="18" class="mr-1.5" />
{$_('homepage.home')} {$_('homepage.home')}
</Button> </Button>
<Button <Button variant="link" class="text-base px-0" href={getURLForLanguage($locale, '/app')}>
variant="link"
class="text-base px-0"
href={getURLForLanguage('/[...language]/app', $locale)}
>
<Map size="18" class="mr-1.5" /> <Map size="18" class="mr-1.5" />
{$_('homepage.app')} {$_('homepage.app')}
</Button> </Button>
<Button <Button variant="link" class="text-base px-0" href={getURLForLanguage($locale, '/help')}>
variant="link"
class="text-base px-0"
href={getURLForLanguage('/[...language]/help', $locale)}
>
<BookOpenText size="18" class="mr-1.5" /> <BookOpenText size="18" class="mr-1.5" />
{$_('menu.help')} {$_('menu.help')}
</Button> </Button>

28
website/src/lib/utils.ts
View File

@@ -5,6 +5,8 @@ import type { TransitionConfig } from "svelte/transition";
import { get } from "svelte/store"; import { get } from "svelte/store";
import { map } from "./stores"; import { map } from "./stores";
import { base } from "$app/paths"; import { base } from "$app/paths";
import { browser } from "$app/environment";
import { languages } from "$lib/languages";
export function cn(...inputs: ClassValue[]) { export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs)); return twMerge(clsx(inputs));
@@ -92,16 +94,26 @@ export function setCrosshairCursor() {
setCursor('crosshair'); setCursor('crosshair');
} }
export function getURLForLanguage(route: string | null, lang: string | null | undefined): string { export function getURLForLanguage(lang: string | null | undefined, path?: string): string {
if (route === null) { let newPath = path ?? (browser ? window.location.pathname : '');
return base + '/'; let languageInPath = newPath.split('/')[1];
if (!languages.hasOwnProperty(languageInPath)) {
languageInPath = 'en';
} }
let url = route.replace('[...language]', (lang === null || lang === undefined) ? 'en' : lang).replace('/en', ''); if (languageInPath === 'en') {
if (lang === 'en') {
if (url === '') { return `${base}${newPath}`;
return base + '/';
} else { } else {
return base + url; return `${base}/${lang}${newPath}`;
}
} else {
if (lang === 'en') {
newPath = newPath.replace(`/${languageInPath}`, '');
return newPath === '' ? `${base}/` : `${base}${newPath}`;
} else {
newPath = newPath.replace(`/${languageInPath}`, `/${lang}`);
return `${base}${newPath}`;
}
} }
} }

6
website/src/routes/[...language]/+page.svelte
View File

@@ -46,17 +46,17 @@
{$_('metadata.description')} {$_('metadata.description')}
</div> </div>
<div class="w-full flex flex-row justify-center gap-3"> <div class="w-full flex flex-row justify-center gap-3">
<Button href={getURLForLanguage('/[...language]/app', $locale)} class="w-1/3 min-w-fit"> <Button href={getURLForLanguage($locale, '/app')} class="w-1/3 min-w-fit">
<Map size="18" class="mr-1.5" /> <Map size="18" class="mr-1.5" />
{$_('homepage.app')} {$_('homepage.app')}
</Button> </Button>
<Button <Button
variant="secondary" variant="secondary"
href={getURLForLanguage('/[...language]/help', $locale)} href={getURLForLanguage($locale, '/help')}
class="w-1/3 min-w-fit" class="w-1/3 min-w-fit"
> >
<BookOpenText size="18" class="mr-1.5" /> <BookOpenText size="18" class="mr-1.5" />
<span>{$_('homepage.help')}</span> <span>{$_('menu.help')}</span>
</Button> </Button>
</div> </div>
</div> </div>

4
website/src/routes/[...language]/help/+layout.svelte
View File

@@ -17,7 +17,7 @@
{#each Object.keys(guides) as guide} {#each Object.keys(guides) as guide}
<Button <Button
variant="link" variant="link"
href={getURLForLanguage(`/[...language]/help/${guide}`, $locale)} href={getURLForLanguage($locale, `/help/${guide}`)}
class="h-6 p-0 w-fit text-muted-foreground hover:text-foreground hover:no-underline font-normal hover:font-semibold items-start" class="h-6 p-0 w-fit text-muted-foreground hover:text-foreground hover:no-underline font-normal hover:font-semibold items-start"
> >
<DocsLoader path={`${guide}.svx`} titleOnly={true} /> <DocsLoader path={`${guide}.svx`} titleOnly={true} />
@@ -25,7 +25,7 @@
{#each guides[guide] as subGuide} {#each guides[guide] as subGuide}
<Button <Button
variant="link" variant="link"
href={getURLForLanguage(`/[...language]/help/${guide}/${subGuide}`, $locale)} href={getURLForLanguage($locale, `/help/${guide}/${subGuide}`)}
class="h-6 p-0 w-fit text-muted-foreground hover:text-foreground hover:no-underline font-normal hover:font-semibold items-start ml-3" class="h-6 p-0 w-fit text-muted-foreground hover:text-foreground hover:no-underline font-normal hover:font-semibold items-start ml-3"
> >
<DocsLoader path={`${guide}/${subGuide}.svx`} titleOnly={true} /> <DocsLoader path={`${guide}/${subGuide}.svx`} titleOnly={true} />