MediaWiki:Common.css: Perbedaan antara revisi
Tampilan
ADMIN-ency (bicara | kontrib) Tidak ada ringkasan suntingan |
ADMIN-ency (bicara | kontrib) Tidak ada ringkasan suntingan |
||
| Baris 1: | Baris 1: | ||
/* ===================================== | /* ===================================== | ||
MALIKI ENCYCLOPEDIA | MALIKI ENCYCLOPEDIA | ||
Common.css FINAL | Common.css FINAL v11.0 | ||
World History Inspired | World History Inspired | ||
===================================== */ | ===================================== */ | ||
/* | /* ========================= | ||
GLOBAL | GLOBAL | ||
========================= */ | |||
body{ | body{ | ||
background:#ffffff; | |||
background:# | |||
color:#24343b; | color:#24343b; | ||
} | } | ||
.firstHeading{ | .firstHeading{ | ||
color:#004f40; | color:#004f40; | ||
} | } | ||
a{ | a{ | ||
color:#1f5f8b; | color:#1f5f8b; | ||
} | } | ||
a:hover{ | a:hover{ | ||
color:#006b54; | color:#006b54; | ||
} | } | ||
/* | /* ========================= | ||
HOME CONTAINER | HOME CONTAINER | ||
========================= */ | |||
.me-home{ | .me-home{ | ||
| Baris 58: | Baris 47: | ||
/* ===================================== | /* ===================================== | ||
HERO | HERO SECTION | ||
===================================== */ | ===================================== */ | ||
.me-hero{ | .me-hero{ | ||
background:#f8f6ef; | background:#f8f6ef; | ||
| Baris 75: | Baris 61: | ||
overflow:hidden; | overflow:hidden; | ||
margin: | margin:25px auto 45px; | ||
text-align:center; | text-align:center; | ||
| Baris 83: | Baris 69: | ||
/* | /* ========================= | ||
HERO IMAGE | |||
========================= */ | |||
.me-hero-image{ | .me-hero-image{ | ||
| Baris 94: | Baris 83: | ||
} | } | ||
| Baris 110: | Baris 100: | ||
/* | /* ========================= | ||
HERO TEXT | |||
========================= */ | |||
.me-hero-content{ | .me-hero-content{ | ||
padding:35px | padding:20px 50px 35px; | ||
} | } | ||
| Baris 120: | Baris 113: | ||
/* | /* Nama Ensiklopedia */ | ||
.me-hero h1{ | .me-hero h1{ | ||
| Baris 128: | Baris 122: | ||
font-size:58px; | font-size:58px; | ||
font-weight: | font-weight:400; | ||
color:#006b54; | |||
line-height:1.15; | |||
margin:0 auto | margin:0 auto 10px; | ||
padding-bottom: | padding-bottom:10px; | ||
border-bottom:1px solid #ccc; | border-bottom:1px solid #ccc; | ||
max-width: | max-width:850px; | ||
} | } | ||
| Baris 146: | Baris 140: | ||
/* | /* tagline */ | ||
.me-hero .tagline{ | .me-hero .tagline{ | ||
font-size: | font-size:25px; | ||
color:#24343b; | color:#24343b; | ||
margin: | margin:18px auto 12px; | ||
} | } | ||
| Baris 160: | Baris 155: | ||
/* | /* deskripsi */ | ||
.me-hero-content p{ | .me-hero-content p{ | ||
font-size:18px; | |||
line-height:1.6; | |||
max-width:850px; | |||
margin:10px auto; | |||
} | } | ||
| Baris 177: | Baris 173: | ||
/* ===================================== | /* ===================================== | ||
FEATURED | FEATURED / PENGETAHUAN PILIHAN | ||
===================================== */ | ===================================== */ | ||
| Baris 184: | Baris 179: | ||
.mw-parser-output .featured-grid{ | .mw-parser-output .featured-grid{ | ||
display:flex; | display:flex !important; | ||
justify-content:center; | justify-content:center; | ||
| Baris 190: | Baris 185: | ||
align-items:flex-start; | align-items:flex-start; | ||
gap: | gap:18px; | ||
margin: | margin:30px auto; | ||
} | } | ||
| Baris 201: | Baris 194: | ||
/* item */ | /* item */ | ||
.mw-parser-output .featured-item{ | .mw-parser-output .featured-item{ | ||
| Baris 209: | Baris 203: | ||
text-align:center; | text-align:center; | ||
background:transparent; | |||
} | } | ||
| Baris 214: | Baris 210: | ||
/* | /* ========================= | ||
IMAGE BOX ONLY | |||
========================= */ | |||
.mw-parser-output .featured-image{ | .mw-parser-output .featured-image{ | ||
| Baris 232: | Baris 231: | ||
align-items:center; | align-items:center; | ||
margin-bottom: | margin-bottom:15px; | ||
} | } | ||
| Baris 239: | Baris 238: | ||
/* image */ | /* image */ | ||
.mw-parser-output .featured-image img{ | .mw-parser-output .featured-image img{ | ||
| Baris 245: | Baris 245: | ||
max-height:120px; | max-height:120px; | ||
object-fit:contain; | object-fit:contain; | ||
| Baris 257: | Baris 253: | ||
/* title */ | /* title */ | ||
.mw-parser-output .featured-item h3{ | .mw-parser-output .featured-item h3{ | ||
font-size:20px; | |||
color:#006b54; | color:#006b54; | ||
margin:10px 0 10px; | |||
margin: | |||
} | } | ||
| Baris 273: | Baris 268: | ||
/* description */ | /* description */ | ||
.mw-parser-output .featured-item p{ | .mw-parser-output .featured-item p{ | ||
| Baris 282: | Baris 278: | ||
font-size:14px; | font-size:14px; | ||
line-height:1. | line-height:1.5; | ||
} | } | ||
| Baris 288: | Baris 284: | ||
/* | /* link */ | ||
.mw-parser-output .featured-item a{ | .mw-parser-output .featured-item a{ | ||
| Baris 294: | Baris 291: | ||
display:inline-block; | display:inline-block; | ||
margin-top: | margin-top:18px; | ||
color:#c79b2b; | color:#c79b2b; | ||
| Baris 305: | Baris 302: | ||
/* ===================================== | |||
JELAJAH PENGETAHUAN | |||
===================================== */ | |||
.me-explore{ | |||
display:flex; | |||
justify-content:center; | |||
gap:18px; | |||
margin:35px auto; | |||
} | |||
.me-item{ | |||
width:300px; | |||
text-align:center; | |||
} | |||
.me-explore-card{ | |||
height:150px; | |||
background:#f8f6ef; | |||
border:1px solid #ddd; | |||
border-radius:8px; | |||
display:flex; | |||
justify-content:center; | |||
align-items:center; | |||
} | } | ||
| Baris 313: | Baris 351: | ||
.me-explore-card img{ | |||
max-width:120px; | |||
max-height:120px; | |||
object-fit:contain; | |||
} | |||
.me-item h3{ | |||
color:#006b54; | |||
} | } | ||
| Baris 338: | Baris 379: | ||
.mw-parser-output .featured-grid{ | .mw-parser-output .featured-grid, | ||
.me-explore{ | |||
flex-wrap:wrap; | flex-wrap:wrap; | ||
| Baris 355: | Baris 397: | ||
.me-hero-image img{ | .me-hero-image img{ | ||
height: | height:150px; | ||
} | } | ||
.me-hero-content{ | .me-hero-content{ | ||
padding: | padding:20px; | ||
} | } | ||
| Baris 374: | Baris 414: | ||
} | } | ||
| Baris 384: | Baris 423: | ||
.mw-parser-output .featured-item, | |||
.mw-parser-output .featured-item{ | .me-item{ | ||
width:100%; | width:100%; | ||
Revisi per 9 September 2026 21.14
/* =====================================
MALIKI ENCYCLOPEDIA
Common.css FINAL v11.0
World History Inspired
===================================== */
/* =========================
GLOBAL
========================= */
body{
background:#ffffff;
color:#24343b;
}
.firstHeading{
color:#004f40;
}
a{
color:#1f5f8b;
}
a:hover{
color:#006b54;
}
/* =========================
HOME CONTAINER
========================= */
.me-home{
max-width:1200px;
margin:0 auto;
}
/* =====================================
HERO SECTION
===================================== */
.me-hero{
background:#f8f6ef;
border:1px solid #ddd;
border-radius:12px;
overflow:hidden;
margin:25px auto 45px;
text-align:center;
}
/* =========================
HERO IMAGE
========================= */
.me-hero-image{
width:100%;
height:220px;
overflow:hidden;
}
.me-hero-image img{
width:100%;
height:220px;
object-fit:cover;
display:block;
}
/* =========================
HERO TEXT
========================= */
.me-hero-content{
padding:20px 50px 35px;
}
/* Nama Ensiklopedia */
.me-hero h1{
font-family:Georgia,serif;
font-size:58px;
font-weight:400;
color:#006b54;
line-height:1.15;
margin:0 auto 10px;
padding-bottom:10px;
border-bottom:1px solid #ccc;
max-width:850px;
}
/* tagline */
.me-hero .tagline{
font-size:25px;
color:#24343b;
margin:18px auto 12px;
}
/* deskripsi */
.me-hero-content p{
font-size:18px;
line-height:1.6;
max-width:850px;
margin:10px auto;
}
/* =====================================
FEATURED / PENGETAHUAN PILIHAN
===================================== */
.mw-parser-output .featured-grid{
display:flex !important;
justify-content:center;
align-items:flex-start;
gap:18px;
margin:30px auto;
}
/* item */
.mw-parser-output .featured-item{
width:300px;
flex:none;
text-align:center;
background:transparent;
}
/* =========================
IMAGE BOX ONLY
========================= */
.mw-parser-output .featured-image{
height:150px;
background:#f8f6ef;
border:1px solid #ddd;
border-radius:8px;
display:flex;
justify-content:center;
align-items:center;
margin-bottom:15px;
}
/* image */
.mw-parser-output .featured-image img{
max-width:120px;
max-height:120px;
object-fit:contain;
}
/* title */
.mw-parser-output .featured-item h3{
font-size:20px;
color:#006b54;
margin:10px 0 10px;
}
/* description */
.mw-parser-output .featured-item p{
max-width:250px;
margin:0 auto;
font-size:14px;
line-height:1.5;
}
/* link */
.mw-parser-output .featured-item a{
display:inline-block;
margin-top:18px;
color:#c79b2b;
font-weight:bold;
text-decoration:none;
}
/* =====================================
JELAJAH PENGETAHUAN
===================================== */
.me-explore{
display:flex;
justify-content:center;
gap:18px;
margin:35px auto;
}
.me-item{
width:300px;
text-align:center;
}
.me-explore-card{
height:150px;
background:#f8f6ef;
border:1px solid #ddd;
border-radius:8px;
display:flex;
justify-content:center;
align-items:center;
}
.me-explore-card img{
max-width:120px;
max-height:120px;
object-fit:contain;
}
.me-item h3{
color:#006b54;
}
/* =====================================
RESPONSIVE
===================================== */
@media(max-width:900px){
.mw-parser-output .featured-grid,
.me-explore{
flex-wrap:wrap;
}
}
@media(max-width:700px){
.me-hero-image,
.me-hero-image img{
height:150px;
}
.me-hero-content{
padding:20px;
}
.me-hero h1{
font-size:38px;
}
.me-hero .tagline{
font-size:20px;
}
.mw-parser-output .featured-item,
.me-item{
width:100%;
}
}