MediaWiki:Common.css: Difference between revisions

Latest revision as of 12:14, 8 February 2026

/* =========================
   MOBILE VIEW FIX (MINERVA)
   ========================= */

@media screen and (max-width: 768px) {

  /* Hide left sidebar completely */
  #mw-panel,
  .mw-sidebar,
  .vector-sidebar-container,
  .vector-main-menu-container {
    display: none !important;
  }

  /* Full width content */
  #content,
  #mw-content-text,
  .mw-parser-output {
    margin-left: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Increase base font size */
  body {
    font-size: 18px !important;
    line-height: 1.6 !important;
  }

  /* Paragraph text */
  .mw-parser-output p {
    font-size: 18px !important;
    line-height: 1.7 !important;
  }

  /* Headings bigger like Wikipedia mobile */
  h1 {
    font-size: 26px !important;
  }

  h2 {
    font-size: 22px !important;
  }

  h3 {
    font-size: 20px !important;
  }

  h4 {
    font-size: 18px !important;
  }

  /* Infobox image responsiveness */
  .infobox,
  .infobox_v2,
  .infobox biography,
  .infobox img {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 auto 12px auto !important;
  }

  /* Make TOC readable */
  #toc,
  .toc {
    font-size: 16px !important;
  }

}
/* =========================
   EXTRA MOBILE TEXT BOOST
   ========================= */

@media screen and (max-width: 768px) {

  /* Main article paragraph text */
  .mw-parser-output p,
  .mw-parser-output li,
  .mw-parser-output dd {
    font-size: 19px !important;   /* पहले ~16–17px था */
    line-height: 1.8 !important;
  }

  /* Intro paragraph (lead section) */
  .mw-parser-output > p {
    font-size: 20px !important;
    line-height: 1.85 !important;
  }

  /* Section content spacing */
  .mw-parser-output {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

}
/* =========================
   MOBILE TEXT + IMAGE BALANCE FIX
   ========================= */

@media screen and (max-width: 768px) {

  /* Slightly reduce paragraph text */
  .mw-parser-output p,
  .mw-parser-output li,
  .mw-parser-output dd {
    font-size: 17px !important;   /* was 19–20px */
    line-height: 1.65 !important;
  }

  /* Lead intro paragraph */
  .mw-parser-output > p {
    font-size: 18px !important;   /* was 20px */
    line-height: 1.7 !important;
  }

  /* Reduce infobox / image size */
  .infobox img,
  .infobox_v2 img,
  .thumbinner img,
  .mw-parser-output img {
    max-width: 90% !important;
    height: auto !important;
  }

  /* Center image nicely */
  .thumbinner,
  .infobox,
  .infobox_v2 {
    margin: 0 auto 12px auto !important;
  }

}
/* =========================
   MOBILE FULL-WIDTH CONTENT FIX
   ========================= */

@media screen and (max-width: 768px) {

  /* Remove outer page padding */
  body,
  .mw-body,
  .mw-body-content,
  .content,
  #content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Remove inner article padding */
  .mw-parser-output,
  #mw-content-text,
  .content__inner {
    padding-left: 10px !important;   /* small safe gutter */
    padding-right: 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Make images align with text width */
  .thumbinner,
  .infobox,
  .infobox_v2 {
    margin-left: auto !important;
    margin-right: auto !important;
  }

}
/* =========================
   MOBILE HOME PAGE FIXES
   ========================= */

@media screen and (max-width: 768px) {

  /* 1) Hide "Home" page title on main page */
  body.page-Main_Page h1.firstHeading,
  body.page-Home h1.firstHeading {
    display: none !important;
  }

  /* 2) Make search box full width */
  body.page-Main_Page .mw-search-form,
  body.page-Home .mw-search-form {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
  }

  body.page-Main_Page .mw-search-input,
  body.page-Home .mw-search-input,
  body.page-Main_Page input[type="search"],
  body.page-Home input[type="search"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 3) Center buttons nicely */
  body.page-Main_Page .mw-search-button,
  body.page-Home .mw-search-button {
    margin-top: 10px !important;
  }

}
/* =========================
   MOBILE INPUTBOX SEARCH FIX
   ========================= */

@media screen and (max-width: 768px) {

  /* InputBox outer wrapper */
  .mw-inputbox-centered,
  .mw-inputbox-inline,
  .mw-inputbox {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* The actual input field */
  .mw-inputbox-centered input,
  .mw-inputbox-inline input,
  .mw-inputbox input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    font-size: 18px !important;
    padding: 10px 12px !important;
  }

  /* The search button */
  .mw-inputbox-centered button,
  .mw-inputbox-inline button,
  .mw-inputbox button,
  .mw-inputbox-centered input[type="submit"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 10px !important;
    font-size: 18px !important;
    padding: 10px 0 !important;
  }

}
/* =========================
   MOBILE CREATE PAGE LINK STYLE
   ========================= */

@media screen and (max-width: 768px) {

  .mw-mobile-create-page {
    color: #0645ad !important;
    cursor: pointer;
    text-decoration: underline;
  }

}

/* MediaWiki-style WhatsApp Support link (external link) */
.mw-parser-output a.external[href^="https://wa.me/"] {
  position: relative;
  padding-left: 26px;
  color: #0645ad;
  text-decoration: none;
}

/* WhatsApp icon exactly like MediaWiki action icons */
.mw-parser-output a.external[href^="https://wa.me/"]::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  background-image: url("https://upload.wikimedia.org/wikipedia/commons/6/6b/WhatsApp.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
/* Remove external link arrow for WhatsApp support */
.mw-parser-output a.external[href^="https://wa.me/"]::after {
  display: none !important;
}
/* Hide page title only on Home page */
.page-Home .firstHeading {
    display: none;
}

/* =================================================
   HIDE SPECIAL PAGES & UPLOAD FOR NON-ADMIN USERS
   ================================================= */

/* 1️⃣ Guest users (logged-out) */
body.mw-user-anon #n-specialpages,
body.mw-user-anon #t-upload {
    display: none !important;
}

/* 2️⃣ Logged-in normal users (NOT admin, NOT editor) */
body.mw-user-loggedin:not(.mw-group-sysop):not(.mw-group-editor) #n-specialpages,
body.mw-user-loggedin:not(.mw-group-sysop):not(.mw-group-editor) #t-upload {
    display: none !important;
}