Header visualization

messages/en.json

@@ -5,6 +5,11 @@
     "about": "About",
     "contact": "Contact",
     "showcase": "Showcase",
-    "blog": "Blog"
+    "blog": "Blog",
+    "usecases": "Use cases",
+    "offers": "Offers",
+    "careers": "Careers",
+    "jobs": "Jobs",
+    "news": "News"
   }
 }

messages/ru.json

@@ -1,10 +1,15 @@
 {
   "Brand": "FlakeForge",
   "Layout": {
-    "home": "Home",
-    "about": "About",
-    "contact": "Contact",
-    "showcase": "Showcase",
-    "blog": "Blog"
+    "home": "Главная",
+    "about": "О нас",
+    "contact": "Контакты",
+    "showcase": "Витрина",
+    "blog": "Блог",
+    "usecases": "Примеры использования",
+    "offers": "Предложения",
+    "careers": "Карьера",
+    "jobs": "Вакансии",
+    "news": "Новости"
   }
 }

messages/uz.json

@@ -1,10 +1,15 @@
 {
   "Brand": "FlakeForge",
   "Layout": {
-    "home": "Home",
-    "about": "About",
-    "contact": "Contact",
-    "showcase": "Showcase",
-    "blog": "Blog"
+    "home": "Bosh sahifa",
+    "about": "Haqida",
+    "contact": "Aloqa",
+    "showcase": "Ko‘rgazma",
+    "blog": "Blog",
+    "usecases": "Qo‘llanilish holatlari",
+    "offers": "Takliflar",
+    "careers": "Karyeralar",
+    "jobs": "Ish o‘rinlari",
+    "news": "Yangiliklar"
   }
 }

package.json

@@ -24,6 +24,7 @@
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "gsap": "^3.13.0",
+    "lucide-react": "^0.511.0",
     "next": "15.3.2",
     "next-intl": "^4.1.0",
     "next-themes": "^0.4.6",

src/shared/config/index.ts

@@ -0,0 +1 @@
+export * from './routes'

src/shared/config/routes.ts

@@ -0,0 +1,8 @@
+export const ROUTES = {
+  HOME: '/',
+  ABOUT: '/about',
+  NEWS: '/news',
+  SHOWCASE: '/showcase',
+  BLOG: '/blog',
+  CONTACT: '/contact',
+}

src/shared/styles/globals.css

@@ -3,26 +3,28 @@
 @theme {
   /* Light mode colors */
   --color-primary: #FF4C24;
+  --color-foreground: #000000;
   --color-secondary: #34a853;
   --color-background: #ffffff;
   --color-text: #000000;
   --color-destructive: #ef4444;
   --color-accent: #f1f5f9;
-  --color-input: #d1d5db;
+  --color-input: #c4c4c4;
   --color-ring: #3b82f6;
 
   /* Dark mode colors */
   --color-primary-dark: #FF4C24;
+  --color-foreground-dark: #e5e5e5;
   --color-secondary-dark: #4ade80;
-  --color-background-dark: #030303;
-  --color-text-dark: #ffffff;
+  --color-background-dark: #0a0a0a;
+  --color-text-dark: #e5e5e5;
   --color-destructive-dark: #dc2626;
   --color-accent-dark: #1e293b;
   --color-input-dark: #4b5563;
   --color-ring-dark: #60a5fa;
 
-  /* fonts */
-  --font-sans: 'Markdisc', sans-serif;
+  /* Fonts */
+  --font-sans: 'Orkney', sans-serif;
 }
 
 @layer base {
@@ -31,7 +33,7 @@
     --primary: var(--color-primary);
     --secondary: var(--color-secondary);
     --background: var(--color-background);
-    --foreground: var(--color-text);
+    --foreground: var(--color-foreground);
     --destructive: var(--color-destructive);
     --accent: var(--color-accent);
     --input: var(--color-input);
@@ -46,7 +48,7 @@
     --primary: var(--color-primary-dark);
     --secondary: var(--color-secondary-dark);
     --background: var(--color-background-dark);
-    --foreground: var(--color-text-dark);
+    --foreground: var(--color-foreground-dark);
     --destructive: var(--color-destructive-dark);
     --accent: var(--color-accent-dark);
     --input: var(--color-input-dark);
@@ -60,12 +62,11 @@
   body {
     background-color: var(--background);
     color: var(--foreground);
-    @apply antialiased font-sans;
+    @apply antialiased font-sans border-input;
     transition: background-color 0.3s ease, color 0.3s ease;
   }
 }
 
-/* Add this at the top of your CSS file */
 @font-face {
   font-family: 'Orkney';
   src: url('public/fonts/Orkney-Light.woff2') format('woff2');

src/shared/types/index.ts

@@ -0,0 +1 @@
+export type { LocalesType } from './locale'

src/shared/types/locale.ts

@@ -0,0 +1 @@
+export type LocalesType = 'en' | 'ru' | 'uz'