Gamepedia Yardım Viki
Advertisement

Uzantı:Cheevos tarafından eklenen özel sayfa Özel:Achievements (tüm Gamepedia vikilerinde varsayılan), kullanıcının başarılarını ve başarı ilerlemesini listeler. Bazı vikiler, vikinin hörünüme daha iyi uyması için bu sayfayı yeniden şekillendirmek isteyebilir.

Seçim kılavuzu[]

Seçim Açıklama Öneriler
.mediawiki #p-achievement-list
Başarı kategorisi sekmeleri dahil tüm başarı listesinin kapsayıcısı.
#achievement_categories
Başarı kategorisi sekmeleri için kapsayıcı.
#achievement_categories .achievement_category_select
Her bir kategori sekmesi.
#achievement_categories .achievement_category_select.begin
En sol üstteki sekme için, kabın üzerine yuvarlak bir köşe eklemek için kullanılan özel bir seçici.
  • Yuvarlak köşe border-top-left-radius değiştirilerek ayarlanabilir
#achievement_categories .achievement_category_select.end
Kap üstüne yuvarlak bir köşe eklemek için en sağ üst sekme için özel bir seçici.
  • Yuvarlak köşe border-top-right-radius
.mediawiki #achievement_categories .achievement_category_select.end, .mediawiki #achievement_categories .achievement_category_select:last-child
En sağdaki her iki sekme için de özel bir seçici.
  • Bu, sekmelerin geri kalanındaki kenarlıklardan ayrı olarak ayarlanmış bir border-right öğesine sahiptir. Diğer sekmelerdeki kenarlığı değiştirmek isterseniz, bunu ayrı olarak da değiştirmeniz gerekir.
#achievement_categories .achievement_category_select[data-selected="true"]
Seçili olan kategori sekmesi.
.mediawiki .achievement_category
Şu anda gösterilen başarı listesi için kapsayıcı.
.achievement_category .p-achievement-row
Listedeki her bir bireysel başarı.
.achievement_category .p-achievement-row.earned
Kazanılan başarılar için seçici.
  • Kazanılmamış başarılar, stili .achievement_category .p-achievement-row'dan alır.
.p-achievement-row .p-achievement-icon > img
Her başarı satırındaki simgesi.
  • Bu, kazanılan başarılarda geçersiz kılınan varsayılan olarak uygulanan gri tonlamalı bir filtreye sahiptir. Bunu değiştirmek gerekli olmasa da, filter CSS özelliği değiştirilerek ayarlanabilir.
.p-achievement-row .p-achievement-progress .progress-background
Başarı ilerleme çubuğu.
  • Kap için çubuğa stil eklemek üzere bu seçiciyi kullanın. Gerçek geçerli ilerleme düzeyi .p-success-progress .progress-bar kullanılarak stillendirilebilir.
.p-achievement-progress .progress-bar
Başarı ilerleme çubuğunun içindeki ilerleme düzeyi.
  • Bu seçicinin background ve border değiştirerek mevcut başarı ilerlemesinin rengini değiştirebilirsiniz.

Örnek CSS[]

Aşağıda, başarılar sayfasının basit bir şekilde yeniden renklendirilmesi için örnek kod verilmiştir. CSS'deki renkleri wiki temanıza uyacak şekilde değiştirmek isteyebilirsiniz.

/**** BAŞARILAR ****/
/* tüm başarılar listesi için arka plan */
.mediawiki #p-achievement-list {
	background: #4f3169;
}

/* başarı kategorisi sekmeleri için kenarlık */
#achievement_categories .achievement_category_select {
	border-color: #9b61cf;
}

.mediawiki #achievement_categories .achievement_category_select.end,
.mediawiki #achievement_categories .achievement_category_select:last-child {
	border-color: #9b61cf;
}

/* mevcut başarı kategorisi sekmesi için arka plan */
#achievement_categories .achievement_category_select[data-selected="true"] {
	background: #9b61cf;
}

/* başarı listesi için sınır */
.mediawiki .achievement_category {
	border-color: #9b61cf;
}

/* kazanılan başarıyı yeniden renklendir */
.achievement_category .p-achievement-row.earned {
	border-color: #7f4fa8;
	background: rgba(127, 79, 168, 0.2);
}

/* başarı ilerleme çubuğunu yeniden renklendir */
.p-achievement-row .p-achievement-progress .progress-background {
	border-color: #7f4fa8;
}

/* başarı ilerleme çubuğunu yeniden renklendirme ilerleme düzeyi */
.p-achievement-progress .progress-bar {
	border-color: #7f4fa8;
	background: #b873f5;
}

Sonuç[]

Achievements style example.png

Advertisement