Temel yaklaşım

Başlangıç

Feature seçimi, kurulum ve yeni bir dokümanı ayağa kaldırmak için gereken minimum adımlar.

Feature Mantığı

Her feature küçük bir UI veya davranış parçasıdır. base ortak tasarım tokenlarını ve doküman stillerini sağlar; diğer feature'lar bunun üstüne kendi CSS/JS davranışını ekler.

Kural: Bir feature'ın CSS dosyasını taşıyorsanız, yanında features/base/base.css dosyasını da taşıyın.

İçerik ve yerleşimbase, docs-layout, theme

Kod örneklericode-highlight, copy-code, code-tabs

Okuma ve geçiş araçlarısearch, scroll-top, reading-progress, navigation-progress, sidemenu

Çok Sayfalı Kurulum

Handbook ve çok sayfalı rehberler için önerilen standart paketi aşağıdaki sırayla yükleyin. İhtiyaç duymadığınız opsiyonel feature'ları çıkarabilirsiniz.

<link rel="stylesheet" href="features/base/base.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/scroll-top/scroll-top.css">
<link rel="stylesheet" href="features/reading-progress/reading-progress.css">
<link rel="stylesheet" href="features/navigation-progress/navigation-progress.css">
<link rel="stylesheet" href="features/search/search.css">

<script src="features/theme/theme.js"></script>
<script src="features/docs-layout/docs-layout.js"></script>
<script src="features/code-highlight/code-highlight.js"></script>
<script src="features/copy-code/copy-code.js"></script>
<script src="features/scroll-top/scroll-top.js"></script>
<script src="features/reading-progress/reading-progress.js"></script>
<script src="features/navigation-progress/navigation-progress.js"></script>
<script src="features/search/search.js"></script>

Navigation Progress: Ek HTML veya yapılandırma istemez. CSS ve JS dosyaları yüklendiğinde aynı sekmede açılan sayfa bağlantılarını otomatik izler ve geçiş tamamlanana kadar ekranın altında ince bir ilerleme çizgisi gösterir.

Minimal Paketler

Senaryo	Kopyalanacak feature'lar
Sadece tema	`base` + `theme`
Kod blokları	`base` + `code-highlight`
Kod blokları + copy-code	`base` + `code-highlight` + `copy-code`
Çok sayfalı doküman	`base` + `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`

Taşıma Checklist

İhtiyacın olan feature'ları seç.
base/base.css dosyasını unutma.
Feature HTML iskeletini ilgili bölümden kopyala.
code-highlight ve copy-code kullanıyorsan script sırasına dikkat et.
Başlık tabanlı navigasyon için id alanlarını kontrol et.
.container yerine başka kapsayıcı kullanıyorsan opsiyonel config ekle.
Giriş sayfası konu kartlarının tamamını bağlantı yap; kart içinde tekrar eden CTA metni ve sabit yükseklik kullanma.