MediaWiki:Common.css: Difference between revisions

From RollerCoaster Tycoon Wiki Wiki, the RollerCoaster Tycoon encyclopedia that anyone can edit.
Content added Content deleted
(Style user page link too)
(Improve legibility of article)
Line 192: Line 192:
border-bottom: 0 !important; }
border-bottom: 0 !important; }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item.selected {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item.selected {
background: var(--rct-grey-7);
background: var(--rct-white);
border-top: 1px solid var(--rct-grey-9);
border-top: 1px solid var(--rct-grey-9);
border-left: 1px solid var(--rct-grey-9);
border-left: 1px solid var(--rct-grey-9);
border-right: 1px solid var(--rct-grey-5);
border-right: 1px solid var(--rct-grey-5);
border-bottom: 1px solid var(--rct-grey-7); }
border-bottom: 1px solid var(--rct-white); }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item.selected a {
color: black; }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item:not(.selected) {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item:not(.selected) {
border-bottom-right-radius: 3px; }
border-bottom-right-radius: 3px; }
Line 214: Line 216:
border-bottom: 0 !important; }
border-bottom: 0 !important; }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions.selected {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions.selected {
background: var(--rct-grey-7);
background: var(--rct-white);
border-top: 1px solid var(--rct-grey-9);
border-top: 1px solid var(--rct-grey-9);
border-left: 1px solid var(--rct-grey-9);
border-left: 1px solid var(--rct-grey-9);
border-right: 1px solid var(--rct-grey-5);
border-right: 1px solid var(--rct-grey-5);
border-bottom: 1px solid var(--rct-grey-7); }
border-bottom: 1px solid var(--rct-white); }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions.selected a {
color: black; }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions:not(.selected) {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions:not(.selected) {
border-bottom-right-radius: 3px; }
border-bottom-right-radius: 3px; }
Line 226: Line 230:
padding: 13px; }
padding: 13px; }
body.skin-vector div.mw-page-container #content #bodyContent {
body.skin-vector div.mw-page-container #content #bodyContent {
background-color: var(--rct-grey-7);
background-color: var(--rct-white);
padding: 1.0em;
padding: 1.0em;
border-left: 1px solid var(--rct-grey-8);
border-left: 1px solid var(--rct-grey-8);

Revision as of 18:38, 29 January 2023

:root {
  --rct-indian-red: #b34f4f;
  --rct-indian-red-lighter: #c76767;
  --rct-indian-red-darker: #7b1312;
  --rct-dark-indian-red: #530000;
  --rct-light-grey: #839797;
  --rct-light-grey-lighter: #9fafaf;
  --rct-light-grey-darker: #5b7373;
  --rct-dark-grey: #3f5353;
  --rct-white: #d3dbdb;
  --rct-white-lighter: #eff3f3;
  --rct-white-darker: #9fafaf;
  --rct-white-inactive-tab-background: #b7c3c3;
  --rct-white-inactive-tab-darker: #839797;
  --rct-gold: #a76f07;
  --rct-gold-lighter: #bf8b0f;
  --rct-gold-darker: #773f00;
  --rct-dark-gold: #4b2200;
  --light-link: #66a5ff;
  --rct-indian-red-0: #230000;
  --rct-indian-red-1: #4F0000;
  --rct-indian-red-2: #5F0707;
  --rct-indian-red-3: #6F0F0F;
  --rct-indian-red-4: #7F1B1B;
  --rct-indian-red-5: #8F2727;
  --rct-indian-red-6: #A33B3B;
  --rct-indian-red-7: #B34F4F;
  --rct-indian-red-8: #C76767;
  --rct-indian-red-9: #D77F7F;
  --rct-indian-red-10: #EB9F9F;
  --rct-indian-red-11: #FFBFBF;
  --rct-grey-0: #172323;
  --rct-grey-1: #233333;
  --rct-grey-2: #2F4343;
  --rct-grey-3: #3F5353;
  --rct-grey-4: #4B6363;
  --rct-grey-5: #5B7373;
  --rct-grey-6: #6F8383;
  --rct-grey-7: #839797;
  --rct-grey-8: #9FAFAF;
  --rct-grey-9: #B7C3C3;
  --rct-grey-10: #D3DBDB;
  --rct-grey-11: #EFF3F3; }

body.skin-vector {
  background: url("https://static.miraheze.org/rctwiki/0/01/Mowedgrass.png"); }
  body.skin-vector div.mw-page-container {
    background-color: transparent; }
    body.skin-vector div.mw-page-container header.mw-header #mw-sidebar-button {
      background-color: var(--rct-grey-7);
      border-top: 1px solid var(--rct-grey-8);
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5);
      font-weight: bold;
      color: white;
      height: 44px;
      width: 44px; }
    body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-userpage-2 {
      background-color: var(--rct-grey-7);
      border-top: 1px solid var(--rct-grey-8);
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5);
      font-weight: bold;
      color: white;
      height: 44px;
      width: 44px;
      width: auto;
      display: inline-flex;
      align-items: center; }
    body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-notifications-alert {
      background-color: var(--rct-grey-7);
      border-top: 1px solid var(--rct-grey-8);
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5);
      font-weight: bold;
      color: white;
      height: 44px;
      width: 44px; }
      body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-notifications-alert a {
        background-image: url("https://static.miraheze.org/rctwiki/7/74/Notifications.png"); }
    body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-notifications-notice {
      background-color: var(--rct-grey-7);
      border-top: 1px solid var(--rct-grey-8);
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5);
      font-weight: bold;
      color: white;
      height: 44px;
      width: 44px; }
      body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-notifications-notice a {
        background-image: url("https://static.miraheze.org/rctwiki/4/4f/Newspaper.png"); }
    body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-watchlist-2 {
      background-color: var(--rct-grey-7);
      border-top: 1px solid var(--rct-grey-8);
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5);
      font-weight: bold;
      color: white;
      height: 44px;
      width: 44px; }
      body.skin-vector div.mw-page-container header.mw-header nav.vector-user-links ul.vector-menu-content-list > #pt-watchlist-2 a:before {
        background-image: url("https://static.miraheze.org/rctwiki/8/80/Watchlist-icon.png"); }
    body.skin-vector div.mw-page-container header.mw-header #p-personal {
      background-color: var(--rct-grey-7);
      border-top: 1px solid var(--rct-grey-8);
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5);
      font-weight: bold;
      color: white;
      height: 44px;
      width: 44px; }
    body.skin-vector div.mw-page-container #mw-panel {
      background-color: transparent; }
      body.skin-vector div.mw-page-container #mw-panel > * {
        padding: 0;
        background-color: var(--rct-indian-red);
        border-top: 1px solid var(--rct-indian-red-lighter);
        border-left: 1px solid var(--rct-indian-red-lighter);
        border-right: 1px solid var(--rct-indian-red-darker);
        border-bottom: 1px solid var(--rct-indian-red-darker);
        margin-left: 0;
        margin-right: 0; }
        body.skin-vector div.mw-page-container #mw-panel > * + * {
          margin-top: 1em; }
        body.skin-vector div.mw-page-container #mw-panel > * > *:first-child {
          background-color: var(--rct-indian-red-2);
          padding: 2px;
          color: var(--rct-white-lighter);
          text-align: center;
          font-weight: bold;
          border-top: 1px solid var(--rct-indian-red-5);
          border-left: 1px solid var(--rct-indian-red-5);
          border-right: 1px solid var(--rct-indian-red-8);
          border-bottom: 1px solid var(--rct-indian-red-8);
          font-family: sans-serif;
          margin: 0; }
        body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) {
          margin-left: 0;
          padding-bottom: 0.3em; }
          body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) li {
            padding-left: 0.5em; }
          body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) li:hover {
            background-color: var(--rct-indian-red-5); }
          body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) a {
            color: white; }
    body.skin-vector div.mw-page-container #content > header h1 {
      background-color: var(--rct-indian-red-2);
      padding: 2px;
      color: var(--rct-white-lighter);
      text-align: center;
      font-weight: bold;
      border-top: 1px solid var(--rct-indian-red-5);
      border-left: 1px solid var(--rct-indian-red-5);
      border-right: 1px solid var(--rct-indian-red-8);
      border-bottom: 1px solid var(--rct-indian-red-8);
      font-family: sans-serif;
      border-top: 1px solid var(--rct-indian-red-8);
      border-left: 1px solid var(--rct-indian-red-8);
      border-right: 1px solid var(--rct-indian-red-4); }
    body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar {
      background-color: var(--rct-indian-red-6);
      border-left: 1px solid var(--rct-indian-red-8);
      border-right: 1px solid var(--rct-indian-red-4);
      border-bottom: 1px solid var(--rct-grey-8);
      padding-left: 2px;
      padding-right: 2px; }
      body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar .mw-article-toolbar-container {
        border-bottom: 0; }
      body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #left-navigation {
        margin-left: 0; }
      body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #right-navigation {
        margin-right: 0; }
      body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item {
        margin: 2px 0 -1px 0;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        background: var(--rct-grey-6);
        border-top: 1px solid var(--rct-grey-8);
        border-left: 1px solid var(--rct-grey-8);
        border-right: 1px solid var(--rct-grey-4);
        border-bottom: 1px solid var(--rct-grey-9); }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item a {
          color: white;
          font-weight: bold;
          padding: 13px;
          border-bottom: 0 !important; }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item.selected {
          background: var(--rct-white);
          border-top: 1px solid var(--rct-grey-9);
          border-left: 1px solid var(--rct-grey-9);
          border-right: 1px solid var(--rct-grey-5);
          border-bottom: 1px solid var(--rct-white); }
          body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item.selected a {
            color: black; }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item:not(.selected) {
          border-bottom-right-radius: 3px; }
      body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions {
        margin: 2px 0 -1px 0;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        background: var(--rct-grey-6);
        border-top: 1px solid var(--rct-grey-8);
        border-left: 1px solid var(--rct-grey-8);
        border-right: 1px solid var(--rct-grey-4);
        border-bottom: 1px solid var(--rct-grey-9); }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions a {
          color: white;
          font-weight: bold;
          padding: 13px;
          border-bottom: 0 !important; }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions.selected {
          background: var(--rct-white);
          border-top: 1px solid var(--rct-grey-9);
          border-left: 1px solid var(--rct-grey-9);
          border-right: 1px solid var(--rct-grey-5);
          border-bottom: 1px solid var(--rct-white); }
          body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions.selected a {
            color: black; }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions:not(.selected) {
          border-bottom-right-radius: 3px; }
        body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #p-cactions label {
          color: white;
          font-weight: bold;
          padding: 13px; }
    body.skin-vector div.mw-page-container #content #bodyContent {
      background-color: var(--rct-white);
      padding: 1.0em;
      border-left: 1px solid var(--rct-grey-8);
      border-right: 1px solid var(--rct-grey-5);
      border-bottom: 1px solid var(--rct-grey-5); }
      body.skin-vector div.mw-page-container #content #bodyContent #mw-content-text {
        margin-top: 0; }

.main-page-game-thumbnail,
.main-page-addon-thumbnail {
  margin: auto;
  border-radius: 10px;
  box-shadow: 1px 1px 2px #222;
  overflow: hidden; }

.main-page-game-thumbnail {
  width: 140px;
  height: 140px; }

.main-page-addon-thumbnail {
  width: 120px;
  height: 120px; }

div.ridebox-list {
  display: flex;
  flex-wrap: wrap; }
  div.ridebox-list > table {
    width: auto; }