Ссылки по самому сайту теперь не открывают новую вкладку

This commit is contained in:
Иван Кузьменко 2025-07-12 11:35:34 +03:00
parent e6cc0ef138
commit 778219127c
3 changed files with 30 additions and 12 deletions

View file

@ -1,5 +1,5 @@
<script lang="ts">
import { tryGetIcon } from '$lib/util/IconResolver';
import { isLinkLocal, tryGetIcon } from '$lib/util/LinkResolver';
import HoverIcon from './HoverIcon.svelte';
export let href: string;
@ -10,8 +10,8 @@
<a
{href}
class="{className} drop-shadow-2xl flex flex-row transition-all hover:scale-110"
target="_blank"
class="{className} flex flex-row drop-shadow-2xl transition-all hover:scale-110"
target={isLinkLocal(href) ? '_self' : '_blank'}
>
<div class="shrink-0 rounded-l-xl bg-slate-800 p-2">
<HoverIcon src={customIcon ?? tryGetIcon(href)} class="text-sm uppercase" text={href} />

View file

@ -1,7 +1,7 @@
<script lang="ts">
import { MediaQuery } from 'svelte/reactivity';
import HoverIcon from './HoverIcon.svelte';
import { tryGetIcon } from '$lib/util/IconResolver';
import { isLinkLocal, tryGetIcon } from '$lib/util/LinkResolver';
export let href: string;
let className: string = '';
@ -11,17 +11,17 @@
const sm = new MediaQuery('width >= 40rem', false);
</script>
<a {href} class="{className} inline-block group" target="_blank">
<span class="inline-block {sm.current ? 'size-8 rounded-xl p-1' : 'size-6 rounded-sm p-0.5'} bg-emerald-800 align-bottom transition-all group-hover:scale-110">
<HoverIcon
src={customIcon ?? tryGetIcon(href)}
text={href}
size={sm.current ? 24 : 20}
/>
<a {href} class="{className} group inline-block" target={isLinkLocal(href) ? '_self' : '_blank'}>
<span
class="inline-block {sm.current
? 'size-8 rounded-xl p-1'
: 'size-6 rounded-sm p-0.5'} bg-emerald-800 align-bottom transition-all group-hover:scale-110"
>
<HoverIcon src={customIcon ?? tryGetIcon(href)} text={href} size={sm.current ? 24 : 20} />
</span>
<span class="text-emerald-900 underline">
<slot />
</span>
</a>
<style></style>
<style></style>

View file

@ -62,4 +62,22 @@ export function tryGetIcon(link: string): string {
}
return getIconFromUrl(url) ?? icons['none'];
}
/**
* Проверка на "локальность" ссылки - принадлежность её этому сайту. Используется, например,
* в социальных ссылках, чтобы не открывать новую вкладку для страниц сайта.
* @param link Локальная либо глобальная ссылка
* @returns true, если ссылка не ведёт за пределы сайта
*/
export function isLinkLocal(link: string): boolean {
let url: URL;
try {
url = new URL(link);
} catch {
return true;
}
// Поддомены teasanctuary.ru должны всегда быть "внешними"
return url.hostname === "" || url.hostname === "teasanctuary.ru";
}