MediaWiki:Mobile.css: Difference between revisions

From RollerCoaster Tycoon Wiki Wiki, the RollerCoaster Tycoon encyclopedia that anyone can edit.
Content added Content deleted
(Apply all CSS to mobile too (for now))
(No difference)

Revision as of 10:46, 26 February 2022

: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; }

body.skin-vector,
body.skin-vector-legacy {
  /*background-color: var(--rct-indian-red);*/
  background: url("https://static.miraheze.org/rctwiki/0/01/Mowedgrass.png");
  /* Tabs like Main page, Discussion, etc. */
  /* Navigation boxes on the left */
  /* User links (top right) */
  /* Footer */ }
  body.skin-vector #mw-page-base,
  body.skin-vector-legacy #mw-page-base {
    /*background-color: var(--rct-indian-red);
    background-image: none;*/
    background: none; }
  body.skin-vector .mw-body,
  body.skin-vector-legacy .mw-body {
    background-color: #f5f5f5;
    border-top: 1px solid var(--rct-white-lighter);
    border-left-color: var(--rct-white-lighter);
    border-right-color: var(--rct-white-darker);
    border-bottom-color: var(--rct-white-darker); }
  body.skin-vector #left-navigation,
  body.skin-vector #right-navigation,
  body.skin-vector-legacy #left-navigation,
  body.skin-vector-legacy #right-navigation {
    margin-top: calc(2.5em - 2px); }
  body.skin-vector #left-navigation,
  body.skin-vector-legacy #left-navigation {
    padding-left: 3px; }
  body.skin-vector #left-navigation .vector-menu-tabs,
  body.skin-vector #right-navigation .vector-menu-tabs,
  body.skin-vector-legacy #left-navigation .vector-menu-tabs,
  body.skin-vector-legacy #right-navigation .vector-menu-tabs {
    background-image: none; }
  body.skin-vector #left-navigation ul.vector-menu-content-list li,
  body.skin-vector #right-navigation ul.vector-menu-content-list li,
  body.skin-vector #right-navigation .vector-menu-dropdown h3,
  body.skin-vector-legacy #left-navigation ul.vector-menu-content-list li,
  body.skin-vector-legacy #right-navigation ul.vector-menu-content-list li,
  body.skin-vector-legacy #right-navigation .vector-menu-dropdown h3 {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px; }
  body.skin-vector #left-navigation ul.vector-menu-content-list li.selected,
  body.skin-vector #right-navigation ul.vector-menu-content-list li.selected,
  body.skin-vector-legacy #left-navigation ul.vector-menu-content-list li.selected,
  body.skin-vector-legacy #right-navigation ul.vector-menu-content-list li.selected {
    background-color: #f5f5f5;
    border-left: 1px solid var(--rct-white-lighter);
    border-top: 1px solid var(--rct-white-lighter);
    border-right: 1px solid var(--rct-white-darker);
    border-bottom: 1px solid #f5f5f5; }
  body.skin-vector #left-navigation ul.vector-menu-content-list li:not(.selected),
  body.skin-vector #right-navigation ul.vector-menu-content-list li:not(.selected),
  body.skin-vector #right-navigation .vector-menu-dropdown h3,
  body.skin-vector-legacy #left-navigation ul.vector-menu-content-list li:not(.selected),
  body.skin-vector-legacy #right-navigation ul.vector-menu-content-list li:not(.selected),
  body.skin-vector-legacy #right-navigation .vector-menu-dropdown h3 {
    background-color: var(--rct-white-inactive-tab-background);
    border-left: 1px solid var(--rct-white-lighter);
    border-top: 1px solid var(--rct-white-lighter);
    border-right: 1px solid var(--rct-white-inactive-tab-darker);
    border-bottom: 1px solid var(--rct-white-inactive-tab-background);
    background-image: none; }
  body.skin-vector #left-navigation ul.vector-menu-content-list li a,
  body.skin-vector #right-navigation ul.vector-menu-content-list li a,
  body.skin-vector #right-navigation .vector-menu-dropdown h3,
  body.skin-vector-legacy #left-navigation ul.vector-menu-content-list li a,
  body.skin-vector-legacy #right-navigation ul.vector-menu-content-list li a,
  body.skin-vector-legacy #right-navigation .vector-menu-dropdown h3 {
    background-image: none;
    padding-top: 0.8em; }
  body.skin-vector #right-navigation .vector-menu-dropdown h3::after,
  body.skin-vector-legacy #right-navigation .vector-menu-dropdown h3::after {
    top: 0.3em; }
  body.skin-vector #right-navigation .vector-menu-dropdown h3,
  body.skin-vector-legacy #right-navigation .vector-menu-dropdown h3 {
    height: calc(3.07692308em + 2px); }
  body.skin-vector .mw-watchlink a,
  body.skin-vector-legacy .mw-watchlink a {
    height: 3.07692308em !important;
    color: transparent;
    padding-top: 0; }
  body.skin-vector #mw-panel nav,
  body.skin-vector-legacy #mw-panel nav {
    background-color: var(--rct-indian-red);
    border: 1px solid;
    border-top-color: var(--rct-indian-red-lighter);
    border-left-color: var(--rct-indian-red-lighter);
    border-right-color: var(--rct-indian-red-darker);
    border-bottom-color: var(--rct-indian-red-darker);
    padding-top: 0; }
    body.skin-vector #mw-panel nav + nav,
    body.skin-vector-legacy #mw-panel nav + nav {
      margin-top: 15px; }
    body.skin-vector #mw-panel nav h3,
    body.skin-vector-legacy #mw-panel nav h3 {
      height: 12px;
      margin: 0;
      border: 1px solid;
      border-top-color: var(--rct-indian-red-darker);
      border-left-color: var(--rct-indian-red-darker);
      border-right-color: var(--rct-indian-red-lighter);
      border-bottom-color: var(--rct-indian-red-lighter);
      background-color: var(--rct-dark-indian-red);
      color: white;
      font-weight: bold;
      text-align: center;
      background-image: none;
      line-height: 12px; }
    body.skin-vector #mw-panel nav a,
    body.skin-vector-legacy #mw-panel nav a {
      color: #fff;
      border-bottom: 1px dotted; }
  body.skin-vector #p-personal .vector-menu-content-list,
  body.skin-vector-legacy #p-personal .vector-menu-content-list {
    align-items: normal; }
    body.skin-vector #p-personal .vector-menu-content-list li,
    body.skin-vector-legacy #p-personal .vector-menu-content-list li {
      background-color: var(--rct-light-grey);
      border: 1px solid;
      border-top-color: var(--rct-light-grey-lighter);
      border-left-color: var(--rct-light-grey-lighter);
      border-right-color: var(--rct-light-grey-darker);
      border-bottom-color: var(--rct-light-grey-darker);
      color: white;
      font-weight: bold;
      min-height: 28px;
      box-sizing: border-box;
      position: relative;
      padding-left: 5px;
      padding-right: 5px; }
  body.skin-vector li#pt-notifications-alert,
  body.skin-vector li#pt-notifications-notice,
  body.skin-vector li#pt-preferences,
  body.skin-vector li#pt-watchlist,
  body.skin-vector li#pt-betafeatures,
  body.skin-vector li#pt-userpage,
  body.skin-vector li#pt-login,
  body.skin-vector li#pt-logout,
  body.skin-vector li#pt-mytalk,
  body.skin-vector li#pt-anontalk,
  body.skin-vector li#pt-mycontris,
  body.skin-vector li#pt-anoncontribs,
  body.skin-vector li#pt-createaccount,
  body.skin-vector-legacy li#pt-notifications-alert,
  body.skin-vector-legacy li#pt-notifications-notice,
  body.skin-vector-legacy li#pt-preferences,
  body.skin-vector-legacy li#pt-watchlist,
  body.skin-vector-legacy li#pt-betafeatures,
  body.skin-vector-legacy li#pt-userpage,
  body.skin-vector-legacy li#pt-login,
  body.skin-vector-legacy li#pt-logout,
  body.skin-vector-legacy li#pt-mytalk,
  body.skin-vector-legacy li#pt-anontalk,
  body.skin-vector-legacy li#pt-mycontris,
  body.skin-vector-legacy li#pt-anoncontribs,
  body.skin-vector-legacy li#pt-createaccount {
    background-repeat: no-repeat;
    background-position: center;
    padding: 0 !important;
    width: 28px;
    margin-left: 0.75em;
    margin-right: 0 !important; }
  body.skin-vector li#pt-anonuserpage,
  body.skin-vector-legacy li#pt-anonuserpage {
    /*padding: 0 !important;*/
    margin-left: 0.75em;
    margin-right: 0 !important;
    background-size: initial;
    background-position: 8px 2px;
    padding-left: 28px !important; }
    body.skin-vector li#pt-anonuserpage a,
    body.skin-vector-legacy li#pt-anonuserpage a {
      color: white; }
  body.skin-vector #pt-notifications-alert,
  body.skin-vector-legacy #pt-notifications-alert {
    background-image: url("https://static.miraheze.org/rctwiki/7/74/Notifications.png"); }
  body.skin-vector #pt-notifications-notice,
  body.skin-vector-legacy #pt-notifications-notice {
    background-image: url("https://static.miraheze.org/rctwiki/4/4f/Newspaper.png"); }
  body.skin-vector li#pt-preferences,
  body.skin-vector-legacy li#pt-preferences {
    background-image: url("https://static.miraheze.org/rctwiki/7/7d/Gears.png"); }
  body.skin-vector li#pt-watchlist,
  body.skin-vector-legacy li#pt-watchlist {
    background-image: url("https://static.miraheze.org/rctwiki/8/80/Watchlist-icon.png"); }
  body.skin-vector li#pt-betafeatures,
  body.skin-vector-legacy li#pt-betafeatures {
    background-image: url("https://static.miraheze.org/rctwiki/3/3f/Beta.png"); }
  body.skin-vector li#pt-userpage,
  body.skin-vector li#pt-anonuserpage,
  body.skin-vector-legacy li#pt-userpage,
  body.skin-vector-legacy li#pt-anonuserpage {
    background-image: url("https://static.miraheze.org/rctwiki/3/31/Guest2.png"); }
  body.skin-vector li#pt-login,
  body.skin-vector li#pt-logout,
  body.skin-vector-legacy li#pt-login,
  body.skin-vector-legacy li#pt-logout {
    background-image: url("https://static.miraheze.org/rctwiki/2/28/Entrance.png");
    background-position-y: 0; }
  body.skin-vector li#pt-mytalk,
  body.skin-vector li#pt-anontalk,
  body.skin-vector-legacy li#pt-mytalk,
  body.skin-vector-legacy li#pt-anontalk {
    background-image: url("https://static.miraheze.org/rctwiki/c/c7/Chat.png"); }
  body.skin-vector li#pt-mycontris,
  body.skin-vector li#pt-anoncontribs,
  body.skin-vector-legacy li#pt-mycontris,
  body.skin-vector-legacy li#pt-anoncontribs {
    background-image: url("https://static.miraheze.org/rctwiki/7/77/Shovel.png"); }
  body.skin-vector li#pt-createaccount,
  body.skin-vector-legacy li#pt-createaccount {
    background-image: url("https://static.miraheze.org/rctwiki/9/97/CreateAccount.png"); }
  body.skin-vector #pt-notifications-alert a,
  body.skin-vector #pt-notifications-notice a,
  body.skin-vector li#pt-preferences a,
  body.skin-vector li#pt-watchlist a,
  body.skin-vector li#pt-betafeatures a,
  body.skin-vector li#pt-userpage a,
  body.skin-vector li#pt-login a,
  body.skin-vector li#pt-logout a,
  body.skin-vector li#pt-mytalk a,
  body.skin-vector li#pt-anontalk a,
  body.skin-vector li#pt-mycontris a,
  body.skin-vector li#pt-anoncontribs a,
  body.skin-vector li#pt-createaccount a,
  body.skin-vector-legacy #pt-notifications-alert a,
  body.skin-vector-legacy #pt-notifications-notice a,
  body.skin-vector-legacy li#pt-preferences a,
  body.skin-vector-legacy li#pt-watchlist a,
  body.skin-vector-legacy li#pt-betafeatures a,
  body.skin-vector-legacy li#pt-userpage a,
  body.skin-vector-legacy li#pt-login a,
  body.skin-vector-legacy li#pt-logout a,
  body.skin-vector-legacy li#pt-mytalk a,
  body.skin-vector-legacy li#pt-anontalk a,
  body.skin-vector-legacy li#pt-mycontris a,
  body.skin-vector-legacy li#pt-anoncontribs a,
  body.skin-vector-legacy li#pt-createaccount a {
    background-image: none;
    width: 26px;
    height: 26px;
    position: static;
    display: block;
    margin: 0;
    color: transparent;
    padding: 0 !important; }
  body.skin-vector #pt-notifications-alert .mw-echo-notifications-badge::after,
  body.skin-vector #pt-notifications-notice .mw-echo-notifications-badge::after,
  body.skin-vector-legacy #pt-notifications-alert .mw-echo-notifications-badge::after,
  body.skin-vector-legacy #pt-notifications-notice .mw-echo-notifications-badge::after {
    top: 55%; }
  body.skin-vector .mw-footer li,
  body.skin-vector-legacy .mw-footer li {
    color: #999999; }
  body.skin-vector .mw-footer li a,
  body.skin-vector-legacy .mw-footer li a {
    color: var(--light-link); }

.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; }

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