Ikwipedia:Main Page/styles.css: Difference between revisions
EnWikiAdmin (talk | contribs) No edit summary |
EnWikiAdmin (talk | contribs) No edit summary |
||
Line 1: | Line 1: | ||
/* Top Banner */ | /* Top Banner */ | ||
#mp-topbanner { | #mp-topbanner { | ||
background-color: #f9f9f9; | background-color: #f9f9f9; | ||
border: 1px solid #ddd; | border: 1px solid #ddd; | ||
padding: | padding: 0em; | ||
text-align: center; | text-align: center; | ||
margin-bottom: 1em; | margin-bottom: 1em; | ||
Line 25: | Line 16: | ||
#mp-topbanner p { | #mp-topbanner p { | ||
margin: 0 | margin: 0 0; | ||
} | } | ||
Line 32: | Line 23: | ||
display: flex; | display: flex; | ||
justify-content: space-between; | justify-content: space-between; | ||
gap: | gap: 0.5em; | ||
max-width: 1200px; | max-width: 1200px; | ||
margin: 0 auto; | margin: 0 auto; | ||
Line 41: | Line 32: | ||
{ | { | ||
flex: 1; | flex: 1; | ||
padding: 0. | padding: 0.4em; /* Match Wikipedia padding */ | ||
background-color: #f5faff; | background-color: #f5faff; | ||
border: 1px solid #cedff2; | border: 1px solid #cedff2; | ||
Line 58: | Line 49: | ||
/* Headings */ | /* Headings */ | ||
.mp-h2 { | .mp-h2 { | ||
font-size: 1. | font-size: 1.4em; | ||
font-weight: bold; | font-weight: bold; | ||
font-family: inherit; | font-family: inherit; | ||
background-color: #e6e6e6; /* Neutral heading background */ | background-color: #e6e6e6; /* Neutral heading background */ | ||
padding: 0. | padding: 0.7em; /* Match Wikipedia's heading padding */ | ||
margin: 0.0em 0; | margin: 0.0em 0; | ||
border: 1px solid #aaa; /* Border for headings */ | border: 1px solid #aaa; /* Border for headings */ | ||
Line 83: | Line 74: | ||
margin: 1em auto; | margin: 1em auto; | ||
max-width: 1200px; | max-width: 1200px; | ||
padding: 0. | padding: 0.4em; /* Match Wikipedia padding */ | ||
background-color: #faf5ff; | background-color: #faf5ff; | ||
border: 1px solid #ddcef2; | border: 1px solid #ddcef2; | ||
Line 96: | Line 87: | ||
/* Section Content */ | /* Section Content */ | ||
.mp-contains-float { | .mp-contains-float { | ||
padding: 0. | padding: 0.4em; /* Match Wikipedia padding */ | ||
} | } | ||
Line 133: | Line 124: | ||
border: 1px solid #aaa; | border: 1px solid #aaa; | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
padding: | padding: 0em; | ||
margin: | margin: 0em 0; | ||
font-size: 90%; | font-size: 90%; | ||
} | } |
Revision as of 01:45, 23 December 2024
/* Top Banner */
#mp-topbanner {
background-color: #f9f9f9;
border: 1px solid #ddd;
padding: 0em;
text-align: center;
margin-bottom: 1em;
}
#mp-topbanner h1 {
font-size: 1.8em;
margin: 0;
border-bottom: none;
font-family: inherit;
}
#mp-topbanner p {
margin: 0 0;
}
/* Main Content Layout */
#mp-upper {
display: flex;
justify-content: space-between;
gap: 0.5em;
max-width: 1200px;
margin: 0 auto;
}
#mp-left,
#mp-right
{
flex: 1;
padding: 0.4em; /* Match Wikipedia padding */
background-color: #f5faff;
border: 1px solid #cedff2;
}
#mp-left {
background-color: #f5fffa; /* Light green for left column */
border-color: #cef2e0; /* Green border */
}
#mp-right {
background-color: #f5faff; /* Light blue for right column */
border-color: #cedff2; /* Blue border */
}
/* Headings */
.mp-h2 {
font-size: 1.4em;
font-weight: bold;
font-family: inherit;
background-color: #e6e6e6; /* Neutral heading background */
padding: 0.7em; /* Match Wikipedia's heading padding */
margin: 0.0em 0;
border: 1px solid #aaa; /* Border for headings */
}
/* Column-Specific Heading Colors */
#mp-left .mp-h2 {
background-color: #cef2e0; /* Light green for left column headings */
border-color: #a3bfb1;
}
#mp-right .mp-h2 {
background-color: #cedff2; /* Light blue for right column headings */
border-color: #a3b0bf;
}
/* Lower Section */
#mp-lower,
#mp-bottom {
margin: 1em auto;
max-width: 1200px;
padding: 0.4em; /* Match Wikipedia padding */
background-color: #faf5ff;
border: 1px solid #ddcef2;
}
#mp-lower .mp-h2,
#mp-bottom .mp-h2 {
background-color: #ddcef2;
border-color: #afa3bf;
}
/* Section Content */
.mp-contains-float {
padding: 0.4em; /* Match Wikipedia padding */
}
.mp-contains-float::after {
content: "";
display: block;
clear: both;
}
/* Responsive Design */
@media (max-width: 875px) {
#mp-upper {
flex-direction: column;
}
}
/* Clearfix */
.clearfix::after {
content: "";
display: table;
clear: both;
}
/* Specific for Mobile */
@media screen and (max-width: 875px) {
#mp-upper,
#mp-lower,
#mp-bottom {
margin: 0.5em;
padding: 0.5em;
}
}
/* Basic box styling */
.test-box {
border: 1px solid #aaa;
background-color: #f8f9fa;
padding: 0em;
margin: 0em 0;
font-size: 90%;
}
/* Title styling within the box */
.test-box .test-title {
font-size: 120%;
font-weight: bold; /* Match bold headings */
background-color: #cef2e0; /* Light green background */
border-bottom: none; /* Remove horizontal line */
margin: 0 0 0.5em;
padding: 0.2em;
}
/* Sub-boxes */
.test-box .test-subbox {
border: 1px solid #ccc;
background-color: #ffffff;
padding: 0.5em;
margin-top: 0.5em;
}