Toggle menu
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:
/* CSS placed here will be applied to all skins */
/* CSS placed here will be applied to all skins */


/* Hide toolbox */
#p-tb {  
#p-tb {  
     display: none;  
     display: none;  
}
}


/* Hide Home page heading */
body.page-Home #firstHeading {
body.page-Home #firstHeading {
     display: none;
     display: none;
}
}


/* ============================= */
/* TREEVERSE FULL BACKGROUND    */
/* ============================= */
/* Remove default backgrounds that block body image */
html, body {
html, body {
     height: 100%;
     height: 100%;
    margin: 0;
    background: none !important;
}
}


body {
/* Vector 2022 wrapper */
     background-image: url("https://treeverse.wiki/images/8/84/Treeverse_background.jpg");
.vector-page {
     background-image: url("https://treeverse.wiki/images/8/84/Treeverse_background.jpg") !important;
     background-size: cover;
     background-size: cover;
     background-position: center center;
     background-position: center center;
Line 21: Line 31:
}
}


/* Main content box */
/* Older Vector fallback */
#mw-page-base,
#mw-head-base {
    background: transparent !important;
}
 
/* Keep content area readable */
.mw-body,
.mw-body,
.vector-body {
.vector-body {
     background-color: rgba(255, 255, 255, 0.97);
     background-color: rgba(255, 255, 255, 0.97) !important;
}
}




/* Force all links to be underlined */
/* ============================= */
/* FORCE LINK UNDERLINES        */
/* ============================= */
 
a,
a,
a:visited,
a:visited,
Line 34: Line 53:
     text-decoration: underline !important;
     text-decoration: underline !important;
}
}
/* Download buttons row */
 
 
/* ============================= */
/* DOWNLOAD BUTTON ROW          */
/* ============================= */
 
.download-row {
.download-row {
   display: flex;
   display: flex;
   flex-wrap: wrap;           /* wrap if super narrow */
   flex-wrap: wrap;
   justify-content: center;   /* center the row */
   justify-content: center;
   gap: 12px;                 /* space between buttons */
   gap: 12px;
   margin: 8px 0 16px;
   margin: 8px 0 16px;
}
}


/* Make the badge images responsive */
.download-row img {
.download-row img {
   width: clamp(140px, 28vw, 200px); /* 140–200px, scales with viewport */
   width: clamp(140px, 28vw, 200px);
   height: auto;
   height: auto;
   display: block;
   display: block;
}
}
/* ============================= */
/* SPOILER BLUR                  */
/* ============================= */


.spoiler {
.spoiler {
Line 55: Line 83:
   transition: filter 0.3s ease;
   transition: filter 0.3s ease;
}
}
.spoiler.revealed {
.spoiler.revealed {
   filter: none;
   filter: none;
}
}


/* Radio tabs (JS-free; requires $wgRawHtml=true and <html> wrapper) */
 
/* ============================= */
/* RADIO TABS                    */
/* ============================= */
 
.tvrt { margin: 12px 0; }
.tvrt { margin: 12px 0; }
.tvrt-nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:6px; margin-bottom: 10px; }
 
.tvrt-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 6px;
  margin-bottom: 10px;
}
 
.tvrt-item { display: contents; }
.tvrt-item { display: contents; }
.tvrt-tab { display:block; padding:6px 8px; border-radius:8px; text-decoration:none; border:1px solid #eee; background:#fff; cursor:pointer; }
.tvrt-tab:hover { background:#f5f5f5; }
.tvrt-panel { display:none; grid-column: 1 / -1; padding:12px; border:1px solid #e5e5e5; border-radius:10px; background:#fff; }


/* Show only the panel next to the checked radio */
.tvrt-tab {
.tvrt-item > input:checked + .tvrt-tab + .tvrt-panel { display:block; }
  display: block;
  padding: 6px 8px;
  border-radius: 8px;
  text-decoration: none;
  border: 1px solid #eee;
  background: #fff;
  cursor: pointer;
}
 
.tvrt-tab:hover { background: #f5f5f5; }
 
.tvrt-panel {
  display: none;
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
}
 
.tvrt-item > input:checked + .tvrt-tab + .tvrt-panel {
  display: block;
}


/* Optional: style the active tab */
.tvrt-item > input:checked + .tvrt-tab {
.tvrt-item > input:checked + .tvrt-tab { font-weight:700; border-color:#ccc; background:#fafafa; }
  font-weight: 700;
  border-color: #ccc;
  background: #fafafa;
}




/* ============================= */
/* LEADERBOARD TABLE FIX        */
/* ============================= */


/* Force vertical centering in leaderboard */
#leaderboardTable > tbody > tr > th,
#leaderboardTable > tbody > tr > th,
#leaderboardTable > tbody > tr > td {
#leaderboardTable > tbody > tr > td {
     vertical-align: middle !important;
     vertical-align: middle !important;
}
}