MediaWiki:Common.css: Difference between revisions

From WikiAP
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
/*
/*
  * Aturan CSS ini diterapkan ke semua skin dan perangkat.
  * Kode CSS ini disesuaikan dari dokumentasi MediaWiki
  * Media queries digunakan untuk menyesuaikan tampilan di layar mobile.
  * untuk meningkatkan tampilan dan fungsionalitas.
* Tempatkan kode ini di bagian bawah file MediaWiki:Common.css Anda.
  */
  */


@media all and (max-width: 768px) {
/* Highlight section title upon navigation */
    /* Sembunyikan sidebar navigasi di perangkat mobile */
/* Menyorot judul bagian saat navigasi */
    #mw-navigation {
.mw-headline:target {
        display: none;
  background-color: gold; /* Warna latar belakang emas saat menjadi target */
    }
}


    /* Lebarkan area konten utama untuk mengisi seluruh lebar layar mobile */
/* Legacy patches */
    #content {
/* Perbaikan lama */
        margin-left: 0 !important; /* !important diperlukan untuk menimpa aturan default MediaWiki */
    }


     /* Sesuaikan ukuran font dasar untuk keterbacaan yang lebih baik di mobile */
/* Width optimization: Prevents too narrow appearance on mobile phones */
     body {
/* Optimalisasi lebar: Mencegah tampilan terlalu sempit di ponsel */
        font-size: 16px;
@media (max-width: 850px) {
     }
  #mw-content {
    padding: 0.5em 0.5em 3em; /* Padding untuk konten utama */
  }
  #firstHeading {
    width: 100%; /* Judul utama mengambil lebar penuh */
  }
  #mw-header-container {
     padding: 3.75em 0.5em 0.35em; /* Padding untuk kontainer header */
  }
  #site-navigation h2 {
     left: 0.5em; /* Posisi navigasi situs */
  }
  #p-logo-text {
    left: 3em; /* Posisi teks logo */
  }
  #user-tools h2 {
    right: 1em; /* Posisi alat pengguna */
  }
  #site-tools h2 {
     right: 4em; /* Posisi alat situs */
  }
}


    /* Pastikan gambar tidak meluap dari kontainer dan tetap proporsional */
/* Table of contents indentation patch (retrofits header level indentations if missing) */
    img {
/* Patch indentasi daftar isi (menambahkan indentasi level header jika hilang) */
        max-width: 100%;
#toc ul ul {
        height: auto;
  margin: 0 0 0 2em; /* Menambahkan margin kiri untuk indentasi */
    }
 
    /* Buat tabel bisa di-scroll secara horizontal jika terlalu lebar di mobile */
    table {
        display: block; /* Mengubah tabel menjadi elemen blok */
        overflow-x: auto; /* Mengaktifkan scrolling horizontal jika kontennya melebihi */
        white-space: nowrap; /* Mencegah teks dalam sel tabel pecah baris */
    }
 
    /* === Perbaikan spesifik skin tertentu (jika diperlukan) === */
    /*
    * Jika Anda menggunakan skin seperti Vector atau Monobook,
    * mungkin ada elemen lain yang perlu disesuaikan.
    * Contoh:
    * #mw-head { width: 100%; }
    * #mw-panel { display: none; }
    */
}
}

Revision as of 19:52, 5 June 2025

/*
 * Kode CSS ini disesuaikan dari dokumentasi MediaWiki
 * untuk meningkatkan tampilan dan fungsionalitas.
 */

/* Highlight section title upon navigation */
/* Menyorot judul bagian saat navigasi */
.mw-headline:target {
  background-color: gold; /* Warna latar belakang emas saat menjadi target */
}

/* Legacy patches */
/* Perbaikan lama */

/* Width optimization: Prevents too narrow appearance on mobile phones */
/* Optimalisasi lebar: Mencegah tampilan terlalu sempit di ponsel */
@media (max-width: 850px) {
  #mw-content {
    padding: 0.5em 0.5em 3em; /* Padding untuk konten utama */
  }
  #firstHeading {
    width: 100%; /* Judul utama mengambil lebar penuh */
  }
  #mw-header-container {
    padding: 3.75em 0.5em 0.35em; /* Padding untuk kontainer header */
  }
  #site-navigation h2 {
    left: 0.5em; /* Posisi navigasi situs */
  }
  #p-logo-text {
    left: 3em; /* Posisi teks logo */
  }
  #user-tools h2 {
    right: 1em; /* Posisi alat pengguna */
  }
  #site-tools h2 {
    right: 4em; /* Posisi alat situs */
  }
}

/* Table of contents indentation patch (retrofits header level indentations if missing) */
/* Patch indentasi daftar isi (menambahkan indentasi level header jika hilang) */
#toc ul ul {
  margin: 0 0 0 2em; /* Menambahkan margin kiri untuk indentasi */
}