MediaWiki:Common.css

From IFWiki

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */

/* Hide "Dark mode" menu item for anonymous (not logged in) users */
li.ext-darkmode-link.mw-list-item {
  display: none;
}

/* Experimental: make background #222 instead of black in dark mode */
.client-darkmode div#mw-main-container {
  background-color: #ddd !important;
}

/* Get rid of dark mode moon icon */
.ext-darkmode-link::before {
  display: none;
}

/* Don't invert colours of calendar items, or of IFTF logo on Main Page */
.client-darkmode td.fc-event-container,
.client-darkmode .iftf-logo {
    filter: invert(1) hue-rotate(180deg);
}

/**** CALENDAR ****/

/* Get rid of "Go to date:" text */
.fc-left .oo-ui-fieldLayout-body {
  display:none;
}

/* The week/day/list options are not useful */
.fc-right .fc-button-group {
  visibility: hidden;
}

/* Colour of links on calendar items */
.fc-title {
  color: white !important;
}


/* Don't float TOC right */
#toc.toc { 
  float: none;
}

/* Hide header tabs on Special:Drilldown for Awards and Event dates tables */
/* Will need to revisit this when new tables are added */
ul#drilldown-tables-tabs li:nth-child(1),
ul#drilldown-tables-tabs li:nth-child(2) {
  display: none;
}

/* For two-column responsive main page */

.responsive-container {
  display: flex;
}
.responsive-column-1 {
  flex-shrink: 0; 
  flex-basis: 50%; 
  margin-right: 20px;
}

.responsive-column-2 {
  flex-basis: 50%;
}

@media only screen and (max-width: 700px) {
  .responsive-container {
    flex-direction: column;
  }
}

/* Spoiler */

.spoiler {
  filter: blur(0.5em);
}

.spoiler:hover { 
  filter: none;
}

/* <code> was red which made it look like a red link */
code {
  color: inherit;
}

/* To make PF tokens input type not too wide for small screens */
.pf-select2-container {
  width: 100%;
  min-width:200px !important;
}

/* Infobox used by Template:Software */
.ifwiki-infobox {
  float: right; 
  margin-left: 1em;
  font-size: 0.85em;
  max-width: 400px;
}

.ifwiki-infobox  th:not(.ifwiki-infobox-center) {
  text-align: left !important;
}

table.ifwiki-infobox td,
table.ifwiki-infobox th {
  vertical-align: top;
}

/* Reduce size of preview picture within Software form */
.pfImagePreviewWrapper {
  max-width: 400px;
}

.ifwiki-navbox {
  font-size: 0.85em;
  margin-left: auto;
  margin-right: auto;
  clear: both;
}

/* Form field that appears using "show on select" parameter */
.show-on-select {
  border: 1px solid blue; 
  padding: 1em; 
  margin: 1em;
}

.ifwiki-display-none {
  display: none;
}

/* Genre icons on game pages */
.genre-icon {
  float: left;
  text-align: center;
  margin-right: 0.5em;
  font-size: 90%;
  max-width: 76px; /* 50px image + 26px for long captions, exactly enough for the word "Psychedelic" */
}

blockquote {
  margin-left: 2em;
}