feat(i18n): add translations for the new languages (de, es, fr, it, CJK)

assets/scss/_core/_typography.scss

@@ -17,7 +17,7 @@ body {
   }
 }
 
-body:lang(en) {
+body:lang(en, de, es, fr, it) {
   font-family: 'Geist', sans-serif;
 }
 

assets/ts/desktop/stageNav.ts

@@ -15,23 +15,24 @@ type NavItem = (typeof navItems)[number]
  * variables
  */
 
-const navItems = ['prev', 'close', 'next'] as const
+const mainDiv = document.getElementById('main') as HTMLDivElement
+const navItems = [
+  mainDiv.getAttribute('prevText') as string,
+  mainDiv.getAttribute('closeText') as string,
+  mainDiv.getAttribute('nextText') as string
+] as const
 
 /**
  * main functions
  */
 
 function handleClick(type: NavItem): void {
-  switch (type) {
-    case 'prev':
-      prevImage()
-      break
-    case 'close':
-      minimizeImage()
-      break
-    case 'next':
-      nextImage()
-      break
+  if (type === navItems[0]) {
+    prevImage()
+  } else if (type === navItems[1]) {
+    minimizeImage()
+  } else {
+    nextImage()
   }
 }
 

assets/ts/mobile/gallery.ts

@@ -4,7 +4,13 @@ import { type Swiper } from 'swiper'
 import { container } from '../container'
 import { type ImageJSON } from '../resources'
 import { setIndex, state } from '../state'
-import { Watchable, expand, loadGsap, loadSwiper } from '../utils'
+import {
+  Watchable,
+  capitalizeFirstLetter,
+  expand,
+  loadGsap,
+  loadSwiper
+} from '../utils'
 
 import { mounted } from './mounted'
 import { scrollable } from './scroll'
@@ -214,7 +220,10 @@ function createGallery(ijs: ImageJSON[]): void {
   )
   // close
   const _close = document.createElement('div')
-  _close.innerText = 'Close'
+  const str: string = document
+    .getElementById('main')
+    ?.getAttribute('closeText') as string
+  _close.innerText = capitalizeFirstLetter(str)
   _close.addEventListener(
     'click',
     () => {