TeaSanctuary/teasanctuary.ru
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

6
src/lib/components/SocialButton.svelte
View file

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

16
src/lib/components/SocialHyperlink.svelte
View file

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

18
src/lib/util/IconResolver.ts → src/lib/util/LinkResolver.ts
View file

@ -63,3 +63,21 @@ export function tryGetIcon(link: string): string {
return getIconFromUrl(url) ?? icons['none']; 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";
}