itziarZG/MyWebsite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add multi-language support (ES, CA, EN) and optimize font preloading & CLS

Browse Source
This commit is contained in:
itziarZG
2026-07-20 19:41:51 +02:00
parent 1c1da7df73
commit e9cf9a160a
5 changed files with 2673 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+15 -2
View File
@@ -29,6 +29,11 @@
},
};
</script>
<link rel="alternate" hreflang="es" href="https://www.itziarzameza.dev/index.html" />
<link rel="alternate" hreflang="ca" href="https://www.itziarzameza.dev/index-ca.html" />
<link rel="alternate" hreflang="en" href="https://www.itziarzameza.dev/index-en.html" />
<link rel="preload" href="fonts/material-symbols-outlined.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="fonts/space/space-grotesk-v22-latin-regular.woff2" as="font" type="font/woff2" crossorigin />
<link rel="stylesheet" href="css/styles.css?v=1.1" />
</head>
<body
@@ -90,7 +95,15 @@
>Contacto</a
>
</nav>
<div class="flex items-center gap-4">
<div class="flex items-center gap-3">
<!-- Language Switcher -->
<div class="flex items-center gap-1.5 glass px-3 py-1.5 rounded-full text-xs font-bold">
<span class="text-primary">ES</span>
<span class="text-slate-300 dark:text-slate-700">|</span>
<a href="index-ca.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="Català">CA</a>
<span class="text-slate-300 dark:text-slate-700">|</span>
<a href="index-en.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="English">EN</a>
</div>
<button
class="size-10 flex items-center justify-center rounded-full glass hover:bg-white/60 dark:hover:bg-white/10 transition-colors"
id="theme-toggle"
@@ -423,7 +436,7 @@
class="tab-btn px-6 py-3 rounded-xl font-bold text-sm transition-all text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-white/5"
data-tab="writing"
>
Writing
Notes
</button>
</div>