MediaWiki:Citizen.css: Difference between revisions
MediaWiki interface page
More actions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* FULL WIDTH */ | /* ========================= | ||
MECHA COMET FULL THEME | |||
========================= */ | |||
/* PAGE WIDTH FIX */ | |||
.mw-body { | .mw-body { | ||
max-width: 1400px; | max-width: 1400px !important; | ||
margin: auto; | |||
margin: auto !important; | |||
} | } | ||
| Line 14: | Line 20: | ||
.mecha-home { | .mecha-home { | ||
text-align:center; | text-align: center; | ||
} | |||
.mecha-hero { | |||
margin-top: 20px; | |||
margin-bottom: 40px; | |||
} | } | ||
| Line 20: | Line 34: | ||
.mecha-logo { | .mecha-logo { | ||
margin-bottom: | margin-bottom: 10px; | ||
} | } | ||
| Line 27: | Line 41: | ||
color: var(--color-base-subtle); | color: var(--color-base-subtle); | ||
margin-top: | |||
margin-bottom: | margin-top: 6px; | ||
margin-bottom: 20px; | |||
font-size: 16px; | |||
} | } | ||
| Line 38: | Line 56: | ||
.mecha-buttons { | .mecha-buttons { | ||
display:flex; | display: flex; | ||
justify-content:center; | |||
gap: | justify-content: center; | ||
flex-wrap:wrap | |||
gap: 14px; | |||
flex-wrap: wrap; | |||
} | } | ||
| Line 50: | Line 70: | ||
background: var(--color-progressive); | background: var(--color-progressive); | ||
color:white !important; | color: white !important; | ||
padding: 10px 18px; | |||
border-radius: 10px; | |||
font-weight: 600; | |||
text-decoration: none !important; | |||
display: inline-block; | |||
} | |||
.mecha-btn:hover { | |||
transform: translateY(-2px); | |||
} | } | ||
/* MAIN GRID */ | |||
.mecha-layout { | |||
width: 100%; | |||
border-spacing: 24px; | |||
border-collapse: separate; | |||
table-layout: fixed; | |||
} | } | ||
. | .mecha-layout td { | ||
vertical-align: top; | |||
padding: 0; | |||
} | } | ||
/* COLUMN WIDTHS */ | |||
.mecha-layout td:nth-child(1), | |||
.mecha-layout td:nth-child(3) { | |||
width: 25%; | |||
} | |||
.mecha-layout td:nth-child(2) { | |||
width: 50%; | |||
} | } | ||
| Line 131: | Line 140: | ||
background: var(--color-surface-2); | background: var(--color-surface-2); | ||
border- | border: 1px solid var(--color-border); | ||
border-radius: 16px; | |||
padding: 20px; | |||
height: 100%; | |||
} | } | ||
| Line 145: | Line 156: | ||
.mecha-grid { | .mecha-grid { | ||
width:100%; | width: 100%; | ||
border-spacing: | border-spacing: 14px; | ||
} | } | ||
| Line 155: | Line 166: | ||
background: var(--color-surface-1); | background: var(--color-surface-1); | ||
padding: | padding: 16px; | ||
border-radius: 10px; | |||
text-align: center; | |||
font-weight: 600; | |||
} | } | ||
.mecha- | .mecha-grid td:hover { | ||
background- | background: var(--color-progressive-subtle); | ||
cursor: pointer; | |||
} | } | ||
/* MOBILE */ | |||
@media (max-width: 900px) { | |||
.mecha-layout, | |||
.mecha-layout tbody, | |||
.mecha-layout tr, | |||
.mecha-layout td { | |||
display: block; | |||
width: 100% !important; | |||
} | } | ||
. | .mecha-card { | ||
margin-bottom: 20px; | |||
} | } | ||
. | .mecha-buttons { | ||
flex-direction: column; | |||
align-items: center; | |||
} | } | ||
} | } | ||
Revision as of 14:03, 21 February 2026
/* =========================
MECHA COMET FULL THEME
========================= */
/* PAGE WIDTH FIX */
.mw-body {
max-width: 1400px !important;
margin: auto !important;
}
/* HERO */
.mecha-home {
text-align: center;
}
.mecha-hero {
margin-top: 20px;
margin-bottom: 40px;
}
.mecha-logo {
margin-bottom: 10px;
}
.mecha-subtitle {
color: var(--color-base-subtle);
margin-top: 6px;
margin-bottom: 20px;
font-size: 16px;
}
/* BUTTONS */
.mecha-buttons {
display: flex;
justify-content: center;
gap: 14px;
flex-wrap: wrap;
}
.mecha-btn {
background: var(--color-progressive);
color: white !important;
padding: 10px 18px;
border-radius: 10px;
font-weight: 600;
text-decoration: none !important;
display: inline-block;
}
.mecha-btn:hover {
transform: translateY(-2px);
}
/* MAIN GRID */
.mecha-layout {
width: 100%;
border-spacing: 24px;
border-collapse: separate;
table-layout: fixed;
}
.mecha-layout td {
vertical-align: top;
padding: 0;
}
/* COLUMN WIDTHS */
.mecha-layout td:nth-child(1),
.mecha-layout td:nth-child(3) {
width: 25%;
}
.mecha-layout td:nth-child(2) {
width: 50%;
}
/* CARDS */
.mecha-card {
background: var(--color-surface-2);
border: 1px solid var(--color-border);
border-radius: 16px;
padding: 20px;
height: 100%;
}
/* ECOSYSTEM GRID */
.mecha-grid {
width: 100%;
border-spacing: 14px;
}
.mecha-grid td {
background: var(--color-surface-1);
padding: 16px;
border-radius: 10px;
text-align: center;
font-weight: 600;
}
.mecha-grid td:hover {
background: var(--color-progressive-subtle);
cursor: pointer;
}
/* MOBILE */
@media (max-width: 900px) {
.mecha-layout,
.mecha-layout tbody,
.mecha-layout tr,
.mecha-layout td {
display: block;
width: 100% !important;
}
.mecha-card {
margin-bottom: 20px;
}
.mecha-buttons {
flex-direction: column;
align-items: center;
}
}