|
Sayfa, viki kenar çubuğunu ve logo alanını şekillendirmek için bir kılavuz sağlar. Bazı vikiler, vikinin kaplamasına daha iyi uyması için bu alan sayfasını yeniden şekillendirmek isteyebilir.
Kenar çubuğunu şekillendirmeyle ilgili önemli bir not, hem katlanabilir hem de katlanamayan kenar çubuğu ayarları için biçimlendirilmesi gerektiğidir. Ayar, tercihlerinize giderek ve "Vector kaplamasındaki kenar çubuğundaki öğelerin daraltılmasını etkinleştir" ayarını değiştirerek değiştirilebilir. Her iki mod da ayrı olarak değiştirilmesi gerekebilecek farklı varsayılan stillerle gelir.
Seçim kılavuzu[]
Seçim | Açıklama | Öneriler |
---|---|---|
div#mw-panel
|
Logo dahil tüm kenar çubuğu. | |
#p-logo
|
Logo bağlantısı için kapsayıcı. div # mw-panel 'in üzerinden bulunur.
|
|
#p-logo a
|
Logoyu arka plan olarak içeren logo bağlantısı. |
|
div#mw-panel div.portal
|
Kenar çubuğu bağlantılarının bölümü için kap. | |
div#mw-panel div.portal h3
|
Kenar çubuğundaki her bağlantı listesi için başlık. | |
.skin-hydradark #mw-panel.collapsible-nav .portal h3
|
Liste daraltılabilir kenar çubuğu modunda açık olduğunda kenar çubuğundaki her bir bağlantı listesinin başlığı. | |
.skin-hydradark #mw-panel.collapsible-nav .portal.collapsed h3
|
Liste daraltılabilir kenar çubuğu modunda kapatıldığında kenar çubuğundaki her bağlantı listesinin başlığı. | |
.mediawiki div#mw-panel div.portal div.body, #mw-panel.collapsible-nav .portal .body
|
Üstbilgi dahil değil, kenar çubuğundaki her bağlantı listesi için kapsayıcı. | |
div#mw-panel div.portal div.body ul li, #mw-panel.collapsible-nav .portal .body ul li
|
Kenar çubuğundaki her bir bağlantı için kap. | |
div#mw-panel div.portal div.body ul li a
|
Kenar çubuğundaki her gerçek iç bağlantı. |
|
div#mw-panel div#p-socialProfiles
|
Kenar çubuğundaki sosyal simgeler için "portal". | |
div#mw-panel div#p-socialProfiles h3
|
Sosyal portalın başlığı normalde boş. |
|
div.socialSidebar
|
Sosyal simgeler etrafında bir kapsayıcı. | |
div.socialLink
|
Bireysel sosyal bağlantılar. |
Örnek CSS[]

Bitmiş sonuç
Aşağıda, hem daraltılabilir hem de daraltılmış kenar çubuğu modlarında çalışan kenar çubuğunun basit bir yeniden renklendirilmesi için örnek kod verilmiştir. CSS'deki renkleri wiki temanıza uyacak şekilde değiştirmek isteyebilirsiniz.
/**** SIDEBAR ****/
/* kenar çubuğu bölüm başlıklarının arka planını biçimlendirme */
.mediawiki div#mw-panel div.portal h3 {
font-size: 80%;
padding: 0.5em;
background-color: #777;
border-radius: 2px;
}
/* kenar çubuğu başlıkları için metin stilleri */
.mediawiki div#mw-panel div.portal h3,
div#pageWrapper div#mw-panel h3 a {
text-transform: uppercase;
font-weight: bold;
color: #fff;
}
/* daraltılmış kenar çubuğu başlıklarının üzerine gelindiğinde alt çizgiyi kaldır */
#mw-panel.collapsible-nav .portal.collapsed h3:hover {
text-decoration: none;
}
/* daraltılabilir kenar çubuğu başlıklarında ok resmi değiştir */
.mediawiki div#mw-panel.collapsible-nav div.portal h3 {
padding-left:calc(16px + 0.5em);
background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22%3E %3Cpath d=%22M11.05 3.996l-.965-1.053-4.035 3.86-3.947-3.86L1.05 3.996l5 5 5-5%22 fill=%22%23fff%22/%3E %3C/svg%3E");
background-position: 0.5em center;
}
/* daraltılmış üstbilgiler için ok resmi değiştir */
.mediawiki #mw-panel.collapsible-nav .portal.collapsed h3 {
background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22%3E %3Cpath d=%22M11.05 3.996l-.965-1.053-4.035 3.86-3.947-3.86L1.05 3.996l5 5 5-5%22 transform=%22rotate(-90 6 6)%22 fill=%22%23fff%22/%3E %3C/svg%3E");
}
/* kenar çubuğu bölümlerindeki bazı varsayılan stilleri sıfırla */
#mw-panel.collapsible-nav .portal .body,
.mediawiki div#mw-panel div.portal div.body {
background: transparent;
margin-left: 0;
}
#mw-panel.collapsible-nav .portal .body ul,
div#mw-panel div.portal div.body ul {
padding-top: 0;
}
/* kenar çubuğu bağlantılarının arka planını biçimlendirme */
#mw-panel.collapsible-nav .portal .body ul li,
div#mw-panel div.portal div.body ul li {
padding: 0.35em 0.5em;
margin: 0.25em 0;
background: #000;
border-radius: 2px;
}
/* kenar çubuğu bağlantıları için metin stilleri */
.mediawiki div#mw-panel div.portal div.body ul li a,
div#mw-panel.collapsible-nav div.portal div.body ul li a {
color: #af6de8;
}
/* sosyal düğme bölümü için çeşitli temizlik işlemleri */
div#mw-panel div.portal#p-socialProfiles h3 {
display: none;
}
.socialSidebar {
width: 100%;
}
div#mw-panel.collapsible-nav div.portal#p-socialProfiles {
margin: 0.25em;
}