MediaWiki:Common.css: Difference between revisions

From RollerCoaster Tycoon Wiki Wiki, the RollerCoaster Tycoon encyclopedia that anyone can edit.
Content added Content deleted
(Use feathered border for all ride icons)
No edit summary
Line 118: Line 118:
body.skin-vector div.mw-page-container #mw-panel {
body.skin-vector div.mw-page-container #mw-panel {
background-color: transparent; }
background-color: transparent; }
body.skin-vector div.mw-page-container #mw-panel > * {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu {
padding: 0;
padding: 0;
background-color: var(--rct-indian-red);
background-color: var(--rct-indian-red);
Line 127: Line 127:
margin-left: 0;
margin-left: 0;
margin-right: 0; }
margin-right: 0; }
body.skin-vector div.mw-page-container #mw-panel > * + * {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu + * {
margin-top: 1em; }
margin-top: 1em; }
body.skin-vector div.mw-page-container #mw-panel > * > *:first-child {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:first-child {
background-color: var(--rct-indian-red-2);
background-color: var(--rct-indian-red-2);
padding: 2px;
padding: 2px;
Line 141: Line 141:
font-family: sans-serif;
font-family: sans-serif;
margin: 0; }
margin: 0; }
body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:nth-child(2) {
margin-left: 0;
margin-left: 0;
padding-bottom: 0.3em; }
padding-bottom: 0.3em; }
body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) li {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:nth-child(2) li {
padding-left: 0.5em; }
padding-left: 0.5em; }
body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) li:hover {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:nth-child(2) li:hover {
background-color: var(--rct-indian-red-5); }
background-color: var(--rct-indian-red-5); }
body.skin-vector div.mw-page-container #mw-panel > * > *:nth-child(2) a {
body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:nth-child(2) a {
color: white; }
color: white; }
body.skin-vector div.mw-page-container #content > header h1 {
body.skin-vector div.mw-page-container #content > header h1 {
Line 270: Line 270:
-webkit-mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat; }
mask-repeat: no-repeat; }

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

Revision as of 22:29, 4 December 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 #vector-main-menu .vector-menu {
        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 #vector-main-menu .vector-menu + * {
          margin-top: 1em; }
        body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *: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 #vector-main-menu .vector-menu > *:nth-child(2) {
          margin-left: 0;
          padding-bottom: 0.3em; }
          body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:nth-child(2) li {
            padding-left: 0.5em; }
          body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *:nth-child(2) li:hover {
            background-color: var(--rct-indian-red-5); }
          body.skin-vector div.mw-page-container #mw-panel #vector-main-menu .vector-menu > *: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.ridebox {
    background-color: 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-grey-5);
    margin: 5px;
    border-radius: 4px; }
    div.ridebox-list > table.ridebox img {
      margin-top: 1.0em;
      -webkit-mask-image: url(https://static.miraheze.org/rctwiki/9/93/Feathered-border.png);
      mask-image: url(https://static.miraheze.org/rctwiki/9/93/Feathered-border.png);
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat; }

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