glyphdiff.com/frontend-svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: replace arbitrary text sizes in FontSampler, TypographyMenu; fix font token in SectionTitle

Browse Source
This commit is contained in:
Ilia Mashkov
2026-04-17 09:42:24 +03:00
parent 7b46e06f8b
commit 0ebf75b24e
3 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/features/DisplayFont/ui/FontSampler/FontSampler.svelte
View File

@@ -82,7 +82,7 @@ const stats = $derived([
> >
<!-- Left: index · name · type badge · provider badge --> <!-- Left: index · name · type badge · provider badge -->
<div class="flex items-center gap-2 sm:gap-4 min-w-0 shrink-0"> <div class="flex items-center gap-2 sm:gap-4 min-w-0 shrink-0">
<span class="font-mono text-[0.625rem] tracking-widest text-neutral-400 uppercase leading-none shrink-0"> <span class="font-mono text-2xs tracking-widest text-neutral-400 uppercase leading-none shrink-0">
{String(index + 1).padStart(2, '0')} {String(index + 1).padStart(2, '0')}
</span> </span>
<Divider orientation="vertical" class="h-3 shrink-0" /> <Divider orientation="vertical" class="h-3 shrink-0" />
@@ -147,7 +147,7 @@ const stats = $derived([
<!-- ── Mobile stats footer (md:hidden — header stats take over above) --> <!-- ── Mobile stats footer (md:hidden — header stats take over above) -->
<div class="md:hidden px-4 sm:px-5 py-1.5 sm:py-2 border-t border-subtle flex gap-2 sm:gap-4 bg-paper dark:bg-dark-card mt-auto"> <div class="md:hidden px-4 sm:px-5 py-1.5 sm:py-2 border-t border-subtle flex gap-2 sm:gap-4 bg-paper dark:bg-dark-card mt-auto">
{#each stats as stat, i} {#each stats as stat, i}
<Footnote class="text-[0.4375rem] sm:text-[0.5rem] tracking-wider {i === 0 ? 'ml-auto' : ''}"> <Footnote class="text-5xs sm:text-4xs tracking-wider {i === 0 ? 'ml-auto' : ''}">
{stat.label}:{stat.value} {stat.label}:{stat.value}
</Footnote> </Footnote>
{#if i < stats.length - 1} {#if i < stats.length - 1}

4
src/features/SetupFont/ui/TypographyMenu/TypographyMenu.svelte
View File

@@ -113,7 +113,7 @@ $effect(() => {
<div class="flex items-center gap-1.5"> <div class="flex items-center gap-1.5">
<Settings2Icon size={12} class="text-swiss-red" /> <Settings2Icon size={12} class="text-swiss-red" />
<span <span
class="text-[0.5625rem] font-mono uppercase tracking-widest font-bold text-swiss-black dark:text-neutral-200" class="text-3xs font-mono uppercase tracking-widest font-bold text-swiss-black dark:text-neutral-200"
> >
CONTROLS CONTROLS
</span> </span>
@@ -166,7 +166,7 @@ $effect(() => {
class="text-swiss-red" class="text-swiss-red"
/> />
<span <span
class="text-[0.5625rem] md:text-[0.625rem] font-mono uppercase tracking-widest font-bold hidden sm:inline whitespace-nowrap" class="text-3xs md:text-2xs font-mono uppercase tracking-widest font-bold hidden sm:inline whitespace-nowrap"
> >
GLOBAL_CONTROLS GLOBAL_CONTROLS
</span> </span>

2
src/shared/ui/Section/SectionTitle/SectionTitle.svelte
View File

@@ -13,7 +13,7 @@ interface Props {
const { text }: Props = $props(); const { text }: Props = $props();
</script> </script>
{#if text} {#if text}
<h2 class="text-3xl md:text-4xl lg:text-5xl font-['Space_Grotesk'] font-bold text-swiss-black dark:text-neutral-200 tracking-tight"> <h2 class="text-3xl md:text-4xl lg:text-5xl font-primary font-bold text-swiss-black dark:text-neutral-200 tracking-tight">
{text} {text}
</h2> </h2>
{/if} {/if}