Hızlı başvuru

Feature Referansı

Çok sayfalı doküman kabuğu, bağımsız feature'lar ve hazır feature paketleri için dosya, bağımlılık ve yükleme özeti.

Feature'lar

Her feature tek bir davranış veya görsel sorumluluk taşır. base ortak tasarım zemini, docs-layout ise çok sayfalı doküman kabuğudur. Birden fazla feature'ı birlikte yükleyen hazır giriş noktaları feature-packages altında tutulur.

Feature	Amaç	Bağımlılık
`base`	Token, tipografi ve içerik bileşenleri	Yok
`author-link`	Header içinde kompakt yazar / ana site dönüş bağlantısı	`base`
`docs-layout`	Üst bar, Oxara marka işareti, sol site menüsü, sağ sayfa içi menü	`base`
`theme`	Light/dark tema tercihi	`base`
`code-highlight`	Kod renklendirme	`base`
`copy-code`	Kod kopyalama	`code-highlight`
`copy-table`	Key/value tablolarında satır değeri kopyalama	`base`
`code-tabs`	Yerel ve grup bazlı kod sekmeleri	`base`
`search`	Aktif sayfada Ctrl+K arama	`base`
`navigation-progress`	Aynı sekmedeki sayfa geçişlerinde ekranın altında ilerleme geri bildirimi	`base`

Hazır Paketler

Paketler feature değildir; birden fazla feature dosyasını ortak kullanım senaryoları için tek girişten yükler. Paket manifesti feature-packages/packages.json dosyasındadır; her paketin kapsadığı feature listesi manifestteki includes alanıyla aynı tutulur.

Paket	Amaç	İçerdiği feature'lar
`core`	Hafif site kabuğu	`base`, `author-link`, `theme`, `docs-layout`, `navigation-progress`
`full`	Tüm doküman feature seti	`base`, `author-link`, `theme`, `docs-layout`, `code-highlight`, `copy-code`, `copy-table`, `code-tabs`, `sidemenu`, `search`, `scroll-top`, `reading-progress`, `navigation-progress`

Custom Feature Seçimi

Hazır paketler ihtiyacınızdan büyükse, sadece kullanılacak feature dosyalarını taşıyın. Aşağıdaki tablo yaygın senaryolar için minimum başlangıç listesini verir; dosya sırası için bir sonraki bölümdeki Özel Paket Sırası kuralını izleyin.

Senaryo	Kopyalanacak feature'lar
Sadece tema	`base` + `theme`
Kod blokları	`base` + `code-highlight`
Kod blokları + copy-code	`base` + `code-highlight` + `copy-code`
Kopyalanabilir key/value tablo	`base` + `copy-table`
Header yazar bağlantısı	`base` + `author-link`
Çok sayfalı doküman	`base` + `author-link` + `docs-layout` + `navigation-progress`
Tek sayfalı yan menü	`base` + `sidemenu`
Arama	`base` + `search`
Başa dön	`base` + `scroll-top`
Okuma ilerlemesi	`base` + `reading-progress`
Sayfa geçişi geri bildirimi	`base` + `navigation-progress`

Özel Paket Sırası

Kendi paketinizi oluştururken dosyaları sadece ihtiyaca göre seçmek yetmez; bağımlı feature'lar önce yüklenmelidir. CSS tarafında temel tokenlar ve kapsayıcı davranışları önce, görsel ve etkileşim katmanları sonra gelir. JS tarafında da DOM üzerinde hazırlık yapan feature'lar, o çıktıya buton veya davranış ekleyen feature'lardan önce çalışmalıdır.

Katman	CSS sırası	JS sırası
Temel zemin	`base`, `author-link`	Yok
Doküman kabuğu	`theme`, `docs-layout`, `navigation-progress`	`theme`, `docs-layout`, `navigation-progress`
Kod örnekleri	`code-highlight`, `copy-code`, `copy-table`, `code-tabs`	`code-highlight`, `copy-code`, `copy-table`, `code-tabs`
Okuma araçları	`sidemenu`, `search`, `scroll-top`, `reading-progress`	`sidemenu`, `search`, `scroll-top`, `reading-progress`

<script src="features/theme/theme-boot.js"></script>
<link rel="stylesheet" href="features/base/base.css">
<link rel="stylesheet" href="features/author-link/author-link.css">
<link rel="stylesheet" href="features/theme/theme.css">
<link rel="stylesheet" href="features/docs-layout/docs-layout.css">
<link rel="stylesheet" href="features/code-highlight/code-highlight.css">
<link rel="stylesheet" href="features/copy-code/copy-code.css">
<link rel="stylesheet" href="features/copy-table/copy-table.css">
<link rel="stylesheet" href="features/code-tabs/code-tabs.css">
<link rel="stylesheet" href="features/search/search.css">

<script src="features/theme/theme.js"></script>
<script src="features/code-highlight/code-highlight.js"></script>
<script src="features/copy-code/copy-code.js"></script>
<script src="features/copy-table/copy-table.js"></script>
<script src="features/code-tabs/code-tabs.js"></script>
<script src="features/docs-layout/docs-layout.js"></script>
<script src="features/search/search.js"></script>

copy-code, code-highlight çıktısına buton eklediği için ondan sonra yüklenmelidir. Tema kullanan sayfalarda features/theme/theme-boot.js CSS dosyalarından önce çalışır; yalnızca geçerli light veya dark tercihini uygular ve ilk boyamada yanlış tema flash'ını önler. author-link, header içindeki ana site dönüş bağlantısını stillendirir ve docs-layout ile birlikte kullanılabilir. Hazır paketlerde bu sıra feature-packages/core.css, feature-packages/full.css, feature-packages/core.js ve feature-packages/full.js içinde korunur.

Core Paket Kurulumu

<script src="features/theme/theme-boot.js"></script>
<link rel="stylesheet" href="feature-packages/core.css">

<script src="feature-packages/core.js"></script>

core, çok sayfalı doküman kabuğunu çalıştırmak için gereken hafif pakettir. Tema, üst bar, sol menü, sayfa içi menü ve sayfa geçiş göstergesini birlikte yükler; kod renklendirme, kopyalama, arama ve okuma araçlarını içermez.

Full Paket Kurulumu

<script src="features/theme/theme-boot.js"></script>
<link rel="stylesheet" href="feature-packages/full.css">

<script src="feature-packages/full.js"></script>

full, template içindeki tüm ortak feature'ları tek girişten yükler. Kod blokları, kopyalama, kopyalanabilir tablolar, code tabs, arama, scroll-top ve okuma ilerlemesi gereken dokümanlarda kullanın. Daha küçük çıktı istiyorsanız core veya özel paket sırası ile tekil feature dosyalarını seçin.