MediaWiki:Common.css: Difference between revisions

From RollerCoaster Tycoon Wiki Wiki, the RollerCoaster Tycoon encyclopedia that anyone can edit.
Content added Content deleted
(More little fixes)
(More tabbar fixes, add watchlist icon)
Line 83: Line 83:
height: 44px;
height: 44px;
width: 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 {
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 {
body.skin-vector div.mw-page-container header.mw-header #p-personal {
background-color: var(--rct-grey-7);
background-color: var(--rct-grey-7);
Line 152: Line 154:
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #right-navigation {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar #right-navigation {
margin-right: 0; }
margin-right: 0; }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar li.mw-list-item {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item {
margin: 2px 0 -1px 0;
margin: 2px 0 -1px 0;
border-top-left-radius: 4px;
border-top-left-radius: 4px;
Line 161: Line 163:
border-right: 1px solid var(--rct-grey-4);
border-right: 1px solid var(--rct-grey-4);
border-bottom: 1px solid var(--rct-grey-9); }
border-bottom: 1px solid var(--rct-grey-9); }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar li.mw-list-item a {
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar *:not(#p-cactions) li.mw-list-item a {
color: white;
color: white;
font-weight: bold;
font-weight: bold;
padding: 13px;
padding: 13px;
border-bottom: 0 !important; }
border-bottom: 0 !important; }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar 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-grey-7);
border-top: 1px solid var(--rct-grey-9);
border-top: 1px solid var(--rct-grey-9);
Line 172: Line 174:
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-grey-7); }
body.skin-vector div.mw-page-container #content > nav.vector-article-toolbar 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; }
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-grey-7);
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-grey-7); }
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 {
body.skin-vector div.mw-page-container #content #bodyContent {
background-color: var(--rct-grey-7);
background-color: var(--rct-grey-7);
Line 203: Line 231:
div.ridebox-list > table {
div.ridebox-list > table {
width: auto; }
width: auto; }

/*# sourceMappingURL=Common.css.map */

Revision as of 18:16, 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);
      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 {
      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);
      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);
      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);
      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 {
        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);
      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-grey-7);
          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-grey-7); }
        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-grey-7);
          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-grey-7); }
        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-grey-7);
      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; }