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 CLEAN v3.1
   Common.css FINAL CLEAN v3.2
===================================== */
===================================== */


Baris 63: Baris 63:


}
}




Baris 77: Baris 76:


}
}




Baris 94: Baris 92:
/* =========================
/* =========================
   CATEGORY MENU
   CATEGORY MENU
  5 KATEGORI UTAMA
========================= */
========================= */




.me-explore{
.mw-parser-output .me-explore{


     display:grid;
     display:grid;


     grid-template-columns:repeat(5,1fr);
     grid-template-columns:repeat(5,minmax(0,1fr));


     gap:25px;
     gap:25px;
    width:100%;


     margin:40px 0;
     margin:40px 0;
    width:100%;


}
}
Baris 114: Baris 111:




.me-explore-card{
.mw-parser-output .me-explore-card{
 


     background:#006b54;
     background:#006b54;


     height:180px;
     height:180px;


     border-radius:15px;
     border-radius:15px;


     padding:20px;
     padding:20px;


     box-sizing:border-box;
     box-sizing:border-box;


     display:flex;
     display:flex;


     flex-direction:column;
     flex-direction:column;


     justify-content:center;
     justify-content:center;


     align-items:center;
     align-items:center;


     text-align:center;
     text-align:center;


     color:white;
     color:white;


     transition:.3s;
     transition:.3s;


}
}




Baris 164: Baris 147:


}
}




Baris 174: Baris 156:


}
}




Baris 184: Baris 165:


}
}




Baris 198: Baris 178:


}
}




Baris 210: Baris 189:


     margin-top:12px;
     margin-top:12px;
}
/* =========================
  BUTTON LINK
========================= */
.me-link a{
    background:#c79b2b;
    color:white;
    padding:6px 14px;
    border-radius:5px;
    font-weight:bold;
    text-decoration:none;
    font-size:14px;


}
}
Baris 275: Baris 229:


}
}




Baris 295: Baris 248:


}
}




Baris 307: Baris 259:


}
}




Baris 319: Baris 270:


}
}




Baris 352: Baris 302:


}
}




Baris 366: Baris 315:


     box-shadow:0 3px 8px rgba(0,0,0,.08);
     box-shadow:0 3px 8px rgba(0,0,0,.08);
    transition:.3s;
}
.me-card:hover{
    transform:translateY(-5px);


}
}




Baris 403: Baris 341:




     .me-explore{
     .mw-parser-output .me-explore{


         grid-template-columns:repeat(2,1fr);
         grid-template-columns:repeat(2,1fr);
Baris 430: Baris 368:




     .me-explore{
     .mw-parser-output .me-explore{


         grid-template-columns:1fr;
         grid-template-columns:1fr;
Baris 456: Baris 394:


     }
     }
}
/* =================================
  FIX MEDIAWIKI GRID WIDTH
================================= */
.mw-parser-output .me-explore{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:25px;
    width:100%;
    max-width:none;
}
.mw-parser-output .me-explore-card{
    width:auto;
}
@media(max-width:900px){
.mw-parser-output .me-explore{
grid-template-columns:repeat(2,1fr);
}
}
@media(max-width:600px){
.mw-parser-output .me-explore{
grid-template-columns:1fr;
}
}
/* =================================
  MALIKI HOME GRID FINAL FIX
================================= */
.mw-parser-output .me-explore{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:25px;
    width:100%;
    margin:40px 0;
}
.mw-parser-output .me-explore-card{
    width:100%;
    margin:0;
}
@media(max-width:900px){
.mw-parser-output .me-explore{
grid-template-columns:repeat(2,1fr);
}
}
@media(max-width:600px){
.mw-parser-output .me-explore{
grid-template-columns:1fr;
}


}
}

Revisi per 9 September 2026 17.13

/* =====================================
   MALIKI ENCYCLOPEDIA
   Common.css FINAL CLEAN v3.2
===================================== */


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

body{
    background:#f5f8f7;
    color:#24343b;
}


.firstHeading{
    color:#004f40;
}


a{
    color:#1f5f8b;
}


a:hover{
    color:#006b54;
}



/* =========================
   HOME CONTAINER
========================= */


.me-home{
    max-width:1200px;
    margin:auto;
}



/* =========================
   HERO
========================= */


.me-hero{

    background:#f8f6ef;

    padding:45px;

    border-radius:16px;

    border:1px solid #ddd;

    text-align:center;

    margin:30px 0 50px;

}


.me-hero h1{

    font-family:Georgia,serif;

    font-size:42px;

    color:#006b5b;

    margin-bottom:15px;

}


.me-hero p{

    font-size:18px;

    line-height:1.7;

    margin:10px auto;

}



/* =========================
   CATEGORY MENU
========================= */


.mw-parser-output .me-explore{

    display:grid;

    grid-template-columns:repeat(5,minmax(0,1fr));

    gap:25px;

    width:100%;

    margin:40px 0;

}



.mw-parser-output .me-explore-card{

    background:#006b54;

    height:180px;

    border-radius:15px;

    padding:20px;

    box-sizing:border-box;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    color:white;

    transition:.3s;

}


.me-explore-card:hover{

    background:#c79b2b;

    transform:translateY(-5px);

}


.me-icon{

    font-size:38px;

    margin-bottom:10px;

}


.me-explore-card h3{

    color:white;

    margin:10px 0;

}


.me-explore-card p{

    color:white;

    font-size:14px;

    line-height:1.5;

    margin:5px 0;

}


.me-explore-card a{

    color:white;

    font-weight:bold;

    text-decoration:none;

    margin-top:12px;

}



/* =========================
   SECTION TITLE
========================= */


.me-home h2{

    color:#006b5b;

    border-bottom:1px solid #ddd;

    padding-bottom:10px;

    margin-top:50px;

}



/* =========================
   FEATURED KNOWLEDGE
========================= */


.me-featured{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:30px;

    margin:40px 0;

}


.me-feature-main{

    background:white;

    border:1px solid #ddd;

    border-radius:15px;

    padding:30px;

    display:flex;

    flex-direction:column;

    align-items:center;

}


.me-feature-main img{

    max-width:350px;

    height:auto;

    border-radius:12px;

}


.me-feature-side{

    display:flex;

    flex-direction:column;

    gap:20px;

}


.me-feature-side div{

    background:#f8f6ef;

    border:1px solid #ddd;

    border-radius:12px;

    padding:25px;

}



/* =========================
   CARD CONTENT
========================= */


.me-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin:30px 0;

}


.me-card{

    background:white;

    border:1px solid #ddd;

    border-radius:12px;

    padding:20px;

    box-shadow:0 3px 8px rgba(0,0,0,.08);

}


.me-card img{

    width:100%;

    height:180px;

    object-fit:cover;

    border-radius:10px;

}



/* =========================
   RESPONSIVE
========================= */


@media(max-width:900px){


    .mw-parser-output .me-explore{

        grid-template-columns:repeat(2,1fr);

    }


    .me-featured{

        grid-template-columns:1fr;

    }


    .me-grid{

        grid-template-columns:repeat(2,1fr);

    }

}



@media(max-width:600px){


    .mw-parser-output .me-explore{

        grid-template-columns:1fr;

    }


    .me-grid{

        grid-template-columns:1fr;

    }


    .me-hero{

        padding:25px;

    }


    .me-hero h1{

        font-size:28px;

    }

}