Lompat ke isi

MediaWiki:Common.css: Perbedaan antara revisi

Dari Maliki Encyclopedia
Tidak ada ringkasan suntingan
Tidak ada ringkasan suntingan
Baris 1: Baris 1:
/* =====================================
/* =====================================
   MALIKI ENCYCLOPEDIA
   MALIKI ENCYCLOPEDIA
   Common.css FINAL v10.0
   Common.css FINAL v11.0
   World History Inspired Layout
   World History Inspired
===================================== */
===================================== */




/* =====================================
/* =========================
   GLOBAL
   GLOBAL
===================================== */
========================= */
 


body{
body{
 
     background:#ffffff;
     background:#f5f8f7;
 
     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 BANNER
   HERO SECTION
  World History Style
===================================== */
===================================== */




.me-hero{
.me-hero{
    width:100%;


     background:#f8f6ef;
     background:#f8f6ef;
Baris 75: Baris 61:
     overflow:hidden;
     overflow:hidden;


     margin:35px auto 60px;
     margin:25px auto 45px;


     text-align:center;
     text-align:center;
Baris 83: Baris 69:




/* banner image */
/* =========================
  HERO IMAGE
========================= */
 


.me-hero-image{
.me-hero-image{
Baris 94: Baris 83:


}
}




Baris 110: Baris 100:




/* hero text area */
/* =========================
  HERO TEXT
========================= */
 


.me-hero-content{
.me-hero-content{


     padding:35px 40px 45px;
     padding:20px 50px 35px;


}
}
Baris 120: Baris 113:




/* main title */
/* Nama Ensiklopedia */
 


.me-hero h1{
.me-hero h1{
Baris 128: Baris 122:
     font-size:58px;
     font-size:58px;


     font-weight:normal;
     font-weight:400;


     line-height:1.2;
     color:#006b54;


     color:#006b54;
     line-height:1.15;


     margin:0 auto 20px;
     margin:0 auto 10px;


     padding-bottom:15px;
     padding-bottom:10px;


     border-bottom:1px solid #ccc;
     border-bottom:1px solid #ccc;


     max-width:900px;
     max-width:850px;


}
}
Baris 146: Baris 140:




/* subtitle */
/* tagline */
 


.me-hero .tagline{
.me-hero .tagline{


     font-size:26px;
     font-size:25px;


     color:#24343b;
     color:#24343b;


     margin:25px auto;
     margin:18px auto 12px;


}
}
Baris 160: Baris 155:




/* description */
/* deskripsi */
 


.me-hero-content p{
.me-hero-content p{


     max-width:900px;
     font-size:18px;


     margin:15px auto;
     line-height:1.6;


     font-size:18px;
     max-width:850px;


     line-height:1.7;
     margin:10px auto;


}
}
Baris 177: Baris 173:


/* =====================================
/* =====================================
   FEATURED CONTENT
   FEATURED / PENGETAHUAN PILIHAN
  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:20px;
     gap:18px;
 
    max-width:1000px;


     margin:40px auto;
     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 */
/* =========================
  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:18px;
     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;
    width:auto;
    height:auto;


     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;


    font-size:21px;
     margin:10px 0 10px;
 
    font-weight:bold;
 
     margin:15px 0;


}
}
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.6;
     line-height:1.5;


}
}
Baris 288: Baris 284:




/* explore button */
/* 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:22px;
     margin-top:18px;


     color:#c79b2b;
     color:#c79b2b;
Baris 305: Baris 302:




.mw-parser-output .featured-item a:hover{


     color:#006b54;
/* =====================================
  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{
  SECTION TITLE
 
===================================== */
    max-width:120px;
 
    max-height:120px;
 
    object-fit:contain;


}


.mw-parser-output h2{


    margin-top:45px;


    border-bottom:1px solid #ccc;
.me-item h3{


     padding-bottom:8px;
     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:160px;
         height:150px;


     }
     }




     .me-hero-content{
     .me-hero-content{


         padding:25px 20px;
         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%;

    }


}