docs: v2.3.0 - CHANGELOG ve README güncellendi

- Dark mode özellikleri eklendi
- Loading bar sistemi dokümante edildi
- Dil ikonları açıklaması eklendi
- Yeni componentler listelendi
- Versiyon 2.3.0'a yükseltildi
- Teknoloji stack'i güncellendi (next-themes, nprogress)

Author: ibidi

CHANGELOG.md

@@ -2,6 +2,72 @@
 
 Tüm önemli değişiklikler bu dosyada belgelenecektir.
 
+## [2.3.0] - 2025-10-29
+
+### 🎨 Dark Mode & UI İyileştirmeleri
+
+#### Added (Eklenenler)
+- 🌙 **Dark Mode Desteği** - Tam dark mode implementasyonu
+  - ThemeProvider ile next-themes entegrasyonu
+  - System tema desteği (otomatik light/dark)
+  - ThemeToggle butonu (Header'da)
+  - Tüm sayfalarda dark mode desteği
+  - Smooth geçişler (disableTransitionOnChange)
+- 🎯 **Loading Bar Sistemi** - Sayfa geçişlerinde modern loading
+  - NProgress kütüphanesi entegrasyonu
+  - Gradient animasyonlu loading bar
+  - Dark mode uyumlu (siyah/beyaz)
+  - Browser back/forward desteği
+  - Suspense boundary ile SSG uyumlu
+  - Smooth animasyonlar ve blur efektleri
+- 🎨 **Dil İkonları** - Programlama dilleri için SVG ikonlar
+  - Python, JavaScript, Batch, Bash, PowerShell ikonları
+  - Ana sayfa ve kategori sayfalarında görünüyor
+  - Dark mode uyumlu renkler
+
+#### Changed (Değişiklikler)
+- 🌙 **Tüm Sayfalar Dark Mode**
+  - Ana sayfa (Hero, araç kartları, pagination)
+  - Kategori sayfaları (başlık, araç kartları)
+  - Araç detay sayfaları
+  - Araç öner formu (tüm input'lar)
+  - Footer (sosyal medya ikonları)
+  - Header (navigasyon linkleri)
+- 🎨 **TextGenerateEffect**
+  - Dark mode'da text-gray-300 (daha okunabilir)
+  - Light mode'da text-gray-600
+- 🔧 **ThemeToggle İyileştirmesi**
+  - resolvedTheme desteği (system tema için)
+  - setTimeout ile setState (lint uyumlu)
+  - Icon renkleri dark mode'da doğru
+
+#### Fixed (Düzeltmeler)
+- ✅ Footer dark mode geçişi ('use client' eklendi)
+- ✅ ThemeToggle icon renkleri düzeltildi
+- ✅ Category sayfası dark mode desteği eklendi
+- ✅ Ana sayfa açıklama metni dark mode'da okunabilir
+- ✅ Araç öner formu dark mode desteği
+- ✅ ThemeToggle lint hatası (setState in effect)
+- ✅ PageLoadingBar Suspense boundary eklendi
+
+#### Technical
+- 📦 Yeni bağımlılıklar:
+  - `next-themes` - Dark mode yönetimi
+  - `nprogress` - Loading bar
+  - `@types/nprogress` - TypeScript types
+- 🎨 Yeni componentler:
+  - `components/ThemeProvider.tsx` - Theme context
+  - `components/ThemeToggle.tsx` - Theme switch button
+  - `components/PageLoadingBar.tsx` - Loading bar
+  - `components/NavigationEvents.tsx` - Navigation listener
+  - `components/LanguageIcon.tsx` - Language icons
+- 🎨 Yeni CSS:
+  - `app/nprogress.css` - Loading bar styles
+  - Gradient animations
+  - Dark mode variants
+
+---
+
 ## [2.2.0] - 2025-10-29
 
 ### 🚀 Major Features

README.md

@@ -11,8 +11,11 @@ Modern, minimal ve responsive bir web sitesi ile IT araçlarını sergileyin. Py
 ## 🎯 Özellikler
 
 - ✅ **Modern Tasarım** - Minimal siyah-beyaz tema
+- ✅ **Dark Mode** - Otomatik sistem teması desteği ile tam dark mode
+- ✅ **Loading Bar** - Sayfa geçişlerinde gradient animasyonlu loading
 - ✅ **Animasyonlu Hero** - Framer Motion ile dinamik metin animasyonları
 - ✅ **Araç İstek Sistemi** - Telegram bot entegrasyonu ile araç önerileri
+- ✅ **Dil İkonları** - Python, JavaScript, Batch, Bash, PowerShell ikonları
 - ✅ **Responsive** - Mobil, tablet, desktop uyumlu
 - ✅ **Kod Gösterimi** - Syntax highlighting ve kopyalama özelliği
 - ✅ **Modal Animasyonları** - Yumuşak açılış/kapanış efektleri
@@ -92,9 +95,15 @@ Araç istek sistemi için Telegram bot kurulumu:
 │   └── category/[slug]/       # Kategori sayfaları
 ├── components/                 # React bileşenleri
 │   ├── ui/                    # UI components
-│   │   └── layout-text-flip.tsx  # Animasyonlu metin
+│   │   ├── layout-text-flip.tsx  # Animasyonlu metin
+│   │   └── text-generate-effect.tsx  # Text animation
 │   ├── Header.tsx             # Navigation
 │   ├── Footer.tsx             # Footer
+│   ├── ThemeProvider.tsx      # Dark mode provider
+│   ├── ThemeToggle.tsx        # Theme switch button
+│   ├── PageLoadingBar.tsx     # Loading bar
+│   ├── NavigationEvents.tsx   # Navigation listener
+│   ├── LanguageIcon.tsx       # Language icons
 │   ├── CodeModal.tsx          # Kod modal (animasyonlu)
 │   └── CodeModalButton.tsx    # Modal trigger
 ├── lib/                       # Yardımcı fonksiyonlar
@@ -131,6 +140,8 @@ Araç istek sistemi için Telegram bot kurulumu:
 - **Language**: [TypeScript 5](https://www.typescriptlang.org/)
 - **Styling**: [Tailwind CSS 4](https://tailwindcss.com/)
 - **Animation**: [Framer Motion](https://www.framer.com/motion/)
+- **Theme**: [next-themes](https://github.com/pacocoursey/next-themes)
+- **Loading**: [NProgress](https://ricostacruz.com/nprogress/)
 - **Icons**: [Lucide React](https://lucide.dev/)
 - **Deployment**: [Vercel](https://vercel.com/)
 

components/PageLoadingBar.tsx

@@ -5,30 +5,30 @@ import { usePathname, useSearchParams } from 'next/navigation'
 import NProgress from 'nprogress'
 
 function LoadingBarContent() {
-  const pathname = usePathname()
-  const searchParams = useSearchParams()
+    const pathname = usePathname()
+    const searchParams = useSearchParams()
 
-  useEffect(() => {
-    NProgress.configure({ 
-      showSpinner: false,
-      trickleSpeed: 200,
-      minimum: 0.08,
-      easing: 'ease',
-      speed: 500,
-    })
-  }, [])
+    useEffect(() => {
+        NProgress.configure({
+            showSpinner: false,
+            trickleSpeed: 200,
+            minimum: 0.08,
+            easing: 'ease',
+            speed: 500,
+        })
+    }, [])
 
-  useEffect(() => {
-    NProgress.done()
-  }, [pathname, searchParams])
+    useEffect(() => {
+        NProgress.done()
+    }, [pathname, searchParams])
 
-  return null
+    return null
 }
 
 export default function PageLoadingBar() {
-  return (
-    <Suspense fallback={null}>
-      <LoadingBarContent />
-    </Suspense>
-  )
+    return (
+        <Suspense fallback={null}>
+            <LoadingBarContent />
+        </Suspense>
+    )
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "it-toolkit-showcase",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "description": "Modern web showcase for IT tools - Network, System, Security & Automation scripts",
   "author": "İhsan Baki Doğan <https://ihsanbakidogan.com>",
   "license": "MIT",