MediaWiki:Common.css

From VRChat Wiki
Revision as of 05:45, 28 July 2024 by Prismic247 (talk | contribs) (Temp Main Menu styles)

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 */

/* T-style like css. no longer needed: https://wiki.vrchat.com/index.php?title=Template:Infobox/styles.css&oldid=544
@import url("/index.php?title=Template:Infobox/styles.css&action=raw&ctype=text/css");
*/

/* Note: The MediaWiki code editor will sometimes give errors for css parameters like --pi-background. These may safely be ignored. */

/* Portable Infobox tweaks */
.portable-infobox {
--pi-background:#303030;
--pi-secondary-background:#272735;
--pi-border-color:#a2a9b1;
--pi-item-spacing:5px 10px;
--pi-margin:15px;
--pi-width:270px;
  border-radius: 10px;
  background:#303035;
  clear:right;
  float:right;
  font-size:.85em;
  margin:0 0 15px 15px;
  width:270px;
}

.pi-theme-community  {
--pi-secondary-background:#067d4f;
   border: 1px solid #b8ffdb;
   border-radius: 10px;
   background-color: #085c3f;
   color: #e5f5bf;
   margin-bottom: 0.5em;
   margin-left: 1em;
   padding: 0.2em;
   float: right;
   clear: right;
}

.pi-theme-official  {
--pi-secondary-background:#216aad;
   border: 1px solid #166bcd;
   border-radius: 10px;
   background-color: #064987;
   color: #f7f6a3;
   margin-bottom: 0.5em;
   margin-left: 1em;
   padding: 0.2em;
   float: right;
   clear: right;
}

.portable-infobox .pi-data-value > :not(ul) {
  margin:.5em 0;
}

/* Hide Main Page Title */
.page-Main_Page #firstHeading { display: none; }

/* Main Page Classes */
.page-Main_Page h2 {
    margin: 10px 10px 0;
}

.page-Main_Page h2:after {
    border-bottom: 0;
}

.page-Main_Page h3 {
    margin: 0 10px 10px;
}

.qm-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    column-gap: 20px;
    margin: 10px 0 20px;
}

.qm-box {
  flex: 1 1 20%;
  min-width: 20%;
  max-width: 50%;
  padding: 20px;
  font-size: large;
  background-color: #171e28;
  background-color: rgba(50, 90, 120, 0.1);
  border: 3px solid #102f5b;
  border: 3px solid rgba(20, 70, 140, 0.5);
  border-radius: 25px;
}

.qm-box.community {
  background-color: #1a251c;
  background-color: rgba(40, 140, 40, 0.1);
  border-color: #1a4c24;
  border-color: rgba(40, 120, 40, 0.5);
}

.qm-box.flex {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    column-gap: 10px;
    min-width: inherit;
    max-width: inherit;
}