Jump to content

MediaWiki:Common.css: Difference between revisions

From Neoplasm
No edit summary
No edit summary
 
(29 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* =========================================================
/* =========================================================
   Neoplasm / HemOnc – Global Site Styles
   Neoplasm / HemOnc – Global Site Styles (FINAL)
   ========================================================= */
   ========================================================= */
/* ---------------------------------------------------------
  0. Global font size
  --------------------------------------------------------- */
body {
  font-size: 12px; /* change to 13–15px if you want larger overall text */
}




Line 13: Line 21:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   2. Typography (Google-Docs–like editing)
   2. Typography helpers (Google-Docs–like editing)
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-center {
.neoplasm-center {
   text-align: center;
   text-align: center;
}
.neoplasm-title {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 2.2em;
  font-weight: 700;
  color: #003366;
  margin: 12px 0 20px 0;
}
}


Line 36: Line 36:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   3. Base tables
   3. Main Page hero title (authoritative)
  Use this instead of styling .neoplasm-title directly,
  because VisualEditor may strip spans but keeps the wrapper div.
  --------------------------------------------------------- */
.page-Main_Page .neoplasm-title-wrapper {
  display: block;
  width: 100%;
  text-align: center;
  margin: 1.2rem auto 1.6rem auto;
 
  font-family: Georgia, "Times New Roman", "Nimbus Roman", "Liberation Serif", serif;
  font-size: 1.9em;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #111;
}
 
 
/* ---------------------------------------------------------
  4. Optional: If you still use <span class="neoplasm-title"> anywhere
  (kept consistent with the wrapper)
  --------------------------------------------------------- */
.neoplasm-title {
  font-family: Georgia, "Times New Roman", "Nimbus Roman", "Liberation Serif", serif;
  font-size: 1.5em; /* smaller than wrapper; adjust if needed */
  font-weight: 600;
  color: #003366;
  margin: 12px 0 20px 0;
}
 
 
/* ---------------------------------------------------------
  5. Base tables
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-table {
.neoplasm-table {
Line 43: Line 75:
   font-weight: bold;
   font-weight: bold;
   border-collapse: collapse;
   border-collapse: collapse;
  font-size: 0.85em;
}
}


Line 52: Line 85:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   4. Quick links table (equal-width cells)
   6. Quick links table (equal-width cells)
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-table--quicklinks {
.neoplasm-table--quicklinks {
Line 60: Line 93:


.neoplasm-table--quicklinks td {
.neoplasm-table--quicklinks td {
   width: 20%;   /* 5 equal columns */
   width: 20%; /* 5 equal columns */
   text-align: center;
   text-align: center;
}
}
Line 72: Line 105:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   5. Quick-link “chips”
   7. Quick-link “chips”
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-chip {
.neoplasm-chip {
Line 93: Line 126:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   6. Disease section headers
   8. Disease section headers
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-major {
.neoplasm-major {
Line 113: Line 146:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   7. Standard table cells
   9. Standard table cells
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-cell {
.neoplasm-cell {
Line 125: Line 158:


/* ---------------------------------------------------------
/* ---------------------------------------------------------
   8. Footer link
   10. Footer link
   --------------------------------------------------------- */
   --------------------------------------------------------- */
.neoplasm-footer-link {
.neoplasm-footer-link {
Line 135: Line 168:


/* =========================================================
/* =========================================================
   9. Vector 2022 – Sidebar behavior (FINAL, SAFE)
   11. Vector 2022 – Sidebar (FINAL SAFE VERSION)
   =========================================================
   Keeps sidebar normal + collapsible, avoids blank white column.
  ✔ Sidebar visible by default
  Also includes your spacing + font-size tweaks.
  ✔ Hamburger icon preserved
  ✔ Sidebar collapsible
  ✔ NO blank white column
   ========================================================= */
   ========================================================= */
@media (min-width: 1000px) {
@media (min-width: 900px) {
 
  /* Keep hamburger icon visible */
  .skin-vector-2022 .vector-main-menu-dropdown {
    display: inline-flex;
  }


   /* Encourage sidebar to be visible on load */
   /* Slightly tighter padding in sidebar */
   .skin-vector-2022 .vector-sidebar-container {
   .skin-vector-2022 .vector-sidebar {
     visibility: visible;
     padding-left: 0.5rem;
     transform: translateX(0);
     padding-right: 0.75rem;
   }
   }


   /* Keep the collapsible (hamburger) icon */
  .skin-vector-2022 .vector-menu {
   .skin-vector-2022 .vector-main-menu-dropdown {
    margin-left: 0;
     display: inline-flex;
  }
 
  .skin-vector-2022 .vector-menu-content {
    padding-left: 0.25rem;
  }
 
   /* Sidebar heading + link sizing */
   .skin-vector-2022 .vector-menu-heading {
     font-size: 1.05em;
   }
   }


   /* IMPORTANT:
   .skin-vector-2022 .vector-menu-content a {
    Do NOT add margin-left to mw-page-container
    font-size: 1.0em;
    Vector 2022 manages layout dynamically */
  }
}
}


/* =========================================================
/* =========================================================
   End of file
   End of file
   ========================================================= */
   ========================================================= */
/* Force dark blue in neoplasm tables EXCEPT the quick-links table */
.neoplasm-table:not(.neoplasm-table--quicklinks) td,
.neoplasm-table:not(.neoplasm-table--quicklinks) th,
.neoplasm-table:not(.neoplasm-table--quicklinks) td *,
.neoplasm-table:not(.neoplasm-table--quicklinks) th * {
  color: #003366 !important;
}
/* Remove left margin/padding to push sidebar flush left */
html, body {
    margin-left: 0 !important;
    padding-left: 0 !important;
}


/* =========================================================
#mw-page-base, #mw-head-base, #mw-head, #content, #mw-panel {
  Vector 2022 – Sidebar ALWAYS visible (desktop)
    margin-left: 0 !important;
  Robust version (avoids blank column + fights fewer internals)
    padding-left: 0 !important;
  ========================================================= */
}
@media (min-width: 900px) {


  /* 1) Make sure the left column exists and has a fixed width */
/* Ensure the sidebar container has no offset */
  .skin-vector-2022 .mw-page-container {
#mw-panel {
     grid-template-columns: 16rem minmax(0, 1fr) !important;
     left: 0 !important;
  }
    position: absolute; /* Keeps it fixed in place */
}


  /* 2) Ensure the left column (sidebar column) is visible */
/* Optional: Remove any inner padding in sidebar for tighter fit */
  .skin-vector-2022 .vector-column-start {
#mw-panel .portal {
     display: block !important;
     padding-left: 0.5em; /* Adjust if text feels too close to edge */
    width: 16rem !important;
}
  }


  /* 3) Force the actual sidebar container to be shown (some builds transform it off-canvas) */
  .skin-vector-2022 .vector-sidebar-container,
  .skin-vector-2022 .vector-sidebar {
    display: block !important;
    visibility: visible !important;
    transform: none !important;
    opacity: 1 !important;
  }


  /* 4) Keep the hamburger icon available */
#mw-panel .portal h3 .mw-portlet-body-toggle,
  .skin-vector-2022 .vector-main-menu-dropdown {
a[title="Hide"] { /* Or the exact class for the hide link */
     display: inline-flex !important;
     display: none !important;
  }
}
}


body {
#mw-panel {
  font-size: 12px;
    position: fixed !important;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    z-index: 10;
}
}


.neoplasm-title {
/* Bold the custom sidebar section headings: Update and Index */
  font-size: 1.5em;
#p-Update .vector-menu-heading,
#p-Index .vector-menu-heading {
    font-weight: bold !important;
    font-size: 1.05em; /* optional: keep consistent with your existing heading size */
}
}


.neoplasm-table {
/* Enlarge site title "Neoplasm" next to logo – larger version */
   font-size: 0.85em;
.mw-header .mw-wiki-title,
.vector-header .mw-wiki-title,
.header .mw-wiki-title a,
.mw-logo-wordmark,
#p-logo a span,
#mw-header-container a {
    font-size: 2.4em !important;   /* Adjust slightly: try 2.3em or 2.5em if needed */
    font-weight: bold !important;
    color: #002366 !important;    /* Dark blue to match your theme */
    line-height: 1 !important;
    margin-left: 0.6rem !important; /* Spacing from logo */
    display: block !important;
}
}


.vector-menu-content a {
/* Ensure header aligns logo and title properly */
  font-size: 0.8em;
.mw-header,
.vector-header,
.header-container {
    display: flex !important;
    align-items: center !important;
    padding: 0.8rem 0 !important;
}
}

Latest revision as of 10:10, 3 January 2026

/* =========================================================
   Neoplasm / HemOnc – Global Site Styles (FINAL)
   ========================================================= */


/* ---------------------------------------------------------
   0. Global font size
   --------------------------------------------------------- */
body {
  font-size: 12px; /* change to 13–15px if you want larger overall text */
}


/* ---------------------------------------------------------
   1. Hide Main Page title only
   --------------------------------------------------------- */
.page-Main_Page h1.firstHeading {
  display: none;
}


/* ---------------------------------------------------------
   2. Typography helpers (Google-Docs–like editing)
   --------------------------------------------------------- */
.neoplasm-center {
  text-align: center;
}

.neoplasm-hero-subtitle {
  font-size: 1.15em;
  line-height: 1.55;
  max-width: 1100px;
  margin: 0 auto 24px auto;
}


/* ---------------------------------------------------------
   3. Main Page hero title (authoritative)
   Use this instead of styling .neoplasm-title directly,
   because VisualEditor may strip spans but keeps the wrapper div.
   --------------------------------------------------------- */
.page-Main_Page .neoplasm-title-wrapper {
  display: block;
  width: 100%;
  text-align: center;
  margin: 1.2rem auto 1.6rem auto;

  font-family: Georgia, "Times New Roman", "Nimbus Roman", "Liberation Serif", serif;
  font-size: 1.9em;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #111;
}


/* ---------------------------------------------------------
   4. Optional: If you still use <span class="neoplasm-title"> anywhere
   (kept consistent with the wrapper)
   --------------------------------------------------------- */
.neoplasm-title {
  font-family: Georgia, "Times New Roman", "Nimbus Roman", "Liberation Serif", serif;
  font-size: 1.5em; /* smaller than wrapper; adjust if needed */
  font-weight: 600;
  color: #003366;
  margin: 12px 0 20px 0;
}


/* ---------------------------------------------------------
   5. Base tables
   --------------------------------------------------------- */
.neoplasm-table {
  width: 100%;
  text-align: center;
  font-weight: bold;
  border-collapse: collapse;
  font-size: 0.85em;
}

.neoplasm-table td,
.neoplasm-table th {
  padding: 8px 10px;
}


/* ---------------------------------------------------------
   6. Quick links table (equal-width cells)
   --------------------------------------------------------- */
.neoplasm-table--quicklinks {
  table-layout: fixed;
  width: 100%;
}

.neoplasm-table--quicklinks td {
  width: 20%; /* 5 equal columns */
  text-align: center;
}

.neoplasm-table-title {
  background-color: #737373;
  color: #ffffff;
  font-size: 1.3em;
}


/* ---------------------------------------------------------
   7. Quick-link “chips”
   --------------------------------------------------------- */
.neoplasm-chip {
  font-size: 1.1em;
  color: #ffffff;
}

.neoplasm-chip a,
.neoplasm-chip a:visited {
  color: #ffffff;
  text-decoration: none;
}

.neoplasm-chip--solid     { background-color: #08519c; }
.neoplasm-chip--malignant { background-color: #cf0001; }
.neoplasm-chip--peds      { background-color: #ba871a; }
.neoplasm-chip--tx        { background-color: #4a1486; }
.neoplasm-chip--classical { background-color: #31a354; }


/* ---------------------------------------------------------
   8. Disease section headers
   --------------------------------------------------------- */
.neoplasm-major {
  color: #ffffff;
  font-size: 1.5em;
}

.neoplasm-major--solid     { background-color: #08519c; }
.neoplasm-major--heme      { background-color: #cf0001; }
.neoplasm-major--peds      { background-color: #ba871a; }
.neoplasm-major--tx        { background-color: #4a1486; }
.neoplasm-major--classical { background-color: #31a354; }

.neoplasm-subheader {
  background-color: #bdd7e7;
  font-size: 1.2em;
}


/* ---------------------------------------------------------
   9. Standard table cells
   --------------------------------------------------------- */
.neoplasm-cell {
  background-color: #eff3ff;
}

.neoplasm-cell--w25 {
  width: 25%;
}


/* ---------------------------------------------------------
   10. Footer link
   --------------------------------------------------------- */
.neoplasm-footer-link {
  text-align: center;
  font-size: 1.2em;
  margin-top: 24px;
}


/* =========================================================
   11. Vector 2022 – Sidebar (FINAL SAFE VERSION)
   Keeps sidebar normal + collapsible, avoids blank white column.
   Also includes your spacing + font-size tweaks.
   ========================================================= */
@media (min-width: 900px) {

  /* Keep hamburger icon visible */
  .skin-vector-2022 .vector-main-menu-dropdown {
    display: inline-flex;
  }

  /* Slightly tighter padding in sidebar */
  .skin-vector-2022 .vector-sidebar {
    padding-left: 0.5rem;
    padding-right: 0.75rem;
  }

  .skin-vector-2022 .vector-menu {
    margin-left: 0;
  }

  .skin-vector-2022 .vector-menu-content {
    padding-left: 0.25rem;
  }

  /* Sidebar heading + link sizing */
  .skin-vector-2022 .vector-menu-heading {
    font-size: 1.05em;
  }

  .skin-vector-2022 .vector-menu-content a {
    font-size: 1.0em;
  }
}

/* =========================================================
   End of file
   ========================================================= */
/* Force dark blue in neoplasm tables EXCEPT the quick-links table */
.neoplasm-table:not(.neoplasm-table--quicklinks) td,
.neoplasm-table:not(.neoplasm-table--quicklinks) th,
.neoplasm-table:not(.neoplasm-table--quicklinks) td *,
.neoplasm-table:not(.neoplasm-table--quicklinks) th * {
  color: #003366 !important;
}


/* Remove left margin/padding to push sidebar flush left */
html, body {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

#mw-page-base, #mw-head-base, #mw-head, #content, #mw-panel {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Ensure the sidebar container has no offset */
#mw-panel {
    left: 0 !important;
    position: absolute; /* Keeps it fixed in place */
}

/* Optional: Remove any inner padding in sidebar for tighter fit */
#mw-panel .portal {
    padding-left: 0.5em; /* Adjust if text feels too close to edge */
}


#mw-panel .portal h3 .mw-portlet-body-toggle,
a[title="Hide"] {  /* Or the exact class for the hide link */
    display: none !important;
}

#mw-panel {
    position: fixed !important;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    z-index: 10;
}

/* Bold the custom sidebar section headings: Update and Index */
#p-Update .vector-menu-heading,
#p-Index .vector-menu-heading {
    font-weight: bold !important;
    font-size: 1.05em;  /* optional: keep consistent with your existing heading size */
}

/* Enlarge site title "Neoplasm" next to logo – larger version */
.mw-header .mw-wiki-title,
.vector-header .mw-wiki-title,
.header .mw-wiki-title a,
.mw-logo-wordmark,
#p-logo a span,
#mw-header-container a {
    font-size: 2.4em !important;   /* Adjust slightly: try 2.3em or 2.5em if needed */
    font-weight: bold !important;
    color: #002366 !important;     /* Dark blue to match your theme */
    line-height: 1 !important;
    margin-left: 0.6rem !important; /* Spacing from logo */
    display: block !important;
}

/* Ensure header aligns logo and title properly */
.mw-header,
.vector-header,
.header-container {
    display: flex !important;
    align-items: center !important;
    padding: 0.8rem 0 !important;
}