Lompat ke isi

MediaWiki:Common.css: Perbedaan antara revisi

Dari Maliki Encyclopedia
← Revisi sebelumnyaRevisi selanjutnya →

ADMIN-ency (bicara | kontrib)

3 grup pengguna
1.008 suntingan
Tidak ada ringkasan suntingan
Tidak ada ringkasan suntingan
Baris 1: Baris 1:
/* =====================================
/* =====================================
   MALIKI ENCYCLOPEDIA
   MALIKI ENCYCLOPEDIA
   Common.css FINAL CLEAN v3.0
   Common.css FINAL CLEAN v3.1
===================================== */
===================================== */




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


body{
body{
background:#f5f8f7;
    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 */
/* =========================
  HOME CONTAINER
========================= */
 


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






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


.me-hero{
.me-hero{
background:#f8f6ef;
padding:45px;
border-radius:16px;
border:1px solid #ddd;
text-align:center;
margin:30px 0 50px;
}


    background:#f8f6ef;


.me-hero h1{
    padding:45px;
font-family:Georgia,serif;
font-size:42px;
color:#006b5b;
margin-bottom:15px;
}


    border-radius:16px;


.me-hero p{
    border:1px solid #ddd;
font-size:18px;
line-height:1.7;
margin:10px auto;
}


    text-align:center;


    margin:30px 0 50px;


/* CATEGORY MENU */
}


.me-explore{


display:grid;


grid-template-columns:repeat(5,1fr);
.me-hero h1{


gap:25px;
    font-family:Georgia,serif;


margin-bottom:60px;
    font-size:42px;


}
    color:#006b5b;


    margin-bottom:15px;


}


.me-explore-card{


background:#006b54;


height:170px;
.me-hero p{


border-radius:15px;
    font-size:18px;


padding:20px;
    line-height:1.7;


box-sizing:border-box;
    margin:10px auto;


display:flex;
}


flex-direction:column;


justify-content:center;


align-items:center;
/* =========================
  CATEGORY MENU
  5 KATEGORI UTAMA
========================= */


text-align:center;


color:white;
.me-explore{


transition:.3s;
    display:grid;


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


    gap:25px;


    margin:40px 0;


.me-explore-card:hover{
    width:100%;


background:#c79b2b;
}


transform:translateY(-5px);
}




.me-explore-card{


.me-icon{


font-size:38px;
    background:#006b54;


margin-bottom:10px;


}
    height:180px;




    border-radius:15px;


.me-explore-card h3{


color:white;
    padding:20px;


margin:8px 0;


}
    box-sizing:border-box;




    display:flex;


.me-explore-card p{


color:white;
    flex-direction:column;


font-size:14px;


line-height:1.5;
    justify-content:center;


margin:5px 0;


}
    align-items:center;




    text-align:center;


.me-explore-card a{


color:white;
    color:white;


font-weight:bold;


text-decoration:none;
    transition:.3s;


margin-top:10px;


}
}
Baris 170: Baris 157:




/* SECTION */
.me-explore-card:hover{


.me-home h2{
    background:#c79b2b;


color:#006b5b;
    transform:translateY(-5px);


border-bottom:1px solid #ddd;
}


padding-bottom:10px;


margin-top:50px;


}
.me-icon{


    font-size:38px;


    margin-bottom:10px;


/* FEATURED */
}


.me-featured{


display:grid;


grid-template-columns:2fr 1fr;
.me-explore-card h3{


gap:30px;
    color:white;


margin:40px 0;
    margin:10px 0;


}
}
Baris 202: Baris 187:




.me-feature-main{
.me-explore-card p{


background:white;
    color:white;


border:1px solid #ddd;
    font-size:14px;


border-radius:15px;
    line-height:1.5;


padding:30px;
    margin:5px 0;


display:flex;
}


flex-direction:column;
align-items:center;
}




.me-explore-card a{


.me-feature-main img{
    color:white;


max-width:350px;
    font-weight:bold;


height:auto;
    text-decoration:none;


border-radius:12px;
    margin-top:12px;


}
}
Baris 234: Baris 215:




.me-feature-side{
/* =========================
  BUTTON LINK
========================= */


display:flex;


flex-direction:column;
.me-link a{


gap:20px;
    background:#c79b2b;


}
    color:white;


    padding:6px 14px;


    border-radius:5px;


.me-feature-side div{
    font-weight:bold;


background:#f8f6ef;
    text-decoration:none;


border:1px solid #ddd;
    font-size:14px;


border-radius:12px;
}


padding:25px;


}


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




/* CARD */
.me-home h2{
 
.me-grid{


display:grid;
    color:#006b5b;


grid-template-columns:repeat(3,1fr);
    border-bottom:1px solid #ddd;


gap:30px;
    padding-bottom:10px;


margin:30px 0;
    margin-top:50px;


}
}




.me-card{


background:white;
/* =========================
  FEATURED KNOWLEDGE
========================= */


border:1px solid #ddd;


border-radius:12px;
.me-featured{


padding:20px;
    display:grid;


box-shadow:0 3px 8px rgba(0,0,0,.08);
    grid-template-columns:2fr 1fr;


}
    gap:30px;


    margin:40px 0;


}


.me-card img{


width:100%;


height:180px;
.me-feature-main{


object-fit:cover;
    background:white;


border-radius:10px;
    border:1px solid #ddd;


}
    border-radius:15px;


    padding:30px;


    display:flex;


/* RESPONSIVE */
    flex-direction:column;


    align-items:center;


@media(max-width:900px){
}


.me-explore{


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


}
.me-feature-main img{


    max-width:350px;


.me-featured{
    height:auto;


grid-template-columns:1fr;
    border-radius:12px;


}
}


}




.me-feature-side{


@media(max-width:600px){
    display:flex;


.me-explore{
    flex-direction:column;


grid-template-columns:1fr;
    gap:20px;


}
}




.me-hero{


padding:25px;
.me-feature-side div{


}
    background:#f8f6ef;


    border:1px solid #ddd;


.me-hero h1{
    border-radius:12px;


font-size:28px;
    padding:25px;


}
}


}


/* =================================
  FINAL MALIKI CATEGORY MENU
================================= */


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


.me-explore{


display:grid;
.me-grid{


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


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


margin:40px 0;
    gap:30px;


width:100%;
    margin:30px 0;


}
}
Baris 372: Baris 355:




.me-explore-card{
.me-card{


background:#006b54;
    background:white;


border-radius:15px;
    border:1px solid #ddd;


height:180px;
    border-radius:12px;


padding:20px;
    padding:20px;


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


display:flex;
    transition:.3s;


flex-direction:column;
}


justify-content:center;


align-items:center;


text-align:center;
.me-card:hover{


color:white;
    transform:translateY(-5px);
 
}


transition:.3s;


}


.me-card img{


    width:100%;


.me-explore-card:hover{
    height:180px;


background:#c79b2b;
    object-fit:cover;


transform:translateY(-5px);
    border-radius:10px;


}
}
Baris 412: Baris 395:




.me-explore-card h3{
/* =========================
  RESPONSIVE
========================= */
 
 
@media(max-width:900px){
 


color:white;
    .me-explore{


margin:10px 0;
        grid-template-columns:repeat(2,1fr);


}
    }




    .me-featured{


.me-explore-card p{
        grid-template-columns:1fr;


color:white;
    }


font-size:14px;


line-height:1.5;
    .me-grid{


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


    }


}


.me-icon{


font-size:38px;


margin-bottom:10px;
@media(max-width:600px){


}


    .me-explore{


        grid-template-columns:1fr;


.me-link{
    }


margin-top:12px;


}
    .me-grid{


        grid-template-columns:1fr;


    }


.me-link a{


background:#c79b2b;
    .me-hero{


color:white;
        padding:25px;


padding:6px 14px;
    }


border-radius:5px;


font-weight:bold;
    .me-hero h1{


text-decoration:none;
        font-size:28px;


font-size:14px;
    }


}
}

Revisi per 9 September 2026 16.55

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


/* =========================
   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
   5 KATEGORI UTAMA
========================= */


.me-explore{

    display:grid;

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

    gap:25px;

    margin:40px 0;

    width:100%;

}



.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;

}



/* =========================
   BUTTON LINK
========================= */


.me-link a{

    background:#c79b2b;

    color:white;

    padding:6px 14px;

    border-radius:5px;

    font-weight:bold;

    text-decoration:none;

    font-size:14px;

}



/* =========================
   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);

    transition:.3s;

}



.me-card:hover{

    transform:translateY(-5px);

}



.me-card img{

    width:100%;

    height:180px;

    object-fit:cover;

    border-radius:10px;

}



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


@media(max-width:900px){


    .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){


    .me-explore{

        grid-template-columns:1fr;

    }


    .me-grid{

        grid-template-columns:1fr;

    }


    .me-hero{

        padding:25px;

    }


    .me-hero h1{

        font-size:28px;

    }

}
Diperoleh dari "https://ency.uin-malang.ac.id/index.php?title=MediaWiki:Common.css&oldid=469"