/* EduLive cihaz katmanı: web ve MAUI aynı responsive kuralları kullanır. Personel üst barı cihazda 56px; öğrenci görünümü korunur. Cihaz bantları yanında erişilebilirlik/konum tabanları da bulunur. */ /* =========================================================================== 1 · TELEFON BANDI — @media (max-width: 640px) TASARIM-MOBIL bölüm 5.1 tablosu + 6.1 ========================================================================= */ @media (max-width: 640px) { /* --- Dikey süs bütçesi ------------------------------------------------ ÖLÇÜM (360x780, kart öncesi çerçeve): topbar 70 + .wrap 30 + .au-page 10 + hero ~140 = ~250 px. Ekranın üçte biri kart göstermeden gidiyordu. */ /* aurora.css:590 — padding: clamp(30px,5vw,56px) ...; 5vw@360 = 18 -> 30 */ body.edulive-cihaz .wrap { padding-top: 12px; } /* admin-users.css:11 — padding: 10px 8px 48px; 327 .razor bu sınıfı kullanıyor */ body.edulive-cihaz .au-page { padding-top: 8px; } body.edulive-cihaz { --akn-yan-dolgu: clamp(24px, 4.5vw, 72px); --akn-ust-cekme: -12px; } /* --- Hero (Home.razor.css:4-45) --------------------------------------- */ /* :5 margin 6px 0 28px */ body.edulive-cihaz .home-hero { margin: 4px 0 12px; }/* :16 margin 0 0 12px — kurum + rol bağlamı KORUNUR (çok-kurumlu kullanıcı) */ /* :25 clamp(28px,4.5vw,42px) -> 4.5vw@360 = 16,2 -> alt sınır 28 px */ body.edulive-cihaz .home-hero__title { font-size: 22px; line-height: 1.15; margin-bottom: 6px; }/* "Çalışma alanınıza hoş geldiniz. Bir bölüm seçerek başlayın." — telefonda iki satır yer kaplayan, bilgi taşımayan cümle. */ /* --- Izgara: TEK SÜTUN -> İKİ SÜTUN ----------------------------------- KÖK NEDEN (ölçüldü): HubGrid.razor.css:13-17 telefonda `grid-template-columns: 1fr` EMREDİYOR. Masaüstü değeri `repeat(auto-fill, minmax(360px,1fr))` iki sütunu engellemiyor — kural onu bilerek kapatıyor. `minmax(0, 1fr)` ŞART: `1fr`in taban değeri `auto`dur; "Planlama ve operasyon" gibi uzun bir başlık sütunu genişletip yatay taşma üretir (K2). YAN ETKİ (kasıtlı, bedava): `.hub-grid--compact` de bu seçiciyle eşleşir (HubGrid.razor:4 iki sınıfı birlikte basar) -> 10 alt hub sayfası da iki sütuna geçer. TASARIM-MOBIL P4 madde 1 erken iner. */ body.edulive-cihaz .hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } /* --- Kart (HubCard.razor.css) ----------------------------------------- ÖLÇÜM: 360 px ekranda kullanılabilir genişlik 360 - .wrap 2x24 (aurora.css:590) - .au-page 2x8 (admin-users.css:11) = 296 İki sütun + 10 px boşluk -> sütun = (296-10)/2 = 143 px. 143 px'lik sütunda 28 px dolgu içeriğe 87 px bırakıyordu. */ body.edulive-cihaz .hub-card { /* :9 min-height 140 -> içerik (başlık 2 satır 37,5 + dolgu 24) = 61,5 */ min-height: 72px; /* :10 padding 28px 28px */ padding: 12px; gap: 8px; /* SATIR düzeni (P4/K14): HubCard.razor.css:5-7 sütun + ortalanmış. Rota ikonu (bant 7) sütun düzeninde başlığın ÜSTÜNE binerdi ve kartı 72 -> ~85 px'e çıkarırdı; ölçüm: satır adımı 82 -> 95, ilk ekranda tam görünen döşeme 12 -> 10, yani K1'in "modül girişi >= 12" eşiği DÜŞERDİ. Satır düzeninde ikon 20 px, başlık 2 satır 37,5 px yan yana: içerik yüksekliği değişmez, kart 72 px'te KALIR (ölçüldü). */ flex-direction: row; align-items: center; justify-content: flex-start; } /* Satır düzeninde başlık kalan genişliği alır; `min-width: 0` olmadan flex öğesinin taban genişliği `auto`dur ve uzun başlık kartı taşırırdı (K2 — bölüm 6.2'nin kart içindeki karşılığı). */ body.edulive-cihaz .hub-card__title { flex: 1 1 auto; min-width: 0; } /* :68-75 — 20px/1.25. 15 px başlık 143 px sütunda iki satıra sığar. */ body.edulive-cihaz .hub-card__title { font-size: 15px; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; /* Bölünemeyen uzun bir kelime sütunu taşırmasın (K2 savunması). */ overflow-wrap: anywhere; } /* :77-85 — 13,5px x 2 satır. Ekranın dörtte biri açıklama taşıyordu. */ body.edulive-cihaz .hub-card__desc { display: none; } /* --- Süs: ambient bloblar KAPALI -------------------------------------- ÖLÇÜM (360 px, bu tur): b1 [-80..483] 203 px · b2 [-142..340] 142 px · b3 [221..635] 275 px taşıyor. Taşan şey içerik değil SÜS. `body { overflow-x: hidden }` yetmez — o kural yalnız gövdenin kendi taşmasını gizler, taşıran öğe düzeni genişletmeye devam eder. Tek seçici hem MainLayout.razor:14-16 hem StudentLayout.razor:18-19'u kapatır. Kazanç iki yönlü: taşma biter VE aurora.css:174 `blur(100px)` + :178 `will-change: transform` + :190/:198/:210 sonsuz `drift` animasyonu her kareden çıkar. Kabul kriterleri K2 + K11. */ body.edulive-cihaz .blob { display: none; } } /* =========================================================================== 2 · DOKUNMATİK BANDI — @media (hover: none) and (pointer: coarse) TASARIM-MOBIL bölüm 6.3 + 6.4 Dokunmatikte imleç YOKTUR: hover animasyonu hiç oynamaz ama bedeli ödenir. ========================================================================= */ @media (hover: none) and (pointer: coarse) { /* --- Giriş alanı punto TABANI (K4) ------------------------------------- iOS, 16 px'in altındaki bir alana odaklanınca sayfayı yakınlaştırır ve düzen kayar. Tarayıcının form denetimi varsayılanı 13,33 px'tir ve KALITSAL DEĞİLDİR — bu yüzden hiçbir kural yazmayan her input tetikler. `:where()` gerekçesi dosya başında (TABAN'dır, TAVAN değil). */ :where(body.edulive-cihaz) input, :where(body.edulive-cihaz) select, :where(body.edulive-cihaz) textarea { font-size: max(16px, 1rem); } /* Yukarıdaki TABAN, kural yazmayan alanları kurtarır ama ölçüm gösterdi ki uygulamanın ASIL girdi stili ondan güçlü: AppField.razor.css:46 -> `.app-field[b-msg4o1o3ge] .app-input` (0,3,0) font-size: 14.5px — giriş ekranı dahil her AppTextField/AppSelect. Sıfır özgüllüklü taban (0,0,1) bunu YENEMEZ; canlı ölçümde giriş ekranı cihaz katmanına rağmen 14,5 px kalıyordu (iOS odaklanınca yakınlaştırır). (0,3,1) ile bilinçli ve YALNIZ bu bilinen-küçük değer yükseltilir: 14,5 -> 16. Kutu yüksekliği sabit 46 px (AppField.razor.css:52), taşma yok. */ body.edulive-cihaz .app-field .app-input { font-size: max(16px, 1rem); } /* --- Hover bedeli ------------------------------------------------------ HubCard.razor.css:21-25 üç özellikli geçiş + :48-56 translateY(-5px). Dokunmatikte :hover tıklamadan sonra YAPIŞIR (WebKit) — kart havada kalır. */ body.edulive-cihaz .hub-card { transition: none; } body.edulive-cihaz .hub-card:hover { transform: none; border-color: color-mix(in srgb, var(--hub-ton) 34%, transparent); box-shadow: none; } /* :28-46 — iki radial-gradient katman, yalnız hover'da görünür. */ body.edulive-cihaz .hub-card__glow { display: none; } body.edulive-cihaz .topbar-tenant:hover { transform: none; } /* Blob'un kapatılmadığı TEK dokunmatik hâl: >= 1280 px dokunmatik ekran (büyük dokunmatik monitör / 12,9 inç iPad manzarası 1366 px). Orada web düzeni çizilir ve blob görünür kalır — ama animasyon bedeli ödenmez. `will-change` tarayıcıya "ayrı katmana al" der; imleç olmayan ekranda `drift` hiç oynamaz, katman yine de bellekte durur. Telefon (bant 1) ve tablet (bant 3) zaten `display: none` yazar; bu kural onlar için ölü değildir, sadece etkisizdir — kaldırılırsa 1280+ dokunmatik ekran animasyonu geri kazanır. */ body.edulive-cihaz .blob { animation: none; will-change: auto; } /* --- Dokunma hedefi tabanı (K3) ---------------------------------------- ÖLÇÜM (360x780 ana ekran): .brand 38x38 (aurora.css:253-255 .brand-logo), .icon-btn 42x42 (:432-433), .avatar 42x42 (:461-462), .topbar-tenant yükseklik 42 (:385). Dördü de 44 px eşiğinin altında. 56 px'lik personel üst barında 44 px sığar. (TASARIM-MOBIL P3 madde 3'ün ana ekranı ilgilendiren kısmı; kalan 410 ekranlık süpürme P3'te.) */ body.edulive-cihaz .brand, body.edulive-cihaz .avatar, body.edulive-cihaz .topbar-tenant { min-width: 44px; min-height: 44px; } } /* =========================================================================== 3 · TABLET BANDI — 641-1023px + 1024-1279px YALNIZ dokunmatik TASARIM-MOBIL bölüm 5.4 (paket P3) — kabul kriteri K8 NEDEN İKİ SORGULU Tablet bir GENİŞLİK değil, bir CİHAZ SINIFIDIR. 1024 ve 1194 px'in ikisi de iPad'dir (12,9 inç portre / 11 inç manzara) ama eski tek-sorgulu bant onları masaüstü sayıyordu. İkinci sorgu yalnız `pointer: coarse` ile açılır: aynı genişlikteki bir Mac Catalyst penceresi fare taşır, eşleşmez. Tavan 1279 — gerekçesi dosya başındaki masaüstü sözleşmesinde. ÖLÇÜM (P3 öncesi, 834x1112, dokunmatik): ızgara `361px 361px` = 2 sütun · kart 361x140 · taşan öğe 2 · K1 20/11 ÖLÇÜLEN kullanılabilir genişlik (aurora.css:590 `.wrap` yanları clamp(24px,4.5vw,72px) + admin-users.css:11 `.au-page` yanları 8px): 744 -> 661 px · 834 -> 743 px · 1024 -> 906 px · 1194 -> 1066 px ========================================================================= */ @media (min-width: 641px) and (max-width: 1023px), (min-width: 1024px) and (max-width: 1279px) and (hover: none) and (pointer: coarse) { /* --- Izgara: 2 -> 3 sütun ---------------------------------------------- HubGrid.razor.css:5 masaüstü değeri `minmax(360px, 1fr)`; 743 px'lik bir iPad portresinde `floor((743+20)/380) = 2` sütun verir — spec bölüm 5.4'ün aritmetiği. `minmax(210px,1fr)` + 12 px boşlukla aynı genişlik `floor((743+12)/222) = 3` sütun verir. `auto-fill` KORUNDU (sabit `repeat(3,...)` DEĞİL): kart genişliği sabit kalır, sütun sayısı ekranla büyür — 641 px'te 2, 744'te 3, 1024/1194'te 4. Sabit 3 yazılsaydı 641 px'te sütun 200 px'in altına inip açıklama satırını ezerdi (tablette açıklama GÖRÜNÜR kalıyor, bölüm 5.4). 210 px alt sınırı ölçümle seçildi, yuvarlak sayı olduğu için değil: 744 px'in 3 sütunu için gereken tavan (661-24)/3 = 212,3 px. `.hub-grid--compact` de bu seçiciyle eşleşir (HubGrid.razor:4 iki sınıfı birlikte basar) -> 10 alt hub sayfası tablette de yoğunlaşır. */ body.edulive-cihaz .hub-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; } /* HubCard.razor.css:9-10 — 140 px / 28 px dolgu, 361 px'lik sütun içindi. ~215 px'lik sütunda 28 px dolgu içeriğe 159 px bırakıyor; 18 px bırakır 179. min-height 110: başlık 2 satır (42) + boşluk 8 + açıklama 2 satır (34) + dolgu 36 = 120 -> min-height bağlayıcı değil, TABAN'dır. */ body.edulive-cihaz .hub-card { min-height: 110px; padding: 18px; } /* :68-75 — 20px/1.25. 20 px başlık 179 px'lik içerik kutusunda "Planlama ve operasyon"u 3 satıra kırıyordu; 17 px 2 satıra sığdırır. Açıklama KAPATILMAZ (telefonun aksine) — tablette dikey bütçe var. */ body.edulive-cihaz .hub-card__title { font-size: 17px; line-height: 1.25; overflow-wrap: anywhere; } /* --- Süs: bloblar tablette de KAPALI (P1'den beri açık olan K2 borcu) --- ÖLÇÜM (834x1112, bu tur): b1 [394..954] 120 px, b2 [-140..340] 140 px taşıyor; üç blob da `filter: blur(100px)` ile canlı (aurora.css:174). P1 bunları yalnız telefonda kapatmıştı, tablet bandı hiç yazılmamıştı; spec bölüm 5.4 "tablette görünür kalır" diyordu ama gerekçesi ölçülmemişti. Ölçüldü: kazanç telefondakiyle AYNI (K2 2 -> 0, üç blur katmanı kalkıyor), bedel aynı süs. Masaüstünde (>= 1280) blob GÖRÜNÜR kalır — orası web'in kendi tasarımıdır, dokunulmaz (K9). */ body.edulive-cihaz .blob { display: none; } } /* =========================================================================== 4 · ÇUBUK BANDI — <= 1023px + 1024-1279px YALNIZ dokunmatik ALT GEZİNME ÇUBUĞU + "Diğer" sayfası — TASARIM-MOBIL bölüm 4 (paket P2) NEDEN AYRI BİR BANT Çubuk hem telefonda hem tablette görünür (bölüm 3.3 tablosu: iki bandın da kapsamında "sekme çubuğu" yazılı), masaüstünde GÖRÜNMEZ. P3 DÜZELTMESİ — ölçülen kusur: sorgu yalnız `max-width: 1023px` iken 11 inç iPad portrede (834) çubuğu gösterip MANZARADA (1194) gizliyordu; kullanıcı tableti çevirince gezinme kayboluyordu. İkinci sorgu bunu kapatır ve YALNIZ dokunmatikte açılır: aynı genişlikteki fareli pencere (Mac Catalyst, masaüstü tarayıcı) eşleşmez. >= 1280 px'te blok imleç türünden bağımsız olarak HİÇ eşleşmez — K9 korunur (kanıt: 1280/1920 ölçümü hem fare hem dokunmatik öykünmesiyle `display: none`). TABANI BURADA DEĞİL: `.cihaz-sekme{display:none}` css/app.css'tedir (gerekçe orada). Bu blok yalnız AÇAR ve biçimlendirir. ÖLÇÜM (360x780, TASARIM-MOBIL 7.1 sonrası durum): P1 sonunda ızgaraya kalan dikey alan 629 px'ti. Çubuk 56 px + iPhone ev çubuğu 34 px = 90 px alınca 539 px kalır; satır adımı 82 px (kart 72 + boşluk 10) -> floor((539+10)/82) = 6 satır x 2 sütun = 12 döşeme. K1 = 12 döşeme + 5 sekme + 4 üst-bar öğesi = 21 (eşik >= 16 toplam / >= 12 modül girişi). ========================================================================= */ @media (max-width: 1023px), (min-width: 1024px) and (max-width: 1279px) and (hover: none) and (pointer: coarse) { /* --- Ölçü sözleşmesi --------------------------------------------------- Tek yerden değişsin diye özel özellik. `--sekme-alt` GÜVENLİ ALAN'dır (kabul kriteri K6): iOS'ta ev çubuğu 34 px, Android jest çubuğunda WebView'ın bildirdiği kadar, ikisi de yoksa 0. Yedek değer ŞART — env() desteklenmezse `calc()` tamamen geçersiz olur ve çubuk yüksekliğini kaybederdi. */ body.edulive-cihaz { --sekme-h: 56px; --sekme-alt: env(safe-area-inset-bottom, 0px); } /* --- Çubuk ------------------------------------------------------------- z-index 65 SEÇİLMİŞ bir sayıdır, uydurma değil (bu turda tüm CSS tarandı): topbar 50 · sayfa içi açılırlar 55-61 · hesap menüsü 70 · modal/diyalog 80-92 · toast 1000. 65: içeriğin ve açılırların ÜSTÜNDE (çubuk kromdur, kaybolmamalı), menü ve diyalogların ALTINDA (tam ekran bir diyalog çubuğu örtmeli). backdrop-filter KULLANILMADI (M10): üst bar zaten blur(22px) taşıyor, ekranın altına ikinci bir bulanıklık katmanı eklemek dokunmatikte her karede yeniden hesap demekti. Opak zemin aynı işi bedelsiz yapıyor. */ body.edulive-cihaz .cihaz-sekme { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 65; height: calc(var(--sekme-h) + var(--sekme-alt)); padding-bottom: var(--sekme-alt); background: var(--yuzey); border-top: 1px solid var(--line); box-shadow: 0 -6px 22px -12px var(--scrim); } /* Yuva: 5 eşit parça. `minmax(0,...)` yerine `min-width: 0` — flex öğesinin taban genişliği `auto`dur ve uzun bir etiket ("Planlama") satırı taşırırdı (K2, bölüm 6.2'nin ızgaradaki karşılığı). 360 px'te yuva = 72 px; yükseklik 56 px -> dokunma hedefi 72x56, K3 eşiği 44 px'in üstünde. */ body.edulive-cihaz .cihaz-sekme__yuva { flex: 1 1 0; min-width: 0; min-height: 44px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0 2px; border: 0; background: transparent; color: var(--muted); text-decoration: none; font-family: var(--font-body); font-size: var(--yazi-sekme, 10.5px); font-weight: 500; line-height: 1; cursor: pointer; -webkit-tap-highlight-color: transparent; position: relative; } body.edulive-cihaz .cihaz-sekme__ikon { display: grid; place-items: center; width: 22px; height: 22px; } body.edulive-cihaz .cihaz-sekme__ikon svg { width: 22px; height: 22px; display: block; } /* Tek satır, taşarsa kısaltılır — "Planlama" 72 px'e sığar, sığmayan bir etiket gelirse sütunu genişletmek yerine üç nokta ile kesilir. */ body.edulive-cihaz .cihaz-sekme__etiket { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* --- Aktif yuva göstergesi (K6) ---------------------------------------- İKİ kanal birden: renk + üstte 3 px'lik çizgi. Yalnız renk bırakılsaydı renk körlüğünde tek ayırt edici kalmazdı; yalnız çizgi bırakılsaydı 22 px'lik ikonun yanında zayıf kalırdı. */ body.edulive-cihaz .cihaz-sekme__yuva.is-etkin { color: var(--marka-600); font-weight: 700; } body.edulive-cihaz .cihaz-sekme__yuva.is-etkin::before { content: ""; position: absolute; top: 0; left: calc(50% - 14px); width: 28px; height: 3px; border-radius: 0 0 3px 3px; background: var(--basari); } /* --- İçeriğin altına çubuk kadar pay ------------------------------------ ÖLÇÜM: aurora.css:590 `.wrap` alt dolgusu 80 px, StudentLayout.razor.css:142 `.student-wrap` 64 px. İkisi de 90 px'lik çubuğun altında kalırdı; sayfanın son satırı çubuğun arkasına girer ve dokunulamazdı. */ body.edulive-cihaz .wrap, body.edulive-cihaz .student-wrap { padding-bottom: calc(var(--sekme-h) + var(--sekme-alt) + 16px); } /* ========================================================================= "DİĞER" SAYFASI (sheet) — TASARIM-MOBIL bölüm 4.5 13 kart + 5 kısayol tek dokunuş uzağa iner (K7). ======================================================================= */ body.edulive-cihaz .cihaz-sheet__perde { display: block; position: fixed; inset: 0; z-index: 78; background: var(--scrim); } /* 78/79: çubuğun (65) ve hesap menüsünün (70) ÜSTÜNDE, kurum değiştirme modalinin (80) ALTINDA. Kendi kromumuz başkasının modalini örtmemeli. */ @keyframes cihazSekmeSayfa { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } body.edulive-cihaz .cihaz-sheet { display: flex; flex-direction: column; position: fixed; left: 0; right: 0; bottom: 0; z-index: 79; max-height: 76dvh; padding: 8px 14px calc(var(--sekme-h) + var(--sekme-alt) + 14px); background: var(--yuzey); border-radius: var(--kose-sayfa); box-shadow: 0 -18px 44px -16px var(--scrim); animation: cihazSekmeSayfa 0.2s var(--ease-smooth); } body.edulive-cihaz .cihaz-sheet__tut { width: 38px; height: 4px; margin: 2px auto 8px; border-radius: 999px; background: var(--n-300); } body.edulive-cihaz .cihaz-sheet__bas { display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; padding: 4px 0 12px; margin-bottom: 8px; border-bottom: 3px solid var(--basari); } body.edulive-cihaz .cihaz-sheet__baslik { margin: 0; font-family: var(--font-display); font-size: 16px; font-weight: 700; color: var(--marka-700); } /* Kapat: 36 px görsel kutu, çevresinde 44 px dokunma alanı. */ body.edulive-cihaz .cihaz-sheet__kapat { position: relative; height: 36px; min-height: 36px; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; border: 1px solid var(--hat-girdi); border-radius: var(--kose-dugme); background: var(--yuzey); color: var(--marka-600); font: 600 13px var(--font-body); cursor: pointer; -webkit-tap-highlight-color: transparent; } body.edulive-cihaz .cihaz-sheet__kapat::after { content: ""; position: absolute; inset: -4px; } /* Tek liste; uzun bölüm adları satır içinde sarılır. */ body.edulive-cihaz .cihaz-sheet__izgara { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; } body.edulive-cihaz .cihaz-sheet__giris { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 12px; border-bottom: 1px solid var(--hat-kart); border-left: 3px solid transparent; background: var(--yuzey); color: var(--fg); font-family: var(--font-body); font-size: 15px; font-weight: 500; line-height: 1.3; text-decoration: none; overflow-wrap: anywhere; } body.edulive-cihaz .cihaz-sheet__ikon { display: grid; place-items: center; flex: 0 0 18px; color: inherit; } body.edulive-cihaz .cihaz-sheet__ikon svg { width: 18px; height: 18px; display: block; } body.edulive-cihaz .cihaz-sheet__etiket { flex: 1; min-width: 0; } body.edulive-cihaz .cihaz-sheet__giris.is-etkin { color: var(--marka-600); font-weight: 700; border-left-color: var(--basari); background: color-mix(in srgb, var(--marka-500) 6%, var(--yuzey)); } body.edulive-cihaz .cihaz-sheet__secili { flex: 0 0 18px; width: 18px; height: 18px; } } @media (prefers-reduced-motion: reduce) { body.edulive-cihaz .cihaz-sheet { animation: none; } } /* =========================================================================== 5 · DOKUNMATİK BANDI — ÇUBUĞA ÖZGÜ EK Bant 2 ile aynı sorgu; ayrı blok çünkü P2'nin işi ve gerekçesi ayrı. ========================================================================= */ @media (hover: none) and (pointer: coarse) { /* Bu iki öğeye HİÇ :hover kuralı yazılmadı — dokunmatikte imleç yoktur ve WebKit'te :hover tıklamadan sonra yapışır, aktif göstergesiyle (K6) yarışırdı. Geri bildirim :active ile verilir; doğru olay odur. */ body.edulive-cihaz .cihaz-sekme__yuva:active, body.edulive-cihaz .cihaz-sheet__giris:active { opacity: 0.6; } } /* =========================================================================== 6 · DOKUNMA HEDEFİ SÜPÜRMESİ — @media (hover: none) and (pointer: coarse) TASARIM-MOBIL bölüm 7 / kabul kriteri K3 (paket P3, 3. madde) NEDEN AYRI BİR BLOK Bant 2 üst barın DÖRT öğesini elle 44 px'e çekmişti. Burada kalan 410 ekran var; tek tek gezmek mümkün değil, bu yüzden SINIF BAZLI süpürüldü. ÖLÇÜM (P3, 360 px, dokunmatik; yöntem: 508 .razor dosyasındaki her