From 3550f1a9bc61177b0d53ab038bc0e9ed8fe0a29f Mon Sep 17 00:00:00 2001 From: ht Date: Sun, 6 Sep 2026 09:54:48 +0300 Subject: [PATCH] Fix list and header overflow on mobile and tablet widths --- .../evidence/qa-responsive-widths.json | 40 +++++++++++++++++++ docs/quality/uygulama-durumu.md | 8 ++++ src/App.jsx | 2 +- src/components/Header.jsx | 18 +++++---- src/components/SummaryCards.jsx | 2 +- src/components/TenderList.jsx | 4 +- 6 files changed, 62 insertions(+), 12 deletions(-) create mode 100644 docs/quality/evidence/qa-responsive-widths.json diff --git a/docs/quality/evidence/qa-responsive-widths.json b/docs/quality/evidence/qa-responsive-widths.json new file mode 100644 index 0000000..7f2186e --- /dev/null +++ b/docs/quality/evidence/qa-responsive-widths.json @@ -0,0 +1,40 @@ +{ + "mobile": { + "content": 384, + "viewport": 384 + }, + "tablet": { + "content": 762, + "viewport": 762 + }, + "desktop": { + "content": 1434, + "viewport": 1434 + }, + "review": { + "content": 244, + "fields": [ + { + "right": 311, + "tag": "TEXTAREA", + "width": 244 + }, + { + "right": 311, + "tag": "TEXTAREA", + "width": 244 + }, + { + "right": 193.296875, + "tag": "BUTTON", + "width": 126.296875 + }, + { + "right": 282.1171875, + "tag": "BUTTON", + "width": 207.1171875 + } + ], + "width": 244 + } +} \ No newline at end of file diff --git a/docs/quality/uygulama-durumu.md b/docs/quality/uygulama-durumu.md index edeb43a..b7cc040 100644 --- a/docs/quality/uygulama-durumu.md +++ b/docs/quality/uygulama-durumu.md @@ -387,3 +387,11 @@ Güncel backend ile localhost:5175 üzerinde izole test açıldı. Tek sayfalık İki ayrı tarayıcı sekmesi aynı sürüm 1'i açtı. İlk sekmede not güncellenip sürüm 2 kaydedildi. İkinci sekmede eski sürümle kayıt girişimi reddedildi, kullanıcı notu formda korundu ve açık sürüm hatası gösterildi. Güncel kaydı yükleme sonrasında sürüm 2 ve ilk sekmenin notu geri geldi; eski sekme kaydı ezmedi. Kanıt: evidence/qa-review-conflict.txt ve evidence/qa-review-reload.txt. Bu tur uygulama kodu değişmedi; daha önceki otomatik testlere ek gerçek UI kanıtı toplandı. Gerçek AI sağlayıcısı ile analiz sonucu ve çıktı sırasında inceleme değiştirme kabulü hâlâ açık. Sentetik tek sayfa karşılaştırması resmi ihale incelemesi değildir. + +### Gerçek mobil/tablet genişlik kontrolü + +In-app tarayıcı viewport özelliğiyle 390×844, 768×1024 ve 1440×1000 denendi. İlk mobil görünümde 384 px kullanılabilir genişliğe karşı 513 px belge genişliği vardı; hesap düğmesi ve liste araçları kesiliyordu. Ana içerik ve listeye min-width:0/w-full, araçlara satır kaydırma, üst aramaya mobil/tablette ayrı satır eklendi. Özet kartları dar alanda sarılıyor. Hesap ve bildirim ikonlarına erişilebilir ad eklendi. + +Son ölçüm: mobil 384/384, tablet 762/762, masaüstü 1434/1434 (içerik/kullanılabilir genişlik; scrollbar 6 px). Mobil belge inceleme bölgesi 244/244, iki metin alanı ve kaydet/analiz düğmeleri viewport içinde. Normal viewport geri yüklendi. Kanıt: evidence/qa-responsive-widths.json. + +80 test ve üretim derlemesi geçti. Bu test ana liste, üst çubuk ve belge inceleme formundaki taşmayı kapsar; tüm modüller, gerçek dokunmatik cihaz, ekran okuyucu ve bütün klavye akışları kabul edilmiş sayılmaz. diff --git a/src/App.jsx b/src/App.jsx index 96c34db..2ba8c82 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -42,7 +42,7 @@ const MainContent = () => { const { activeTab, isAdmin, saveError, savingCount } = useApp(); return ( -
+
{/* 3-Column Main View */} {savingCount > 0 &&

Kaydediliyor…

} diff --git a/src/components/Header.jsx b/src/components/Header.jsx index e042e72..f6c87d4 100644 --- a/src/components/Header.jsx +++ b/src/components/Header.jsx @@ -36,26 +36,26 @@ export const Header = () => { return (
-
+
{/* Logo */}
{ setActiveTab('list'); clearAllFilters(); }} - className="flex items-center gap-2.5 cursor-pointer select-none group" + className="flex shrink-0 items-center gap-1.5 sm:gap-2.5 cursor-pointer select-none group" > -
+
- + İhaleist
{/* Search Bar */} -
-
+ +
{ {/* Right Action Icons */} -
+
{/* Real Live EKAP Mode Badge */}
)} - {(authUser?.name || userProfile.username).split(' ')[0]} + {(authUser?.name || userProfile.username).split(' ')[0]} diff --git a/src/components/SummaryCards.jsx b/src/components/SummaryCards.jsx index e3509a1..935cd5e 100644 --- a/src/components/SummaryCards.jsx +++ b/src/components/SummaryCards.jsx @@ -77,7 +77,7 @@ export const SummaryCards = () => { setQuickFilter(card.id); setActiveTab('list'); }} - className={`bg-white rounded-xl p-4 border transition-all cursor-pointer select-none shadow-xs flex items-center justify-between group hover:shadow-md ${ + className={`bg-white rounded-xl p-4 border transition-all cursor-pointer select-none shadow-xs flex flex-wrap gap-2 items-center justify-between group hover:shadow-md ${ isSelected ? 'border-blue-600 ring-2 ring-blue-500/20 bg-blue-50/20' : 'border-slate-200 hover:border-slate-300' diff --git a/src/components/TenderList.jsx b/src/components/TenderList.jsx index 08ab3d4..b625f7a 100644 --- a/src/components/TenderList.jsx +++ b/src/components/TenderList.jsx @@ -126,7 +126,7 @@ export const TenderList = () => { }; return ( -
+
{/* Header bar above list */}
@@ -137,7 +137,7 @@ export const TenderList = () => {
-
+
{/* Varsayılan: yalnızca ihale tarihi geçmemiş ilanlar */}