Toggle menu
1
1
104
ConquestPS Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Common.css: Difference between revisions

MediaWiki interface page
No edit summary
No edit summary
Line 1: Line 1:
/* ===========================
/* ===========================
   ConquestPS – Main Page styles
   ConquestPS – Main Page polish (scoped)
   =========================== */
   =========================== */


/* Hero */
body.page-Main_Page {
.mainpage-hero {
  /* Subtle dark gradient background */
  --bg1: #0f1014;
  --bg2: #121318;
  --brand: #ffd65a;
  --brand-strong: #ffdf7b;
  --text-muted: rgba(255,255,255,0.72);
 
  background: radial-gradient(1200px 600px at 50% -10%, #1b1d25 0%, var(--bg2) 55%, var(--bg1) 100%) !important;
}
 
/* Centered page content */
body.page-Main_Page .mw-parser-output {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 16px 56px;
}
 
/* --- HERO --- */
body.page-Main_Page .mainpage-hero {
   text-align: center;
   text-align: center;
   margin: 10px auto 24px;
   margin: 10px auto 28px;
}
 
body.page-Main_Page .mainpage-hero .hero-logo {
  display: inline-block;
  margin-bottom: 10px;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.5));
}
}
.mainpage-title {
 
   font-size: 28px;
body.page-Main_Page .mainpage-title {
   font-size: clamp(26px, 3.2vw, 38px);
   font-weight: 800;
   font-weight: 800;
   letter-spacing: .3px;
   letter-spacing: .2px;
   margin-top: 8px;
  line-height: 1.2;
   margin-top: 6px;
}
}
.mainpage-sub {
 
   opacity: .8;
body.page-Main_Page .mainpage-sub {
   margin-top: 4px;
   margin-top: 6px;
   color: var(--text-muted);
}
}


/* Grid */
/* --- GRID & CARDS --- */
.mainpage-grid {
body.page-Main_Page .mainpage-grid {
   display: grid;
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 16px;
   gap: 18px;
  max-width: 1100px;
   margin: 26px 0 16px;
   margin: 24px auto;
  padding: 0 12px;
}
}
@media (max-width: 1000px) {
 
   .mainpage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1024px) {
   body.page-Main_Page .mainpage-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
}
@media (max-width: 560px) {
@media (max-width: 560px) {
   .mainpage-grid { grid-template-columns: 1fr; }
   body.page-Main_Page .mainpage-grid { grid-template-columns: 1fr; }
}
}


/* Cards */
body.page-Main_Page .mainpage-card-link {
.mainpage-card {
   display: block;
   background: rgba(255,214,90,.06);
   text-decoration: none !important;
   border: 1px solid rgba(255,214,90,.18);
   color: inherit !important;
  border-radius: 14px;
   padding: 16px 18px;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}
}
.mainpage-card:hover {
 
   background: rgba(255,214,90,.12);
body.page-Main_Page .mainpage-card {
   border-color: rgba(255,214,90,.35);
  position: relative;
   box-shadow: 0 6px 18px rgba(0,0,0,.35);
   background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
   transform: translateY(-2px);
   border: 1px solid rgba(255, 214, 90, .18);
  border-radius: 16px;
  padding: 18px 18px 16px;
   box-shadow: 0 10px 30px rgba(0,0,0,.25);
   transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
  backdrop-filter: blur(6px);
}
}


/* Make the whole card a link */
body.page-Main_Page .mainpage-card:hover {
.mainpage-card-link {
   transform: translateY(-3px);
   display: block;
   border-color: rgba(255,214,90,.4);
   color: inherit !important;
   background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
   text-decoration: none !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.35);
}
}


/* Card text */
body.page-Main_Page .mainpage-card-title {
.mainpage-card-title {
  display: flex;
   font-weight: 700;
  align-items: center;
  gap: 8px;
   font-weight: 800;
  color: var(--brand);
   margin-bottom: 6px;
   margin-bottom: 6px;
  color: #ffd65a;
}
}
.mainpage-card-title a {
 
   text-decoration: none !important;
body.page-Main_Page .mainpage-card-title .badge {
   color: #ffd65a !important;
   width: 26px; height: 26px;
   display: inline-block;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
   background: rgba(255,214,90,.12);
   border: 1px solid rgba(255,214,90,.25);
  font-size: 15px;
}
}
.mainpage-card-title a:hover,
 
.mainpage-card-link:hover .mainpage-card-title {
body.page-Main_Page .mainpage-card-desc {
   text-shadow: 0 0 6px rgba(255, 214, 90, 0.8);
  color: var(--text-muted);
   line-height: 1.5;
}
}


.mainpage-card-desc {
/* --- UPDATES --- */
   opacity: .85;
body.page-Main_Page .mainpage-updates {
   line-height: 1.45;
  margin-top: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
   border: 1px solid rgba(255,255,255,.08);
   border-radius: 14px;
  padding: 16px 18px;
}
}


/* Updates section */
body.page-Main_Page .mainpage-updates h3 {
.mainpage-updates {
   margin: 0 0 8px;
   max-width: 900px;
  font-size: 16px;
   margin: 28px auto 10px;
   font-weight: 800;
   padding: 0 12px;
   color: #fff;
}
}


/* ======= Footer polish (optional) ======= */
body.page-Main_Page .mainpage-updates ul {
.citizen-footer__poweredby {
   margin: 6px 0 0 18px;
   display: none !important; /* hide "Powered by MediaWiki" button */
}
}


/*
/* Optional: hide “Powered by MediaWiki” pill in Citizen footer */
  === Debug helper (temporary) ===
.citizen-footer__poweredby { display: none !important; }
  If you *still* see scrollable code boxes on the Main Page,
  it means the page is being parsed as <pre> due to leading spaces.
  You can uncomment the block below to “hide” that look while you fix
  the indentation, but don’t keep it long-term.
 
.mw-parser-output pre {
  background: transparent;
  border: 0;
  padding: 0;
  overflow: visible;
  white-space: normal;
  font-family: inherit;
  color: inherit;
}
*/

Revision as of 07:50, 12 November 2025

/* ===========================
   ConquestPS – Main Page polish (scoped)
   =========================== */

body.page-Main_Page {
  /* Subtle dark gradient background */
  --bg1: #0f1014;
  --bg2: #121318;
  --brand: #ffd65a;
  --brand-strong: #ffdf7b;
  --text-muted: rgba(255,255,255,0.72);

  background: radial-gradient(1200px 600px at 50% -10%, #1b1d25 0%, var(--bg2) 55%, var(--bg1) 100%) !important;
}

/* Centered page content */
body.page-Main_Page .mw-parser-output {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 16px 56px;
}

/* --- HERO --- */
body.page-Main_Page .mainpage-hero {
  text-align: center;
  margin: 10px auto 28px;
}

body.page-Main_Page .mainpage-hero .hero-logo {
  display: inline-block;
  margin-bottom: 10px;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.5));
}

body.page-Main_Page .mainpage-title {
  font-size: clamp(26px, 3.2vw, 38px);
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.2;
  margin-top: 6px;
}

body.page-Main_Page .mainpage-sub {
  margin-top: 6px;
  color: var(--text-muted);
}

/* --- GRID & CARDS --- */
body.page-Main_Page .mainpage-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin: 26px 0 16px;
}

@media (max-width: 1024px) {
  body.page-Main_Page .mainpage-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px) {
  body.page-Main_Page .mainpage-grid { grid-template-columns: 1fr; }
}

body.page-Main_Page .mainpage-card-link {
  display: block;
  text-decoration: none !important;
  color: inherit !important;
}

body.page-Main_Page .mainpage-card {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border: 1px solid rgba(255, 214, 90, .18);
  border-radius: 16px;
  padding: 18px 18px 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
  backdrop-filter: blur(6px);
}

body.page-Main_Page .mainpage-card:hover {
  transform: translateY(-3px);
  border-color: rgba(255,214,90,.4);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  box-shadow: 0 14px 36px rgba(0,0,0,.35);
}

body.page-Main_Page .mainpage-card-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  color: var(--brand);
  margin-bottom: 6px;
}

body.page-Main_Page .mainpage-card-title .badge {
  width: 26px; height: 26px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(255,214,90,.12);
  border: 1px solid rgba(255,214,90,.25);
  font-size: 15px;
}

body.page-Main_Page .mainpage-card-desc {
  color: var(--text-muted);
  line-height: 1.5;
}

/* --- UPDATES --- */
body.page-Main_Page .mainpage-updates {
  margin-top: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: 16px 18px;
}

body.page-Main_Page .mainpage-updates h3 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 800;
  color: #fff;
}

body.page-Main_Page .mainpage-updates ul {
  margin: 6px 0 0 18px;
}

/* Optional: hide “Powered by MediaWiki” pill in Citizen footer */
.citizen-footer__poweredby { display: none !important; }