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
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* ===========================
/* ====================================
   ConquestPS Main Page polish (scoped)
   ConquestPS Wiki — Tropical Main Page
   =========================== */
   ==================================== */


/* --- General background --- */
body.page-Main_Page {
body.page-Main_Page {
   /* Subtle dark gradient background */
   background: url('/resources/assets/conquest-beach-bg.png') center top / cover no-repeat fixed;
  --bg1: #0f1014;
   background-attachment: fixed;
  --bg2: #121318;
   color: #fff;
   --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;
/* Overlay for readability */
body.page-Main_Page::before {
  content: "";
  position: fixed;
  inset: 0;
   background: rgba(0,0,0,0.45);
  z-index: -1;
}
}


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


/* --- HERO --- */
/* --- Hero section --- */
body.page-Main_Page .mainpage-hero {
.mainpage-hero {
   text-align: center;
   text-align: center;
   margin: 10px auto 28px;
   margin: 20px auto 40px;
  padding: 80px 20px 60px;
  color: #fff;
  text-shadow: 0 2px 10px rgba(0,0,0,0.6);
}
}


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


body.page-Main_Page .mainpage-title {
.mainpage-title {
   font-size: clamp(26px, 3.2vw, 38px);
   font-size: 36px;
   font-weight: 800;
   font-weight: 900;
   letter-spacing: .2px;
   color: #ffe26a;
   line-height: 1.2;
   margin-top: 10px;
   margin-top: 6px;
   text-shadow: 0 2px 18px rgba(0,0,0,0.7);
}
}


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


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


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


body.page-Main_Page .mainpage-card-link {
.mainpage-card-link {
   display: block;
   display: block;
   text-decoration: none !important;
   text-decoration: none !important;
Line 67: Line 77:
}
}


body.page-Main_Page .mainpage-card {
.mainpage-card {
  position: relative;
   background: rgba(255,255,255,0.08);
   background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
   border: 1px solid rgba(255,255,255,0.25);
   border: 1px solid rgba(255, 214, 90, .18);
   border-radius: 14px;
   border-radius: 16px;
   padding: 18px;
   padding: 18px 18px 16px;
  backdrop-filter: blur(4px);
   box-shadow: 0 10px 30px rgba(0,0,0,.25);
  transition: all .18s ease;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
   box-shadow: 0 6px 14px rgba(0,0,0,0.35);
  backdrop-filter: blur(6px);
display: flex;
justify-content: center;
align-items: center;
flex-flow: column;
min-height: 200px;
}
}


body.page-Main_Page .mainpage-card:hover {
.mainpage-card:hover {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.5);
   transform: translateY(-3px);
   transform: translateY(-3px);
  border-color: rgba(255,214,90,.4);
   box-shadow: 0 8px 22px rgba(0,0,0,0.5);
  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 {
.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: #ffe26a;
  font-size: 17px;
}
}


body.page-Main_Page .mainpage-card-title .badge {
.mainpage-card-desc {
   width: 26px; height: 26px;
   font-size: 14px;
  display: inline-grid;
   line-height: 1.45;
  place-items: center;
   opacity: .9;
   border-radius: 8px;
   color: #eee;
  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 --- */
/* --- Updates --- */
body.page-Main_Page .mainpage-updates {
.mainpage-updates {
  margin-top: 28px;
   background: rgba(0,0,0,0.45);
   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;
   border-radius: 14px;
   padding: 16px 18px;
   padding: 16px 20px;
}
   margin-top: 30px;
 
body.page-Main_Page .mainpage-updates h3 {
   margin: 0 0 8px;
  font-size: 16px;
  font-weight: 800;
   color: #fff;
   color: #fff;
  text-align: left;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.2);
}
}


body.page-Main_Page .mainpage-updates ul {
.mainpage-updates h3 {
   margin: 6px 0 0 18px;
  color: #ffe26a;
   margin-top: 0;
  font-size: 18px;
  font-weight: 700;
}
}


/* Optional: hide “Powered by MediaWiki” pill in Citizen footer */
/* Hide footer “powered by” */
.citizen-footer__poweredby { display: none !important; }
.citizen-footer__poweredby { display: none !important; }
#mw-data-after-content, #footer-sitetitle, .citizen-footer__bottom, #footer-places { display: none !important; }

Latest revision as of 21:08, 12 November 2025

/* ====================================
   ConquestPS Wiki — Tropical Main Page
   ==================================== */

/* --- General background --- */
body.page-Main_Page {
  background: url('/resources/assets/conquest-beach-bg.png') center top / cover no-repeat fixed;
  background-attachment: fixed;
  color: #fff;
}

/* Overlay for readability */
body.page-Main_Page::before {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: -1;
}

/* --- Layout base --- */
body.page-Main_Page .mw-parser-output {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 16px 80px;
  text-align: center;
}

/* --- Hero section --- */
.mainpage-hero {
  text-align: center;
  margin: 20px auto 40px;
  padding: 80px 20px 60px;
  color: #fff;
  text-shadow: 0 2px 10px rgba(0,0,0,0.6);
}

.mainpage-hero img {
  width: 160px;
  filter: drop-shadow(0 6px 12px rgba(0,0,0,0.6));
  margin-bottom: 10px;
}

.mainpage-title {
  font-size: 36px;
  font-weight: 900;
  color: #ffe26a;
  margin-top: 10px;
  text-shadow: 0 2px 18px rgba(0,0,0,0.7);
}

.mainpage-sub {
  font-size: 17px;
  opacity: .9;
}

/* --- Cards --- */
.mainpage-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 24px 0;
  padding: 0 12px;
}

@media (max-width: 1000px) {
  .mainpage-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .mainpage-grid { grid-template-columns: 1fr; }
}

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

.mainpage-card {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 14px;
  padding: 18px;
  backdrop-filter: blur(4px);
  transition: all .18s ease;
  box-shadow: 0 6px 14px rgba(0,0,0,0.35);
display: flex;
justify-content: center;
align-items: center;
flex-flow: column;
min-height: 200px;
}

.mainpage-card:hover {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.5);
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.5);
}

.mainpage-card-title {
  font-weight: 700;
  margin-bottom: 6px;
  color: #ffe26a;
  font-size: 17px;
}

.mainpage-card-desc {
  font-size: 14px;
  line-height: 1.45;
  opacity: .9;
  color: #eee;
}

/* --- Updates --- */
.mainpage-updates {
  background: rgba(0,0,0,0.45);
  border-radius: 14px;
  padding: 16px 20px;
  margin-top: 30px;
  color: #fff;
  text-align: left;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.2);
}

.mainpage-updates h3 {
  color: #ffe26a;
  margin-top: 0;
  font-size: 18px;
  font-weight: 700;
}

/* Hide footer “powered by” */
.citizen-footer__poweredby { display: none !important; }

#mw-data-after-content, #footer-sitetitle, .citizen-footer__bottom, #footer-places { display: none !important; }