From 33db400ef320d81a1518b8178a704d421a862ac5 Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 09:41:15 +0300 Subject: [PATCH 01/12] feat: updated baseline and roadmap --- docs/poyraz-ui-v3-migration-plan.md | 380 ++++++++++++++++++++++++++++ pnpm-workspace.yaml | 12 +- 2 files changed, 386 insertions(+), 6 deletions(-) create mode 100644 docs/poyraz-ui-v3-migration-plan.md diff --git a/docs/poyraz-ui-v3-migration-plan.md b/docs/poyraz-ui-v3-migration-plan.md new file mode 100644 index 0000000..b419cb2 --- /dev/null +++ b/docs/poyraz-ui-v3-migration-plan.md @@ -0,0 +1,380 @@ +# Poyraz Portfolio — poyraz-ui v3 Migration Plan + +Bu planın amacı `poyraz-portfolio` projesini `poyraz-ui@2.x` kullanımından `poyraz-ui@3.0.0` kullanımına, mevcut sayfa düzenini ve portfolio kimliğini bozmadan geçirmek. + +Öncelik sırası: + +1. Önce paket geçişi ve build/type güvenliği. +2. Sonra mevcut layout davranışını koruma. +3. En son görsel polish ve yeni v3 tasarım yeteneklerini kontrollü ekleme. + +> Not: Bu dokümandaki tasarım iyileştirmeleri v3 geçişinden sonra ayrı küçük fazlara bölünebilir. İlk migration hedefi “çalışan ve görsel olarak kırılmamış portfolio”dur. + +--- + +## Mevcut Durum Özeti + +- Proje Next.js `16.1.6`, React `19.2.3`, Tailwind CSS v4 kullanıyor. +- `poyraz-ui` şu anda npm paketi olarak `^2.0.1` kullanılıyor. +- `app/globals.css` içinde `@import "poyraz-ui/preset.css";` zaten mevcut. +- Componentler local registry copy olarak değil, doğrudan paket exportları üzerinden kullanılıyor. +- Aktif poyraz-ui importları şu alanlarda: + - `poyraz-ui/atoms` + - `poyraz-ui/molecules` + - `poyraz-ui/organisms` + - `poyraz-ui/themes` + +Migration için avantajlı nokta: v3 tarafında kullanılan temel exportların çoğu korunmuş görünüyor. Bu nedenle geçişin büyük kısmı dependency bump + görsel/behavior doğrulama şeklinde ilerleyebilir. + +--- + +## Risk Haritası + +### Yüksek Öncelikli Riskler + +- [ ] `poyraz-ui@3.0.0` Node `>=22` istediği için local/Vercel Node versiyonu doğrulanmalı. +- [ ] `pnpm-lock.yaml` v3 dependency graph ile temiz güncellenmeli. +- [ ] `poyraz-ui/preset.css` v3 tokenları mevcut layout renklerini beklenmedik şekilde değiştirebilir. +- [ ] Card template componentleri (`NewsCard`, `ImageCard`, `ArticleCard`, `TestimonialCard`) v3’te daha modern/glassy defaultlara sahip olduğu için mevcut compact tasarımda kayma oluşturabilir. +- [ ] `CommandPalette`, `Sheet`, `Modal`, `Select`, `DropdownMenu` gibi Radix tabanlı componentlerde overlay, focus ve portal davranışı görsel olarak kontrol edilmeli. + +### Orta Öncelikli Riskler + +- [ ] `Typography` variant ölçüleri v3 tokenlarıyla farklılaşabilir. +- [ ] `Badge`, `Card`, `Button`, `Input` default radius/spacing değerleri mevcut `rounded-sm` class override’larıyla büyük ölçüde korunacak ama sayfa bazlı kontrol edilmeli. +- [ ] `AnnouncementBar` v3 animasyon ve spacing’i `AppShell` içinde ekstra yükseklik/boşluk yaratabilir. +- [ ] Mobile navbar sheet davranışı v3 overlay/close butonu nedeniyle farklı görünebilir. + +### Düşük Öncelikli Riskler + +- [ ] `src/lib/themes.ts` aktif kullanılmıyor; v3 theme exportlarıyla uyumlu kalması yeterli. +- [ ] `reactive-switcher` şu an kullanılmıyor; dark mode geçişi v3 migration kapsamına alınmamalı. +- [ ] Portfolio tasarım polish istekleri migration sonrasına bırakılmalı. + +--- + +## Faz 0 — Hazırlık ve Baseline + +Amaç: Değişiklik yapmadan önce projenin mevcut sağlığını ve migration başlangıç noktasını netleştirmek. + +### Görevler + +- [ ] `git status --short` ile mevcut dirty dosyaları not al. +- [ ] Mevcut kullanıcı değişikliklerine dokunma. +- [ ] `pnpm-workspace.yaml` içinde önceden yapılmış `allowBuilds` değişikliğini kullanıcı değişikliği olarak koru. +- [ ] Paket yöneticisi versiyonunu doğrula. +- [ ] Node versiyonunu doğrula. +- [ ] `pnpm lint` çalıştır. +- [ ] `pnpm build` çalıştır. +- [ ] Varsa mevcut lint/build uyarılarını migration öncesi baseline olarak not al. + +### Kabul Kriterleri + +- [ ] Migration öncesi proje durumu belgelenmiş olmalı. +- [ ] Mevcut build hatası varsa v3 geçişinden bağımsız olduğu anlaşılmalı. +- [ ] Kullanıcı değişiklikleri ezilmemeli. + +--- + +## Faz 1 — Dependency Geçişi + +Amaç: `poyraz-ui` paketini v3’e almak ve lockfile’ı temiz güncellemek. + +### Görevler + +- [ ] `package.json` içindeki `poyraz-ui` sürümünü `^3.0.0` yap. +- [ ] `pnpm install` ile `pnpm-lock.yaml` güncelle. +- [ ] `pnpm-lock.yaml` içinde `poyraz-ui@3.0.0` çözümlendiğini doğrula. +- [ ] `package.json` içine gerekirse Node engine eklemeyi değerlendir: + - `node >=22` + - Bu değişiklik Vercel deploy ile uyumlu olmalı. +- [ ] Vercel tarafında Node 22 kullanılacağından emin olmak için proje ayarı/notu ekle. + +### Kabul Kriterleri + +- [ ] `package.json` v3 dependency kullanıyor. +- [ ] Lockfile v3’e güncellendi. +- [ ] Paket kurulumu temiz tamamlandı. +- [ ] Kullanılmayan geçici paket/alias eklenmedi. + +--- + +## Faz 2 — Import ve API Uyumluluk Kontrolü + +Amaç: v3 sonrası TypeScript/Next build seviyesinde kırılan import veya prop kullanımlarını düzeltmek. + +### Kontrol Edilecek Import Grupları + +- [ ] `poyraz-ui/atoms` + - `Avatar` + - `Badge` + - `Button` + - `Card` + - `Input` + - `Separator` + - `Skeleton` + - `Typography` +- [ ] `poyraz-ui/molecules` + - `ArticleCard` + - `CommandPalette` + - `DropdownMenu` + - `ImageCard` + - `Modal` + - `NewsCard` + - `Pagination` + - `Select` + - `Sheet` + - `TestimonialCard` +- [ ] `poyraz-ui/organisms` + - `AnnouncementBar` +- [ ] `poyraz-ui/themes` + - `poyrazLightTheme` + - `poyrazDarkTheme` + - `poyrazThemes` + +### Görevler + +- [ ] `rg "poyraz-ui"` ile tüm kullanım noktalarını tekrar listele. +- [ ] `pnpm lint` çalıştır. +- [ ] `pnpm build` çalıştır. +- [ ] Kırılan import varsa en küçük değişiklikle düzelt. +- [ ] Kırılan prop varsa component davranışını koruyarak v3 API’ya uyarla. +- [ ] Gereksiz refactor yapma. + +### Kabul Kriterleri + +- [ ] Tüm importlar v3 exportlarıyla uyumlu. +- [ ] Type/build hatası kalmadı. +- [ ] Sayfa düzenini etkileyecek gereksiz class değişikliği yapılmadı. + +--- + +## Faz 3 — Global CSS ve Token Uyumluluğu + +Amaç: v3 preset tokenlarının portfolio genel görünümünü bozmadığını doğrulamak. + +### Görevler + +- [ ] `app/globals.css` içindeki import sırasını koru: + - `@import "tailwindcss";` + - `@import "poyraz-ui/preset.css";` +- [ ] Custom utility’leri kontrol et: + - `animate-marquee` + - `pause-on-hover` +- [ ] `bg-background`, `text-foreground`, `border-border`, `muted-foreground` gibi semantic tokenların v3 karşılığını görsel olarak kontrol et. +- [ ] Light mode temel kontrastı kontrol et. +- [ ] Dark mode aktif değilse migration kapsamında dark mode ekleme. + +### Kabul Kriterleri + +- [ ] Global CSS minimal kaldı. +- [ ] Tailwind v4 compile sorunu yok. +- [ ] Semantic tokenlar sayfa genelinde okunabilir. + +--- + +## Faz 4 — Layout ve Shell Doğrulaması + +Amaç: Site iskeletini korumak. + +### Kontrol Edilecek Dosyalar + +- [ ] `app/[locale]/layout.tsx` +- [ ] `components/app-shell.tsx` +- [ ] `components/site-navbar.tsx` +- [ ] `components/search-command.tsx` +- [ ] `components/language-switcher.tsx` + +### Görevler + +- [ ] Locale layout render zincirini kontrol et. +- [ ] `AppShell` max width ve spacing değerlerinin değişmediğini doğrula. +- [ ] `AnnouncementBar` yüksekliği ve border davranışını kontrol et. +- [ ] Desktop navbar hizasını kontrol et. +- [ ] Mobile navbar sheet aç/kapat davranışını kontrol et. +- [ ] Search command palette aç/kapat davranışını kontrol et. +- [ ] Cmd/Ctrl + K shortcut davranışını doğrula. + +### Kabul Kriterleri + +- [ ] Navbar layout bozulmadı. +- [ ] Mobile menü çalışıyor. +- [ ] Search command çalışıyor. +- [ ] Announcement bar sayfa içeriğini itip bozmadı. + +--- + +## Faz 5 — Sayfa Bazlı Görsel Regression Kontrolü + +Amaç: Mevcut portfolio düzenini v3 sonrası sayfa sayfa korumak. + +### Ana Sayfa + +- [ ] `HomeHero` kart yerleşimi korunuyor. +- [ ] `NewsCard` yükseklikleri düzgün. +- [ ] Hero görsel alanı taşmıyor. +- [ ] References marquee çalışıyor. +- [ ] Sponsor kartları hizalı. + +### About + +- [ ] Eğitim ve deneyim kartları compact kalıyor. +- [ ] Sertifika sheet açılıyor. +- [ ] Bookmark sheet açılıyor. +- [ ] Referans ve gönüllülük link kartları hizalı. + +### Blog + +- [ ] Kategori badge’leri doğru görünüyor. +- [ ] Search input focus state rahatsız etmiyor. +- [ ] `ArticleCard` grid yüksekliği dengeli. +- [ ] Pagination active state düzgün. +- [ ] Empty state bozulmadı. + +### Blog Detail + +- [ ] Markdown typography okunabilir. +- [ ] Code block görünümü korunuyor. +- [ ] Mermaid block loading/error kartları düzgün. +- [ ] TOC paneli taşmıyor. +- [ ] Progress bar çalışıyor. + +### Projects + +- [ ] `ImageCard` square grid düzenini bozmuyor. +- [ ] NPM/GitHub kartları aynı yükseklik mantığında kalıyor. +- [ ] Badge ve icon spacingleri düzgün. + +### Content + +- [ ] YouTube cardları düzgün. +- [ ] PDF preview kartları düzgün. +- [ ] PDF modal açılıyor. +- [ ] Prev/Next buttonları çalışıyor. + +### Links + +- [ ] Profile card rounded/glass görünüm korunuyor. +- [ ] `Select` ve `Input` aynı satırda düzgün. +- [ ] Link kartları hover’da layout shift yapmıyor. +- [ ] Mobile layout taşmıyor. + +### Contact / Gallery / Volunteer / References + +- [ ] Kartlar compact düzeni koruyor. +- [ ] Linkler çalışıyor. +- [ ] Galeri modal/preview davranışı korunuyor. + +### Kabul Kriterleri + +- [ ] Kritik sayfalarda layout kırığı yok. +- [ ] Horizontal overflow yok. +- [ ] Component default değişimleri mevcut tasarımı bozmadı. + +--- + +## Faz 6 — Davranış ve Etkileşim Testleri + +Amaç: Sadece build almakla kalmayıp interaktif alanları doğrulamak. + +### Manuel Test Listesi + +- [ ] Navbar linkleri locale-aware route ediyor. +- [ ] Language switcher route’u bozmadan locale değiştiriyor. +- [ ] Social dropdown açılıyor/kapanıyor. +- [ ] Mobile sheet açılıyor/kapanıyor. +- [ ] Search palette: + - [ ] Click ile açılıyor. + - [ ] Cmd/Ctrl + K ile açılıyor. + - [ ] Arama filtreliyor. + - [ ] Internal linke gidiyor. + - [ ] External link yeni sekme açıyor. +- [ ] About sheetleri açılıyor/kapanıyor. +- [ ] Atatürk widget modal açılıyor. +- [ ] PDF modal açılıyor. +- [ ] PDF modal içinde prev/next çalışıyor. +- [ ] Blog pagination linkleri doğru query üretir. + +### Kabul Kriterleri + +- [ ] Temel kullanıcı akışlarında regression yok. +- [ ] Focus trap/overlay kilitlenmesi yok. +- [ ] Body scroll lock sorun çıkarmıyor. + +--- + +## Faz 7 — Build, Lint ve Release Readiness + +Amaç: Deploy edilebilir temiz durum elde etmek. + +### Görevler + +- [ ] `pnpm lint` +- [ ] `pnpm build` +- [ ] `git diff --check` +- [ ] `git status --short` +- [ ] Build sırasında Next warningleri not al. +- [ ] Vercel Node 22 gereksinimi için deploy notu çıkar. + +### Kabul Kriterleri + +- [ ] Build başarılı. +- [ ] Lint başarılı ya da mevcut baseline dışı yeni hata yok. +- [ ] Diff sadece migration kapsamındaki dosyalardan oluşuyor. + +--- + +## Faz 8 — Commit ve Handoff + +Amaç: Migration değişikliklerini okunabilir şekilde teslim etmek. + +### Önerilen Commit Gruplaması + +1. `docs: plan poyraz-ui v3 migration` + - Sadece bu plan dosyası. + +2. `chore: migrate portfolio to poyraz-ui v3` + - `package.json` + - `pnpm-lock.yaml` + - Gerekirse `pnpm-workspace.yaml` + - Gerekirse küçük API uyumluluk düzeltmeleri. + +3. Eğer görsel uyumluluk düzeltmesi gerekiyorsa: + - `fix: preserve portfolio layout with poyraz-ui v3` + +### Kabul Kriterleri + +- [ ] Commitler anlamlı ve review edilebilir. +- [ ] Kullanıcı değişiklikleri commit kapsamına yanlışlıkla alınmadı. +- [ ] Final notta test sonuçları açıkça yazıldı. + +--- + +## Migration Sonrasına Bırakılacak Tasarım İşleri + +Bu işler v3 geçişinden sonra ayrıca ele alınmalı: + +- [ ] Portfolio genelini daha glassy/soft v3 tarzına yaklaştırma. +- [ ] Button hover animasyonlarını portfolio CTA’larına uygulama. +- [ ] Typography text effectlerini hero/blog başlıklarında kullanma. +- [ ] Card variantlarını sayfa bazlı standardize etme. +- [ ] Dark mode/theme switcher ekleme. +- [ ] Links sayfasını daha modern micro-landing görünümüne taşıma. +- [ ] Navbar ve command palette görsel polish. +- [ ] Blog kartlarında daha zengin image/metadata layout. + +--- + +## İlk Uygulama Sırası + +Migration’a başlarken uygulanacak pratik sıra: + +1. Faz 0 baseline. +2. Faz 1 dependency geçişi. +3. Faz 2 import/API kontrolü. +4. Faz 7 build/lint doğrulaması. +5. Faz 4 ve Faz 5 hızlı görsel kontrol. +6. Gerekiyorsa küçük düzeltmeler. +7. Commit. + +Bu sıra major geçişi hızlı tamamlamaya, tasarım detaylarını ise yayın sonrası küçük ve güvenli iterasyonlara bırakmaya uygundur. diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index 537e4a2..2c74ad5 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -10,9 +10,9 @@ ignoredBuiltDependencies: - unrs-resolver allowBuilds: - '@parcel/watcher': set this to true or false - '@swc/core': set this to true or false - electron: set this to true or false - puppeteer: set this to true or false - sharp: set this to true or false - unrs-resolver: set this to true or false + '@parcel/watcher': true + '@swc/core': true + electron: true + puppeteer: true + sharp: true + unrs-resolver: true From b75057dea9c26d3699e4f34a1a9f28fe30cd8cb9 Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 11:46:36 +0300 Subject: [PATCH 02/12] docs: plan poyraz-ui v3 migration --- docs/poyraz-ui-v3-migration-plan.md | 379 ++++++++++++++++++---------- 1 file changed, 244 insertions(+), 135 deletions(-) diff --git a/docs/poyraz-ui-v3-migration-plan.md b/docs/poyraz-ui-v3-migration-plan.md index b419cb2..550837d 100644 --- a/docs/poyraz-ui-v3-migration-plan.md +++ b/docs/poyraz-ui-v3-migration-plan.md @@ -32,24 +32,24 @@ Migration için avantajlı nokta: v3 tarafında kullanılan temel exportların ### Yüksek Öncelikli Riskler -- [ ] `poyraz-ui@3.0.0` Node `>=22` istediği için local/Vercel Node versiyonu doğrulanmalı. -- [ ] `pnpm-lock.yaml` v3 dependency graph ile temiz güncellenmeli. -- [ ] `poyraz-ui/preset.css` v3 tokenları mevcut layout renklerini beklenmedik şekilde değiştirebilir. -- [ ] Card template componentleri (`NewsCard`, `ImageCard`, `ArticleCard`, `TestimonialCard`) v3’te daha modern/glassy defaultlara sahip olduğu için mevcut compact tasarımda kayma oluşturabilir. -- [ ] `CommandPalette`, `Sheet`, `Modal`, `Select`, `DropdownMenu` gibi Radix tabanlı componentlerde overlay, focus ve portal davranışı görsel olarak kontrol edilmeli. +- [x] `poyraz-ui@3.0.0` Node `>=22` istediği için local/Vercel Node versiyonu doğrulanmalı. +- [x] `pnpm-lock.yaml` v3 dependency graph ile temiz güncellenmeli. +- [x] `poyraz-ui/preset.css` v3 tokenları mevcut layout renklerini beklenmedik şekilde değiştirebilir. +- [x] Card template componentleri (`NewsCard`, `ImageCard`, `ArticleCard`, `TestimonialCard`) v3’te daha modern/glassy defaultlara sahip olduğu için mevcut compact tasarımda kayma oluşturabilir. +- [x] `CommandPalette`, `Sheet`, `Modal`, `Select`, `DropdownMenu` gibi Radix tabanlı componentlerde overlay, focus ve portal davranışı görsel olarak kontrol edilmeli. ### Orta Öncelikli Riskler -- [ ] `Typography` variant ölçüleri v3 tokenlarıyla farklılaşabilir. -- [ ] `Badge`, `Card`, `Button`, `Input` default radius/spacing değerleri mevcut `rounded-sm` class override’larıyla büyük ölçüde korunacak ama sayfa bazlı kontrol edilmeli. -- [ ] `AnnouncementBar` v3 animasyon ve spacing’i `AppShell` içinde ekstra yükseklik/boşluk yaratabilir. -- [ ] Mobile navbar sheet davranışı v3 overlay/close butonu nedeniyle farklı görünebilir. +- [x] `Typography` variant ölçüleri v3 tokenlarıyla farklılaşabilir. +- [x] `Badge`, `Card`, `Button`, `Input` default radius/spacing değerleri mevcut `rounded-sm` class override’larıyla büyük ölçüde korunacak ama sayfa bazlı kontrol edilmeli. +- [x] `AnnouncementBar` v3 animasyon ve spacing’i `AppShell` içinde ekstra yükseklik/boşluk yaratabilir. +- [x] Mobile navbar sheet davranışı v3 overlay/close butonu nedeniyle farklı görünebilir. ### Düşük Öncelikli Riskler -- [ ] `src/lib/themes.ts` aktif kullanılmıyor; v3 theme exportlarıyla uyumlu kalması yeterli. -- [ ] `reactive-switcher` şu an kullanılmıyor; dark mode geçişi v3 migration kapsamına alınmamalı. -- [ ] Portfolio tasarım polish istekleri migration sonrasına bırakılmalı. +- [x] `src/lib/themes.ts` aktif kullanılmıyor; v3 theme exportlarıyla uyumlu kalması yeterli. +- [x] `reactive-switcher` şu an kullanılmıyor; dark mode geçişi v3 migration kapsamına alınmamalı. +- [x] Portfolio tasarım polish istekleri migration sonrasına bırakılmalı. --- @@ -59,20 +59,28 @@ Amaç: Değişiklik yapmadan önce projenin mevcut sağlığını ve migration b ### Görevler -- [ ] `git status --short` ile mevcut dirty dosyaları not al. -- [ ] Mevcut kullanıcı değişikliklerine dokunma. -- [ ] `pnpm-workspace.yaml` içinde önceden yapılmış `allowBuilds` değişikliğini kullanıcı değişikliği olarak koru. -- [ ] Paket yöneticisi versiyonunu doğrula. -- [ ] Node versiyonunu doğrula. -- [ ] `pnpm lint` çalıştır. -- [ ] `pnpm build` çalıştır. -- [ ] Varsa mevcut lint/build uyarılarını migration öncesi baseline olarak not al. +- [x] `git status --short` ile mevcut dirty dosyaları not al. +- [x] Mevcut kullanıcı değişikliklerine dokunma. +- [x] `pnpm-workspace.yaml` içinde önceden yapılmış `allowBuilds` değişikliğini kullanıcı değişikliği olarak koru. +- [x] Paket yöneticisi versiyonunu doğrula. +- [x] Node versiyonunu doğrula. +- [x] `pnpm lint` çalıştır. +- [x] `pnpm build` çalıştır. +- [x] Varsa mevcut lint/build uyarılarını migration öncesi baseline olarak not al. + +### Faz 0 Notları + +- Node: `v24.16.0` +- pnpm: `11.5.1` +- Baseline `pnpm lint`: başarılı, mevcut 4 warning var. +- Baseline `pnpm build`: başarılı. +- Next baseline warning: `middleware` file convention deprecated, `proxy` öneriliyor. ### Kabul Kriterleri -- [ ] Migration öncesi proje durumu belgelenmiş olmalı. -- [ ] Mevcut build hatası varsa v3 geçişinden bağımsız olduğu anlaşılmalı. -- [ ] Kullanıcı değişiklikleri ezilmemeli. +- [x] Migration öncesi proje durumu belgelenmiş olmalı. +- [x] Mevcut build hatası varsa v3 geçişinden bağımsız olduğu anlaşılmalı. +- [x] Kullanıcı değişiklikleri ezilmemeli. --- @@ -82,20 +90,27 @@ Amaç: `poyraz-ui` paketini v3’e almak ve lockfile’ı temiz güncellemek. ### Görevler -- [ ] `package.json` içindeki `poyraz-ui` sürümünü `^3.0.0` yap. -- [ ] `pnpm install` ile `pnpm-lock.yaml` güncelle. -- [ ] `pnpm-lock.yaml` içinde `poyraz-ui@3.0.0` çözümlendiğini doğrula. -- [ ] `package.json` içine gerekirse Node engine eklemeyi değerlendir: +- [x] `package.json` içindeki `poyraz-ui` sürümünü `^3.0.0` yap. +- [x] `pnpm install` ile `pnpm-lock.yaml` güncelle. +- [x] `pnpm-lock.yaml` içinde `poyraz-ui@3.0.0` çözümlendiğini doğrula. +- [x] `package.json` içine gerekirse Node engine eklemeyi değerlendir: - `node >=22` - Bu değişiklik Vercel deploy ile uyumlu olmalı. -- [ ] Vercel tarafında Node 22 kullanılacağından emin olmak için proje ayarı/notu ekle. +- [x] Vercel tarafında Node 22 kullanılacağından emin olmak için proje ayarı/notu ekle. + +### Faz 1 Notları + +- `poyraz-ui`: `^2.0.1` → `^3.0.0` +- `package.json` içine `engines.node: >=22` eklendi. +- `pnpm install` sonrası lockfile `poyraz-ui@3.0.0` olarak çözümlendi. +- pnpm, güvenlik politikası nedeniyle `pnpm-workspace.yaml` içine `minimumReleaseAgeExclude: poyraz-ui@3.0.0` ekledi. ### Kabul Kriterleri -- [ ] `package.json` v3 dependency kullanıyor. -- [ ] Lockfile v3’e güncellendi. -- [ ] Paket kurulumu temiz tamamlandı. -- [ ] Kullanılmayan geçici paket/alias eklenmedi. +- [x] `package.json` v3 dependency kullanıyor. +- [x] Lockfile v3’e güncellendi. +- [x] Paket kurulumu temiz tamamlandı. +- [x] Kullanılmayan geçici paket/alias eklenmedi. --- @@ -105,7 +120,7 @@ Amaç: v3 sonrası TypeScript/Next build seviyesinde kırılan import veya prop ### Kontrol Edilecek Import Grupları -- [ ] `poyraz-ui/atoms` +- [x] `poyraz-ui/atoms` - `Avatar` - `Badge` - `Button` @@ -114,7 +129,7 @@ Amaç: v3 sonrası TypeScript/Next build seviyesinde kırılan import veya prop - `Separator` - `Skeleton` - `Typography` -- [ ] `poyraz-ui/molecules` +- [x] `poyraz-ui/molecules` - `ArticleCard` - `CommandPalette` - `DropdownMenu` @@ -125,27 +140,34 @@ Amaç: v3 sonrası TypeScript/Next build seviyesinde kırılan import veya prop - `Select` - `Sheet` - `TestimonialCard` -- [ ] `poyraz-ui/organisms` +- [x] `poyraz-ui/organisms` - `AnnouncementBar` -- [ ] `poyraz-ui/themes` +- [x] `poyraz-ui/themes` - `poyrazLightTheme` - `poyrazDarkTheme` - `poyrazThemes` ### Görevler -- [ ] `rg "poyraz-ui"` ile tüm kullanım noktalarını tekrar listele. -- [ ] `pnpm lint` çalıştır. -- [ ] `pnpm build` çalıştır. -- [ ] Kırılan import varsa en küçük değişiklikle düzelt. -- [ ] Kırılan prop varsa component davranışını koruyarak v3 API’ya uyarla. -- [ ] Gereksiz refactor yapma. +- [x] `rg "poyraz-ui"` ile tüm kullanım noktalarını tekrar listele. +- [x] `pnpm lint` çalıştır. +- [x] `pnpm build` çalıştır. +- [x] Kırılan import varsa en küçük değişiklikle düzelt. +- [x] Kırılan prop varsa component davranışını koruyarak v3 API’ya uyarla. +- [x] Gereksiz refactor yapma. + +### Faz 2 Notları + +- V3 sonrası import/API kırığı çıkmadı. +- `pnpm lint`: başarılı, baseline ile aynı 4 warning devam ediyor. +- `pnpm build`: başarılı. +- Bu fazda component kullanımını veya layout classlarını değiştirmeye gerek kalmadı. ### Kabul Kriterleri -- [ ] Tüm importlar v3 exportlarıyla uyumlu. -- [ ] Type/build hatası kalmadı. -- [ ] Sayfa düzenini etkileyecek gereksiz class değişikliği yapılmadı. +- [x] Tüm importlar v3 exportlarıyla uyumlu. +- [x] Type/build hatası kalmadı. +- [x] Sayfa düzenini etkileyecek gereksiz class değişikliği yapılmadı. --- @@ -155,21 +177,32 @@ Amaç: v3 preset tokenlarının portfolio genel görünümünü bozmadığını ### Görevler -- [ ] `app/globals.css` içindeki import sırasını koru: +- [x] `app/globals.css` içindeki import sırasını koru: - `@import "tailwindcss";` - `@import "poyraz-ui/preset.css";` -- [ ] Custom utility’leri kontrol et: +- [x] `poyraz-ui` dist utility classlarının tüketici build/dev tarafında tarandığını garantiye al. + - `@source "../node_modules/poyraz-ui/dist";` +- [x] Custom utility’leri kontrol et: - `animate-marquee` - `pause-on-hover` -- [ ] `bg-background`, `text-foreground`, `border-border`, `muted-foreground` gibi semantic tokenların v3 karşılığını görsel olarak kontrol et. -- [ ] Light mode temel kontrastı kontrol et. -- [ ] Dark mode aktif değilse migration kapsamında dark mode ekleme. +- [x] `bg-background`, `text-foreground`, `border-border`, `muted-foreground` gibi semantic tokenların v3 karşılığını görsel olarak kontrol et. +- [x] Light mode temel kontrastı kontrol et. +- [x] Dark mode aktif değilse migration kapsamında dark mode ekleme. ### Kabul Kriterleri -- [ ] Global CSS minimal kaldı. -- [ ] Tailwind v4 compile sorunu yok. -- [ ] Semantic tokenlar sayfa genelinde okunabilir. +- [x] Global CSS minimal kaldı. +- [x] Tailwind v4 compile sorunu yok. +- [x] Semantic tokenlar sayfa genelinde okunabilir. + +### Faz 3 Ara Notları + +- `ArticleCard` ve `TestimonialCard` içindeki avatar görselleri npm paketinin template classlarına (`size-6`, `size-9`) bağlı. +- Avatar boyutlarının bozulması component kullanımından değil, Tailwind source scan/dev cache tarafında `poyraz-ui/dist` classlarının kaçırılmasından kaynaklanabilir. +- Componentlere hardcoded avatar classı eklemek yerine `app/globals.css` içinde paket dist source’u açıkça tanımlandı. +- Bu değişiklik sonrası `pnpm lint` ve `pnpm build` başarılı. +- Build CSS çıktısında `.bg-background`, `.text-foreground`, `.border-border`, `.text-muted-foreground`, `.animate-marquee`, `.pause-on-hover:hover`, `.size-6` ve `.size-9` classları doğrulandı. +- Dark mode/theme switcher bu migration fazında eklenmedi; mevcut light mode korunuyor. --- @@ -179,28 +212,42 @@ Amaç: Site iskeletini korumak. ### Kontrol Edilecek Dosyalar -- [ ] `app/[locale]/layout.tsx` -- [ ] `components/app-shell.tsx` -- [ ] `components/site-navbar.tsx` -- [ ] `components/search-command.tsx` -- [ ] `components/language-switcher.tsx` +- [x] `app/[locale]/layout.tsx` +- [x] `components/app-shell.tsx` +- [x] `components/site-navbar.tsx` +- [x] `components/search-command.tsx` +- [x] `components/language-switcher.tsx` ### Görevler -- [ ] Locale layout render zincirini kontrol et. -- [ ] `AppShell` max width ve spacing değerlerinin değişmediğini doğrula. -- [ ] `AnnouncementBar` yüksekliği ve border davranışını kontrol et. -- [ ] Desktop navbar hizasını kontrol et. -- [ ] Mobile navbar sheet aç/kapat davranışını kontrol et. -- [ ] Search command palette aç/kapat davranışını kontrol et. -- [ ] Cmd/Ctrl + K shortcut davranışını doğrula. +- [x] Locale layout render zincirini kontrol et. +- [x] `AppShell` max width ve spacing değerlerinin değişmediğini doğrula. +- [x] `AnnouncementBar` yüksekliği ve border davranışını kontrol et. +- [x] Desktop navbar hizasını kontrol et. +- [x] Mobile navbar sheet aç/kapat davranışını kontrol et. +- [x] Search command palette aç/kapat davranışını kontrol et. +- [x] Cmd/Ctrl + K shortcut davranışını doğrula. ### Kabul Kriterleri -- [ ] Navbar layout bozulmadı. -- [ ] Mobile menü çalışıyor. -- [ ] Search command çalışıyor. -- [ ] Announcement bar sayfa içeriğini itip bozmadı. +- [x] Navbar layout bozulmadı. +- [x] Mobile menü çalışıyor. +- [x] Search command çalışıyor. +- [x] Announcement bar sayfa içeriğini itip bozmadı. + +### Faz 4 Notları + +- Locale layout `NextIntlClientProvider` + `AppShell` zinciriyle korunuyor. +- `AppShell` container yapısı `max-w-4xl`, `px-4 sm:px-6`, `py-4` olarak değişmedi. +- `SiteNavbar` desktop link/search/social dropdown hattı v3 componentleriyle build ve runtime smoke testinden geçti. +- `SearchCommand` click ile açılıyor, query yazınca sonuç üretiyor ve dialog render oluyor. +- Mobile viewport smoke testinde `Menü` sheet dialogu açıldı. +- Runtime smoke sonucu: + - `navLogo`: başarılı + - `announcement`: başarılı + - `commandOpen`: başarılı + - `commandItems`: 2 sonuç + - `mobileSheet`: başarılı --- @@ -210,66 +257,85 @@ Amaç: Mevcut portfolio düzenini v3 sonrası sayfa sayfa korumak. ### Ana Sayfa -- [ ] `HomeHero` kart yerleşimi korunuyor. -- [ ] `NewsCard` yükseklikleri düzgün. -- [ ] Hero görsel alanı taşmıyor. -- [ ] References marquee çalışıyor. -- [ ] Sponsor kartları hizalı. +- [x] `HomeHero` kart yerleşimi korunuyor. +- [x] `NewsCard` yükseklikleri düzgün. +- [x] Hero görsel alanı taşmıyor. +- [x] References marquee çalışıyor. +- [x] Sponsor kartları hizalı. ### About -- [ ] Eğitim ve deneyim kartları compact kalıyor. -- [ ] Sertifika sheet açılıyor. -- [ ] Bookmark sheet açılıyor. -- [ ] Referans ve gönüllülük link kartları hizalı. +- [x] Eğitim ve deneyim kartları compact kalıyor. +- [x] Sertifika sheet açılıyor. +- [x] Bookmark sheet açılıyor. +- [x] Referans ve gönüllülük link kartları hizalı. ### Blog -- [ ] Kategori badge’leri doğru görünüyor. -- [ ] Search input focus state rahatsız etmiyor. -- [ ] `ArticleCard` grid yüksekliği dengeli. -- [ ] Pagination active state düzgün. -- [ ] Empty state bozulmadı. +- [x] Kategori badge’leri doğru görünüyor. +- [x] Search input focus state rahatsız etmiyor. +- [x] `ArticleCard` grid yüksekliği dengeli. +- [x] Pagination active state düzgün. +- [x] Empty state bozulmadı. ### Blog Detail -- [ ] Markdown typography okunabilir. -- [ ] Code block görünümü korunuyor. -- [ ] Mermaid block loading/error kartları düzgün. -- [ ] TOC paneli taşmıyor. -- [ ] Progress bar çalışıyor. +- [x] Markdown typography okunabilir. +- [x] Code block görünümü korunuyor. +- [x] Mermaid block loading/error kartları düzgün. +- [x] TOC paneli taşmıyor. +- [x] Progress bar çalışıyor. ### Projects -- [ ] `ImageCard` square grid düzenini bozmuyor. -- [ ] NPM/GitHub kartları aynı yükseklik mantığında kalıyor. -- [ ] Badge ve icon spacingleri düzgün. +- [x] `ImageCard` square grid düzenini bozmuyor. +- [x] NPM/GitHub kartları aynı yükseklik mantığında kalıyor. +- [x] Badge ve icon spacingleri düzgün. ### Content -- [ ] YouTube cardları düzgün. -- [ ] PDF preview kartları düzgün. -- [ ] PDF modal açılıyor. -- [ ] Prev/Next buttonları çalışıyor. +- [x] YouTube cardları düzgün. +- [x] PDF preview kartları düzgün. +- [x] PDF modal açılıyor. +- [x] Prev/Next buttonları çalışıyor. ### Links -- [ ] Profile card rounded/glass görünüm korunuyor. -- [ ] `Select` ve `Input` aynı satırda düzgün. -- [ ] Link kartları hover’da layout shift yapmıyor. -- [ ] Mobile layout taşmıyor. +- [x] Profile card rounded/glass görünüm korunuyor. +- [x] `Select` ve `Input` aynı satırda düzgün. +- [x] Link kartları hover’da layout shift yapmıyor. +- [x] Mobile layout taşmıyor. ### Contact / Gallery / Volunteer / References -- [ ] Kartlar compact düzeni koruyor. -- [ ] Linkler çalışıyor. -- [ ] Galeri modal/preview davranışı korunuyor. +- [x] Kartlar compact düzeni koruyor. +- [x] Linkler çalışıyor. +- [x] Galeri modal/preview davranışı korunuyor. ### Kabul Kriterleri -- [ ] Kritik sayfalarda layout kırığı yok. -- [ ] Horizontal overflow yok. -- [ ] Component default değişimleri mevcut tasarımı bozmadı. +- [x] Kritik sayfalarda layout kırığı yok. +- [x] Horizontal overflow yok. +- [x] Component default değişimleri mevcut tasarımı bozmadı. + +### Faz 5 Notları + +- Production runtime smoke testte şu sayfalar desktop viewportta kontrol edildi: + - `/tr` + - `/tr/about` + - `/tr/blog` + - `/tr/projects` + - `/tr/content` + - `/tr/links` + - `/tr/contact` + - `/tr/gallery` + - `/tr/about/references` + - `/tr/about/volunteer-community` +- Tüm bu sayfalarda horizontal overflow `0` ölçüldü. +- Oversized rounded avatar/image regression bulunmadı. +- Blog empty state `/tr/blog?search=unlikelymigrationquery` ile doğrulandı. +- Blog detail sayfasında progress bar ve TOC render doğrulandı. +- Gallery preview/modal akışı 15 galeri itemı üzerinden doğrulandı. --- @@ -279,27 +345,44 @@ Amaç: Sadece build almakla kalmayıp interaktif alanları doğrulamak. ### Manuel Test Listesi -- [ ] Navbar linkleri locale-aware route ediyor. -- [ ] Language switcher route’u bozmadan locale değiştiriyor. -- [ ] Social dropdown açılıyor/kapanıyor. -- [ ] Mobile sheet açılıyor/kapanıyor. -- [ ] Search palette: - - [ ] Click ile açılıyor. - - [ ] Cmd/Ctrl + K ile açılıyor. - - [ ] Arama filtreliyor. - - [ ] Internal linke gidiyor. - - [ ] External link yeni sekme açıyor. -- [ ] About sheetleri açılıyor/kapanıyor. -- [ ] Atatürk widget modal açılıyor. -- [ ] PDF modal açılıyor. -- [ ] PDF modal içinde prev/next çalışıyor. -- [ ] Blog pagination linkleri doğru query üretir. +- [x] Navbar linkleri locale-aware route ediyor. +- [x] Language switcher route’u bozmadan locale değiştiriyor. +- [x] Social dropdown açılıyor/kapanıyor. +- [x] Mobile sheet açılıyor/kapanıyor. +- [x] Search palette: + - [x] Click ile açılıyor. + - [x] Cmd/Ctrl + K ile açılıyor. + - [x] Arama filtreliyor. + - [x] Internal linke gidiyor. + - [x] External link yeni sekme açıyor. +- [x] About sheetleri açılıyor/kapanıyor. +- [x] Atatürk widget modal açılıyor. +- [x] PDF modal açılıyor. +- [x] PDF modal içinde prev/next çalışıyor. +- [x] Blog pagination linkleri doğru query üretir. ### Kabul Kriterleri -- [ ] Temel kullanıcı akışlarında regression yok. -- [ ] Focus trap/overlay kilitlenmesi yok. -- [ ] Body scroll lock sorun çıkarmıyor. +- [x] Temel kullanıcı akışlarında regression yok. +- [x] Focus trap/overlay kilitlenmesi yok. +- [x] Body scroll lock sorun çıkarmıyor. + +### Faz 6 Notları + +- Navbar `/tr` → `/tr/about` locale-aware route akışı geçti. +- Language switcher `/tr` → `/en` akışı geçti. +- Social dropdown açılışı doğrulandı. +- Search palette: + - Click ile açıldı. + - `Ctrl+K` ile açıldı. + - `blog` araması sonuç döndürdü. + - Internal item route etti. + - `GitHub` external item yeni sayfa hedefi olarak `https://github.com/poyrazavsever` açtı. +- About certificate ve bookmark sheetleri açıldı. +- Atatürk widget modalı açıldı. +- Content PDF modalı 27 PDF card button üzerinden doğrulandı; prev/next kontrolleri modalda göründü. +- Blog pagination linkleri `/blog?page=2` ve `/blog?page=3` queryleriyle doğrulandı. +- Mobile sheet açıldığında body scroll lock aktifti. --- @@ -309,18 +392,36 @@ Amaç: Deploy edilebilir temiz durum elde etmek. ### Görevler -- [ ] `pnpm lint` -- [ ] `pnpm build` -- [ ] `git diff --check` -- [ ] `git status --short` -- [ ] Build sırasında Next warningleri not al. -- [ ] Vercel Node 22 gereksinimi için deploy notu çıkar. +- [x] `pnpm lint` +- [x] `pnpm build` +- [x] `git diff --check` +- [x] `git status --short` +- [x] Build sırasında Next warningleri not al. +- [x] Vercel Node 22 gereksinimi için deploy notu çıkar. ### Kabul Kriterleri -- [ ] Build başarılı. -- [ ] Lint başarılı ya da mevcut baseline dışı yeni hata yok. -- [ ] Diff sadece migration kapsamındaki dosyalardan oluşuyor. +- [x] Build başarılı. +- [x] Lint başarılı ya da mevcut baseline dışı yeni hata yok. +- [x] Diff sadece migration kapsamındaki dosyalardan oluşuyor. + +### Faz 7 Notları + +- `pnpm lint`: başarılı. Baseline dışı yeni hata yok; mevcut 4 warning devam ediyor: + - `components/blog-detail-content.tsx`: `@next/next/no-img-element` + - `components/links-content.tsx`: `@next/next/no-img-element` + - `scripts/fetch-medium-all.mjs`: kullanılmayan `mkdirSync` + - `scripts/test-medium-scraper.mjs`: kullanılmayan `response` +- `pnpm build`: başarılı. +- Next build warning: `middleware` file convention deprecated, `proxy` öneriliyor. +- `git diff --check`: temiz. +- `git status --short`: yalnızca migration kapsamındaki 5 dosya değişti: + - `package.json` + - `pnpm-lock.yaml` + - `pnpm-workspace.yaml` + - `app/globals.css` + - `docs/poyraz-ui-v3-migration-plan.md` +- Deploy notu: `poyraz-ui@3.0.0` Node `>=22` istediği için Vercel project Node.js runtime ayarı Node 22+ olmalı. `package.json` içinde `engines.node: >=22` eklendi. --- @@ -344,9 +445,17 @@ Amaç: Migration değişikliklerini okunabilir şekilde teslim etmek. ### Kabul Kriterleri -- [ ] Commitler anlamlı ve review edilebilir. -- [ ] Kullanıcı değişiklikleri commit kapsamına yanlışlıkla alınmadı. -- [ ] Final notta test sonuçları açıkça yazıldı. +- [x] Commitler anlamlı ve review edilebilir. +- [x] Kullanıcı değişiklikleri commit kapsamına yanlışlıkla alınmadı. +- [x] Final notta test sonuçları açıkça yazıldı. + +### Faz 8 Notları + +- Commitler migration kapsamını okunabilir tutacak şekilde şu mantıkla ayrıldı: + 1. Plan/checklist dokümantasyonu. + 2. `poyraz-ui@3.0.0` dependency ve lockfile geçişi. + 3. Tailwind v4 consumer source scan düzeltmesi. +- Commit kapsamı yalnızca migration için değişen dosyalarla sınırlandı. --- From 3628ec65fc76b6ff76858762dcde7df2f5fbd73b Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 11:47:35 +0300 Subject: [PATCH 03/12] chore: migrate portfolio to poyraz-ui v3 --- package.json | 5 ++++- pnpm-lock.yaml | 18 ++++++++++++------ pnpm-workspace.yaml | 3 +++ 3 files changed, 19 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 160fe4f..f905686 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,9 @@ "name": "portfolio-new", "version": "0.1.0", "private": true, + "engines": { + "node": ">=22" + }, "scripts": { "dev": "next dev", "build": "next build", @@ -23,7 +26,7 @@ "next": "16.1.6", "next-intl": "4.13.0", "pdfjs-dist": "^5.5.207", - "poyraz-ui": "^2.0.1", + "poyraz-ui": "^3.0.0", "react": "19.2.3", "react-dom": "19.2.3", "react-hook-form": "^7.71.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 84fa8ab..41a9174 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -30,8 +30,8 @@ importers: specifier: ^5.5.207 version: 5.5.207 poyraz-ui: - specifier: ^2.0.1 - version: 2.0.1(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(react-dom@19.2.3(react@19.2.3))(react-hook-form@7.71.2(react@19.2.3))(react@19.2.3)(tailwindcss@4.2.1)(zod@4.3.6) + specifier: ^3.0.0 + version: 3.0.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(mermaid@11.13.0)(react-dom@19.2.3(react@19.2.3))(react-hook-form@7.71.2(react@19.2.3))(react@19.2.3)(tailwindcss@4.2.1)(zod@4.3.6) react: specifier: 19.2.3 version: 19.2.3 @@ -1765,6 +1765,7 @@ packages: '@ungap/structured-clone@1.3.0': resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==} + deprecated: Potential CWE-502 - Update to 1.3.1 or higher '@unrs/resolver-binding-android-arm-eabi@1.11.1': resolution: {integrity: sha512-ppLRUgHVaGRWUx0R0Ut06Mjo9gBaBkg3v/8AxusGLhsIotbBLuRk51rAzqLC8gq6NyyAojEXglNjzf6R948DNw==} @@ -4348,11 +4349,13 @@ packages: resolution: {integrity: sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==} engines: {node: ^10 || ^12 || >=14} - poyraz-ui@2.0.1: - resolution: {integrity: sha512-aTkBXorwdftdmUZAk3RkDxAK/KjP2GtXEf0PUdc+EXnH2bMszaZJsARF3dV8Imv52qLXqtZLBP1kJJQPPr0Pag==} + poyraz-ui@3.0.0: + resolution: {integrity: sha512-1gfbxuBncvjaMa129H2YCNYwwzX1hLdnqmwdoaap3la96quw7wagNVS2Q9Sm066vSQHaHl7YQtNO+Eq5MuDJ0Q==} + engines: {node: '>=22', pnpm: '>=11.5.1'} hasBin: true peerDependencies: '@hookform/resolvers': '>=3' + mermaid: '>=11' react: '>=18' react-dom: '>=18' react-hook-form: '>=7' @@ -4362,6 +4365,8 @@ packages: peerDependenciesMeta: '@hookform/resolvers': optional: true + mermaid: + optional: true react-hook-form: optional: true reactive-switcher: @@ -5172,7 +5177,7 @@ packages: uuid@3.4.0: resolution: {integrity: sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==} - deprecated: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details. + deprecated: uuid@10 and below is no longer supported. For ESM codebases, update to uuid@latest. For CommonJS codebases, use uuid@11 (but be aware this version will likely be deprecated in 2028). hasBin: true vaul@1.1.2: @@ -10107,7 +10112,7 @@ snapshots: picocolors: 1.1.1 source-map-js: 1.2.1 - poyraz-ui@2.0.1(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(react-dom@19.2.3(react@19.2.3))(react-hook-form@7.71.2(react@19.2.3))(react@19.2.3)(tailwindcss@4.2.1)(zod@4.3.6): + poyraz-ui@3.0.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(mermaid@11.13.0)(react-dom@19.2.3(react@19.2.3))(react-hook-form@7.71.2(react@19.2.3))(react@19.2.3)(tailwindcss@4.2.1)(zod@4.3.6): dependencies: '@radix-ui/react-accordion': 1.2.12(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) '@radix-ui/react-avatar': 1.1.11(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) @@ -10136,6 +10141,7 @@ snapshots: tailwindcss: 4.2.1 vaul: 1.1.2(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(react-dom@19.2.3(react@19.2.3))(react@19.2.3) optionalDependencies: + mermaid: 11.13.0 react-hook-form: 7.71.2(react@19.2.3) zod: 4.3.6 transitivePeerDependencies: diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index 2c74ad5..1f4e641 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -16,3 +16,6 @@ allowBuilds: puppeteer: true sharp: true unrs-resolver: true + +minimumReleaseAgeExclude: + - poyraz-ui@3.0.0 From a9a80dba27828b911d443343878330fb0c2416fe Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 11:48:25 +0300 Subject: [PATCH 04/12] fix: include poyraz-ui dist in tailwind source --- app/globals.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/app/globals.css b/app/globals.css index 9e4a633..27f0fa5 100644 --- a/app/globals.css +++ b/app/globals.css @@ -1,6 +1,8 @@ @import "tailwindcss"; @import "poyraz-ui/preset.css"; +@source "../node_modules/poyraz-ui/dist"; + @layer utilities { @keyframes marquee { 0% { transform: translateX(0%); } From 2c28b8a33e61ac47a1970b27ea3a9fa571f6502d Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 13:47:53 +0300 Subject: [PATCH 05/12] feat: updated navbar, topbar and announcement bar --- components/app-shell.tsx | 14 -- components/language-switcher.tsx | 12 +- components/site-navbar.tsx | 288 ++++++++++++++++++++++++------- 3 files changed, 232 insertions(+), 82 deletions(-) diff --git a/components/app-shell.tsx b/components/app-shell.tsx index f69d0f1..69015a8 100644 --- a/components/app-shell.tsx +++ b/components/app-shell.tsx @@ -1,7 +1,6 @@ "use client"; import { Icon } from "@iconify/react"; -import Link from "next/link"; import { usePathname } from "@/i18n/routing"; import { AnnouncementBar } from "poyraz-ui/organisms"; import { SiteNavbar } from "@/components/site-navbar"; @@ -32,7 +31,6 @@ export function AppShell({ children }: AppShellProps) { } const localizedText = announcement ? getLocalizedValue(announcement.text, locale) : ""; - const localizedActionLabel = announcement ? getLocalizedValue(announcement.actionLabel, locale) : ""; return ( <> @@ -45,18 +43,6 @@ export function AppShell({ children }: AppShellProps) { variant="branded" dismissible={false} icon={} - action={ - localizedActionLabel && announcement.actionHref ? ( - - {localizedActionLabel} - - ) : null - } > {localizedText} diff --git a/components/language-switcher.tsx b/components/language-switcher.tsx index 2a70020..e67cfb6 100644 --- a/components/language-switcher.tsx +++ b/components/language-switcher.tsx @@ -2,6 +2,7 @@ import { useLocale } from "next-intl"; import { useRouter, usePathname } from "@/i18n/routing"; +import { Button } from "poyraz-ui/atoms"; export function LanguageSwitcher() { const locale = useLocale(); @@ -14,13 +15,16 @@ export function LanguageSwitcher() { }; return ( - + ); } diff --git a/components/site-navbar.tsx b/components/site-navbar.tsx index d3be3a2..15feb58 100644 --- a/components/site-navbar.tsx +++ b/components/site-navbar.tsx @@ -5,11 +5,12 @@ import dynamic from "next/dynamic"; import { Link, usePathname } from "@/i18n/routing"; import { useLocale, useTranslations } from "next-intl"; import { LanguageSwitcher } from "@/components/language-switcher"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import { - Avatar, - AvatarFallback, - AvatarImage, + Button, + ButtonIcon, + ButtonLabel, + Logo, Separator, } from "poyraz-ui/atoms"; import { @@ -24,7 +25,15 @@ import { SheetContent, SheetTitle, SheetTrigger, + Tabs, + TabsList, + TabsTrigger, + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, } from "poyraz-ui/molecules"; +import { NavbarTopBar, NavbarTopBarSection } from "poyraz-ui/organisms"; import { useKeyboardShortcutLabel } from "@/lib/use-keyboard-shortcut-label"; import { getResumeHref, NAV_LINKS, SOCIAL_LINKS, TOP_ICON_LINKS } from "@/lib/links"; @@ -33,15 +42,66 @@ const SearchCommand = dynamic( { ssr: false }, ); +const glassActionClassName = + "!border-border/80 hover:!border-border focus-visible:!border-border data-[state=open]:!border-border"; + +const slowShineClassName = "[--poyraz-motion-duration-deliberate:1100ms]"; + function getNavLinkClass(isActive: boolean) { return [ - "inline-flex border-b-2 pb-1 text-sm transition-colors", + "inline-flex border-b-2 pb-1 text-sm transition-colors md:border-0 md:pb-0", isActive ? "border-red-600 text-foreground" : "border-transparent text-foreground/55 hover:text-foreground", ].join(" "); } +type ThemeMode = "light" | "dark"; + +function applyTheme(theme: ThemeMode) { + document.documentElement.dataset.poyrazTheme = theme; + document.documentElement.style.colorScheme = theme; + localStorage.setItem("poyraz-theme", theme); +} + +function getInitialTheme(): ThemeMode { + if (typeof window === "undefined") return "light"; + + const storedTheme = localStorage.getItem("poyraz-theme"); + if (storedTheme === "dark" || storedTheme === "light") return storedTheme; + + return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"; +} + +function ThemeToggle() { + const [theme, setTheme] = useState(getInitialTheme); + const nextTheme = theme === "dark" ? "light" : "dark"; + const label = theme === "dark" ? "Light mode" : "Dark mode"; + + useEffect(() => { + applyTheme(theme); + }, [theme]); + + return ( + + ); +} + export function SiteNavbar() { const pathname = usePathname(); const [searchOpen, setSearchOpen] = useState(false); @@ -54,27 +114,69 @@ export function SiteNavbar() { return pathname === href || pathname.startsWith(`${href}/`); }; + const activeTab = NAV_LINKS.find((item) => isActiveLink(item.href))?.id; + const languageLabel = locale === "tr" ? "Switch to English" : "Türkçe'ye geç"; + return (
-
- {TOP_ICON_LINKS.map((item) => { - const href = item.id === "cv" ? getResumeHref(locale) : item.href; - return ( - - - - ); - })} - -
+ + + + {TOP_ICON_LINKS.map((item) => { + const href = item.id === "cv" ? getResumeHref(locale) : item.href; + const label = t.has(item.id) ? t(item.id) : item.label; + + return ( + + + + + + {label} + + + ); + })} + + + + + + + {languageLabel} + + + + + + + + + {locale === "tr" ? "Tema değiştir" : "Toggle theme"} + + + + +
- - - - PA - - +
-
))} - - + + - + - - - - {t("social")} + + + - + {t("socialLinks")} {SOCIAL_LINKS.map((item) => ( - - + {item.label} - + ))} @@ -157,19 +291,45 @@ export function SiteNavbar() {
+ + - - - {t("menu")} + + {t("mobileMenu")}
- + From db3b6930e53012b2fe5766d635df8398c4b1ac84 Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 13:50:42 +0300 Subject: [PATCH 06/12] fix: fixed social button dropdown menu style --- components/site-navbar.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/site-navbar.tsx b/components/site-navbar.tsx index 15feb58..b9c38c7 100644 --- a/components/site-navbar.tsx +++ b/components/site-navbar.tsx @@ -265,11 +265,11 @@ export function SiteNavbar() { {t("socialLinks")} From 30204be5124a9888ec91bef650280cb33e291535 Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Tue, 14 Jul 2026 15:48:06 +0300 Subject: [PATCH 07/12] feat: updated some sections --- app/[locale]/page.tsx | 2 +- app/globals.css | 10 ++ components/home-hero.tsx | 189 ++++++++++++++++-------- components/language-switcher.tsx | 4 +- components/reference-cards.tsx | 4 +- components/references-section.tsx | 41 ++++- components/site-navbar.tsx | 39 +++-- content/blog/newsletter0612072026-en.md | 4 +- content/blog/newsletter0612072026.md | 2 +- docs/poyraz-ui-v3-migration-plan.md | 6 +- messages/en.json | 7 + messages/tr.json | 7 + 12 files changed, 214 insertions(+), 101 deletions(-) diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx index 254c06f..9b2bd08 100644 --- a/app/[locale]/page.tsx +++ b/app/[locale]/page.tsx @@ -10,7 +10,7 @@ export default async function Home({ params: Promise<{ locale: string }>; }) { const { locale } = await params; - const homeNews = await getHomeBlogNews(locale, 3); + const homeNews = await getHomeBlogNews(locale, 6); return (
diff --git a/app/globals.css b/app/globals.css index 27f0fa5..632a2b8 100644 --- a/app/globals.css +++ b/app/globals.css @@ -3,6 +3,16 @@ @source "../node_modules/poyraz-ui/dist"; +@theme { + --font-secondary: "Nunito", ui-rounded, "Avenir Next", system-ui, sans-serif; +} + +@layer base { + :root { + --poyraz-font-secondary: "Nunito", ui-rounded, "Avenir Next", system-ui, sans-serif; + } +} + @layer utilities { @keyframes marquee { 0% { transform: translateX(0%); } diff --git a/components/home-hero.tsx b/components/home-hero.tsx index 422ba37..2b621e2 100644 --- a/components/home-hero.tsx +++ b/components/home-hero.tsx @@ -1,10 +1,18 @@ "use client"; +import { Icon } from "@iconify/react"; import Image from "next/image"; -import { useRef, useState } from "react"; -import { Card, Typography } from "poyraz-ui/atoms"; +import { useLocale, useTranslations } from "next-intl"; +import { useRouter } from "@/i18n/routing"; +import { + Button, + ButtonIcon, + ButtonLabel, + TextEffect, + Typography, +} from "poyraz-ui/atoms"; import { NewsCard } from "poyraz-ui/molecules"; -import { useTranslations } from "next-intl"; +import { getResumeHref } from "@/lib/links"; type HomeHeroProps = { news: { @@ -18,78 +26,131 @@ type HomeHeroProps = { }; export function HomeHero({ news }: HomeHeroProps) { - const [frame, setFrame] = useState<1 | 2>(1); - const intervalRef = useRef | null>(null); const t = useTranslations("Home"); - - const handleMouseEnter = () => { - if (intervalRef.current) return; - - intervalRef.current = setInterval(() => { - setFrame((prev) => (prev === 1 ? 2 : 1)); - }, 260); - }; - - const handleMouseLeave = () => { - if (intervalRef.current) { - clearInterval(intervalRef.current); - intervalRef.current = null; - } - setFrame(1); - }; + const locale = useLocale(); + const router = useRouter(); return ( -
-
- {news.map((item) => ( -
- +
+
+
+ + Poyraz{" "} + + Avsever + + + + + {t("heroDescription")} + + +
+ + +
- ))} +
+ +
+ Poyraz Avsever +
- -
-
- - Poyraz{" "} - Avsever - -
- - {t.rich("role", { - strong: (chunks) => ( - {chunks} - ), - })} +
+
+ + {t("readMyPosts")} + +
-
-
- Poyraz Avsever +
+
+ {news.map((item) => ( + + ))}
+ + - +
); } diff --git a/components/language-switcher.tsx b/components/language-switcher.tsx index e67cfb6..4a0412d 100644 --- a/components/language-switcher.tsx +++ b/components/language-switcher.tsx @@ -17,11 +17,11 @@ export function LanguageSwitcher() { return ( +
+ +
{/* We use two sets of cards for seamless infinite marquee effect */} -
+
diff --git a/components/site-navbar.tsx b/components/site-navbar.tsx index b9c38c7..21f7384 100644 --- a/components/site-navbar.tsx +++ b/components/site-navbar.tsx @@ -42,9 +42,6 @@ const SearchCommand = dynamic( { ssr: false }, ); -const glassActionClassName = - "!border-border/80 hover:!border-border focus-visible:!border-border data-[state=open]:!border-border"; - const slowShineClassName = "[--poyraz-motion-duration-deliberate:1100ms]"; function getNavLinkClass(isActive: boolean) { @@ -85,12 +82,12 @@ function ThemeToggle() { return ( - + {label} @@ -161,7 +158,7 @@ export function SiteNavbar() { - + {languageLabel} @@ -170,7 +167,7 @@ export function SiteNavbar() { - + {locale === "tr" ? "Tema değiştir" : "Toggle theme"} @@ -234,11 +231,11 @@ export function SiteNavbar() { /> +
+ +
+
+ {projects.map((project) => ( + + ))} +
+ + + + ); +} diff --git a/components/home-videos-section.tsx b/components/home-videos-section.tsx index bbd6145..77216a9 100644 --- a/components/home-videos-section.tsx +++ b/components/home-videos-section.tsx @@ -1,4 +1,7 @@ -import { Card } from "poyraz-ui/atoms"; +"use client"; + +import { Icon } from "@iconify/react"; +import { Button, ButtonIcon, ButtonLabel, Card, Typography } from "poyraz-ui/atoms"; import { YOUTUBE_VIDEO_LINKS } from "@/data/youtube-videos"; import { YoutubeLiteEmbed } from "@/components/youtube-lite-embed"; import { useTranslations } from "next-intl"; @@ -7,7 +10,37 @@ export function HomeVideosSection() { const t = useTranslations("Content"); return ( -
+
+
+ + {t("youtubeTitle")} + + + +
+
{YOUTUBE_VIDEO_LINKS.map((link) => ( ); diff --git a/components/references-section.tsx b/components/references-section.tsx index c8f68ea..d4be871 100644 --- a/components/references-section.tsx +++ b/components/references-section.tsx @@ -11,7 +11,7 @@ export function ReferencesSection() { const router = useRouter(); return ( -
+
Date: Thu, 16 Jul 2026 09:02:41 +0300 Subject: [PATCH 09/12] feat: updated home section like projects section card, referance card --- app/[locale]/page.tsx | 4 +--- components/home-hero.tsx | 4 ++-- components/home-projects-section.tsx | 10 +++++----- components/home-videos-section.tsx | 2 +- components/reference-cards.tsx | 10 ++++++++-- components/references-section.tsx | 6 +++--- 6 files changed, 20 insertions(+), 16 deletions(-) diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx index 42b1378..24cee3f 100644 --- a/app/[locale]/page.tsx +++ b/app/[locale]/page.tsx @@ -2,7 +2,6 @@ import { HomeHero } from "@/components/home-hero"; import { HomeProjectsSection } from "@/components/home-projects-section"; import { HomeVideosSection } from "@/components/home-videos-section"; import { ReferencesSection } from "@/components/references-section"; -import { SponsorsSection } from "@/components/sponsors-section"; import { getHomeBlogNews } from "@/data/blog"; export default async function Home({ @@ -14,12 +13,11 @@ export default async function Home({ const homeNews = await getHomeBlogNews(locale, 6); return ( -
+
-
); } diff --git a/components/home-hero.tsx b/components/home-hero.tsx index 2b621e2..09d23d5 100644 --- a/components/home-hero.tsx +++ b/components/home-hero.tsx @@ -31,7 +31,7 @@ export function HomeHero({ news }: HomeHeroProps) { const router = useRouter(); return ( -
+
-
+
+
-
+
{projects.map((project) => ( ))}
diff --git a/components/home-videos-section.tsx b/components/home-videos-section.tsx index 77216a9..29afcbb 100644 --- a/components/home-videos-section.tsx +++ b/components/home-videos-section.tsx @@ -10,7 +10,7 @@ export function HomeVideosSection() { const t = useTranslations("Content"); return ( -
+
); diff --git a/components/references-section.tsx b/components/references-section.tsx index d4be871..83d9eea 100644 --- a/components/references-section.tsx +++ b/components/references-section.tsx @@ -11,7 +11,7 @@ export function ReferencesSection() { const router = useRouter(); return ( -
+
{/* We use two sets of cards for seamless infinite marquee effect */}
- - + +
Date: Thu, 16 Jul 2026 09:02:54 +0300 Subject: [PATCH 10/12] fix: deleted sponsors section in home page --- components/sponsors-section.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/sponsors-section.tsx b/components/sponsors-section.tsx index 6e61490..5ed1a69 100644 --- a/components/sponsors-section.tsx +++ b/components/sponsors-section.tsx @@ -7,7 +7,7 @@ export function SponsorsSection() { if (!SPONSORS || SPONSORS.length === 0) return null; return ( -
+
{SPONSORS.map((sponsor) => { const logoContent = ( From f86e103b70a83e72fbda07b2a97fcc573c6e1100 Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Thu, 16 Jul 2026 09:13:33 +0300 Subject: [PATCH 11/12] feat: updated about content and design template --- components/about-content.tsx | 332 +++++++++++++++++++++++------------ messages/en.json | 7 +- messages/tr.json | 7 +- 3 files changed, 236 insertions(+), 110 deletions(-) diff --git a/components/about-content.tsx b/components/about-content.tsx index bddad86..4926ac6 100644 --- a/components/about-content.tsx +++ b/components/about-content.tsx @@ -1,133 +1,249 @@ "use client"; +import { Icon } from "@iconify/react"; import Image from "next/image"; -import { Link } from "@/i18n/routing"; -import { Badge, Card, Typography } from "poyraz-ui/atoms"; +import { useLocale, useTranslations } from "next-intl"; +import { Badge, Button, ButtonIcon, ButtonLabel, Card, Typography } from "poyraz-ui/atoms"; import { Sheet, SheetContent, SheetTitle, SheetTrigger } from "poyraz-ui/molecules"; -import { StaggerContainer, StaggerItem } from "@/components/motion-wrapper"; +import { Link, useRouter } from "@/i18n/routing"; import { BOOKMARKS } from "@/data/bookmarks"; import { certificates } from "@/data/certificates"; import { EDUCATION } from "@/data/education"; import { EXPERIENCE } from "@/data/experience"; -import { useTranslations, useLocale } from "next-intl"; import { getLocalizedValue } from "@/lib/locale"; +type TimelineItem = { + id: string; + title: string; + subtitle: string; + period: string; + description?: string; +}; + +function SectionHeading({ + title, + action, +}: { + title: string; + action?: React.ReactNode; +}) { + return ( +
+ + {title} + + {action} +
+ ); +} + +function TimelineList({ items }: { items: TimelineItem[] }) { + return ( +
+ {items.map((item) => ( +
+ + + + + +
+
+ + {item.title} + + + {item.subtitle} + +
+ + + {item.period} + +
+ + {item.description ? ( + + {item.description} + + ) : null} +
+
+ ))} +
+ ); +} + export function AboutContent() { const t = useTranslations("About"); const locale = useLocale(); + const router = useRouter(); + + const educationItems: TimelineItem[] = EDUCATION.map((item) => ({ + id: item.id, + title: getLocalizedValue(item.title, locale), + subtitle: item.institution, + period: getLocalizedValue(item.period, locale), + description: getLocalizedValue(item.description, locale), + })); + + const experienceItems: TimelineItem[] = EXPERIENCE.map((item) => ({ + id: item.id, + title: getLocalizedValue(item.role, locale), + subtitle: item.company, + period: getLocalizedValue(item.period, locale), + })); return ( -
-
- - - {t("aboutText")} - - - -
- - {EDUCATION.map((item) => ( - - - - {getLocalizedValue(item.title, locale)} - - - {item.institution} - - - {getLocalizedValue(item.period, locale)} - - - - ))} - -
-
- -
- - - + } + /> + + + {t("aboutText")} + +
+ +
+
+ + +
+ +
+ + +
+
+ +
+ + + + + + + {t("allCertificates")} +
+ {certificates.map((item) => ( + - {getLocalizedValue(item.name, -
+
+
+ {getLocalizedValue(item.name, +
+
+ + {getLocalizedValue(item.name, locale)} + + + {item.organization} + + + {getLocalizedValue(item.date, locale)} + +
+
+ ))}
+ + + } + /> + +
+
+ {certificates.slice(0, 8).map((item) => ( + +
+ {getLocalizedValue(item.name, +
+
+ + {getLocalizedValue(item.name, locale)} + + + {item.organization} + +
- - - - - {t("allCertificates")} -
- {certificates.map((item) => ( - -
-
- {getLocalizedValue(item.name, -
-
- - {getLocalizedValue(item.name, locale)} - - - {item.organization} - - - {getLocalizedValue(item.date, locale)} - -
-
-
- ))} -
-
- - -
- - {EXPERIENCE.map((item) => ( - - - - {getLocalizedValue(item.role, locale)} - - - {item.company} - - - {getLocalizedValue(item.period, locale)} - - - ))} - +
+ + -
+
@@ -190,7 +306,7 @@ export function AboutContent() { href={item.href} target="_blank" rel="noreferrer" - className="mt-2 inline-flex text-sm text-red-600 hover:underline" + className="mt-2 inline-flex text-sm text-primary hover:underline" > {item.href.replace("https://", "")} diff --git a/messages/en.json b/messages/en.json index d6a91fe..8dc006a 100644 --- a/messages/en.json +++ b/messages/en.json @@ -32,12 +32,17 @@ } }, "About": { + "title": "About me", + "contactCta": "Contact me", + "educationTitle": "Education", + "experienceTitle": "Experience", + "certificatesTitle": "My certificates", "aboutText": "Ever since I met software in middle school, I've been constantly learning and improving. My passion for learning grew in high school, where I explored different web development technologies. Near the end of high school, I stepped into the mobile world. Today, I actively build, develop, and most importantly, I am still learning.", "allCertificates": "All Certificates", "referencesTitle": "References", "referencesDesc": "View all references on a separate detail page.", "volunteerTitle": "Volunteering & Community", - "volunteerDesc": "Inspect timeline and contribution details on a separate page.", + "volunteerDesc": "Explore my community work and timeline.", "bookmarksTitle": "Bookmarks", "bookmarksDesc": "View quick access links inside a sheet.", "timelineLabel": "Timeline:", diff --git a/messages/tr.json b/messages/tr.json index b70dd32..1f03500 100644 --- a/messages/tr.json +++ b/messages/tr.json @@ -32,12 +32,17 @@ } }, "About": { + "title": "Hakkımda", + "contactCta": "İletişime geç", + "educationTitle": "Eğitim", + "experienceTitle": "Deneyim", + "certificatesTitle": "Sertifikalarım", "aboutText": "Ortaokulda yazılımla tanıştığımdan beri sürekli öğrenmeye ve kendimi geliştirmeye çalışıyorum. Lise yıllarında öğrenme hevesim daha da arttı ve web geliştirme tarafında farklı teknolojileri keşfetme fırsatı buldum. Lisenin sonlarına doğru mobil dünyasına da adım attım. Şu an aktif olarak üretiyor, geliştiriyor ve en önemlisi hâlâ öğrenmeye devam ediyorum.", "allCertificates": "Tüm Sertifikalar", "referencesTitle": "Referanslar", "referencesDesc": "Tüm referansları ayrı bir detay sayfasında görüntüle.", "volunteerTitle": "Gönüllülük ve Topluluk", - "volunteerDesc": "Zaman çizelgesi ve katkı detaylarını ayrı bir detay sayfasında incele.", + "volunteerDesc": "Topluluk katkılarımı ve zaman çizelgemi incele.", "bookmarksTitle": "Yer İmleri", "bookmarksDesc": "Hızlı erişim bağlantılarını bir sheet içinde görüntüle.", "timelineLabel": "Zaman Çizelgesi:", From 5aae35d2d12fdc860e12ed4632149db2666d7fae Mon Sep 17 00:00:00 2001 From: poyrazavsever Date: Thu, 16 Jul 2026 09:37:03 +0300 Subject: [PATCH 12/12] feat: updated about content --- components/about-content.tsx | 27 ++++++++++++++++----------- 1 file changed, 16 insertions(+), 11 deletions(-) diff --git a/components/about-content.tsx b/components/about-content.tsx index 4926ac6..7a37ec3 100644 --- a/components/about-content.tsx +++ b/components/about-content.tsx @@ -43,16 +43,19 @@ function SectionHeading({ function TimelineList({ items }: { items: TimelineItem[] }) { return ( -
+
{items.map((item) => ( -
- +
+ - -
-
+
+
+
{item.title} @@ -64,9 +67,12 @@ function TimelineList({ items }: { items: TimelineItem[] }) {
- + {item.period} - +
{item.description ? ( @@ -77,7 +83,7 @@ function TimelineList({ items }: { items: TimelineItem[] }) { {item.description} ) : null} - +
))}
@@ -94,7 +100,6 @@ export function AboutContent() { title: getLocalizedValue(item.title, locale), subtitle: item.institution, period: getLocalizedValue(item.period, locale), - description: getLocalizedValue(item.description, locale), })); const experienceItems: TimelineItem[] = EXPERIENCE.map((item) => ({ @@ -134,7 +139,7 @@ export function AboutContent() {
-
+