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-02-28 06:50:05 +03:00
parent 203b2d8403
commit 1f3ea5bbc3
2 changed files with 9 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { MediaQuery } from 'svelte/reactivity';
import HoverIcon from './HoverIcon.svelte'; import HoverIcon from './HoverIcon.svelte';
export let href: string; export let href: string;
@ -6,6 +7,8 @@
export { className as class }; export { className as class };
export let customIcon: string | null = null; export let customIcon: string | null = null;
const sm = new MediaQuery('width >= 40rem', false);
let url: URL; let url: URL;
let host: string; let host: string;
@ -54,15 +57,15 @@
} }
</script> </script>
<a {href} class="{className} inline-block ml-1 mr-1 group" target="_blank"> <a {href} class="{className} inline-block group" target="_blank">
<span class="inline-block size-8 shrink-0 rounded-xl bg-emerald-800 p-1 align-bottom transition-all group-hover:scale-110"> <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 <HoverIcon
src={customIcon ?? tryGetIcon(href)} src={customIcon ?? tryGetIcon(href)}
text={host} text={host}
size={24} size={sm.current ? 24 : 20}
/> />
</span> </span>
<span class="items-center justify-center rounded-r-xl text-emerald-900 underline"> <span class="text-emerald-900 underline">
<slot /> <slot />
</span> </span>
</a> </a>

4
src/routes/+page.svelte
View file

@ -141,7 +141,7 @@
class="flex w-5xl max-w-screen flex-col flex-nowrap gap-12 p-2 px-2 pt-12 pb-12 text-base sm:text-xl" class="flex w-5xl max-w-screen flex-col flex-nowrap gap-12 p-2 px-2 pt-12 pb-12 text-base sm:text-xl"
> >
<section id="who-are-we"> <section id="who-are-we">
<h1 class="font-disket mb-4 text-5xl font-bold sm:text-8xl">Кто мы?</h1> <h1 class="font-disket mb-4 text-2xl font-bold sm:text-4xl">Кто мы?</h1>
<div class="text-justify"> <div class="text-justify">
<b>Tea Sanctuary</b> &mdash; это в первую очередь коллектив друзей, разрабатывающих проекты <b>Tea Sanctuary</b> &mdash; это в первую очередь коллектив друзей, разрабатывающих проекты
для души, для всеобщего пользования и даже на заказ. С <b>8 июля 2018 года</b> мы ведём публичную для души, для всеобщего пользования и даже на заказ. С <b>8 июля 2018 года</b> мы ведём публичную
@ -155,7 +155,7 @@
</div> </div>
</section> </section>
<section id="what-are-we-doing"> <section id="what-are-we-doing">
<h1 class="font-disket mb-4 text-5xl font-bold sm:text-8xl">Что делаем?</h1> <h1 class="font-disket mb-4 text-2xl font-bold sm:text-4xl">Что делаем?</h1>
<div class="text-justify"> <div class="text-justify">
Наша главная страсть &mdash; это, конечно, видеоигры. Мы часто участвуем в так называемых Наша главная страсть &mdash; это, конечно, видеоигры. Мы часто участвуем в так называемых
"гейм джемах" &mdash; конкурсах на разработку игр. Наши игры вы можете оценить здесь: "гейм джемах" &mdash; конкурсах на разработку игр. Наши игры вы можете оценить здесь: