Scrap Mechanic Wiki
No edit summary
No edit summary
 
Line 4: Line 4:
 
/* ### Tagaziel and Dragen Industries ### */
 
/* ### Tagaziel and Dragen Industries ### */
 
/* ################################################## */
 
/* ################################################## */
 
.va-infobox-title,
 
.va-navbox-title {
 
background-color: #101010;
 
}
 
   
 
/* ################################################## */
 
/* ################################################## */
Line 18: Line 13:
 
border: 1px solid #c6b198;
 
border: 1px solid #c6b198;
 
border-radius: 3px;
 
border-radius: 3px;
 
 
 
box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
 
box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
 
-moz-box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
 
-moz-box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
 
-webkit-box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
 
-webkit-box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
 
 
clear: right;
 
clear: right;
 
float: right;
 
float: right;
Line 51: Line 43:
 
.va-infobox-title {
 
.va-infobox-title {
 
/* Shared background; see top of page */
 
/* Shared background; see top of page */
border: 1px solid #ed7404;
 
 
border-radius: 3px;
 
border-radius: 3px;
color: #FFF;
 
 
text-align: center;
 
text-align: center;
 
vertical-align: middle;
 
vertical-align: middle;
Line 59: Line 49:
 
}
 
}
   
.va-infobox-header .mw-collapsible-toggle a {
 
color: #FFF;
 
}
 
 
 
.va-infobox-divider-float {
 
.va-infobox-divider-float {
 
border-color: transparent;
 
border-color: transparent;
Line 89: Line 75:
 
top: -1px;
 
top: -1px;
 
width: 0;
 
width: 0;
}
 
 
/* Links */
 
.va-infobox-title a:link,
 
.va-infobox-title a:visited {
 
color: #AFA000 !important;
 
}
 
 
.va-infobox-title a:hover,
 
.va-infobox-title a:active {
 
color: #FFF !important;
 
}
 
 
.va-infobox-title a.new {
 
color: #F11 !important;
 
 
}
 
}
   

Latest revision as of 12:06, 10 June 2021

/* ################################################## */
/* ### VICTORIA BOX ENGINE by Porter Engineering  ### */
/* ###    Adapted for General Deployment by       ### */
/* ###      Tagaziel and Dragen Industries        ### */
/* ################################################## */

/* ################################################## */
/* ### VICTORIA INFOBOX (Template:Infobox)        ### */
/* ################################################## */
 
/* Outer table */
.va-infobox {
    border: 1px solid #c6b198;
   border-radius: 3px;
   box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
   -moz-box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
   -webkit-box-shadow: rgba(187,65,11,.7) 0 0.1em 0.5em;
   clear: right;
   float: right;
   font-size: 11px;
   line-height: 16px;
   margin: 0 0 5px 10px;
}
 
/* INFOBOX COLORS */

.va-infobox-content,
.va-infobox-footer,
.va-infobox-image,
.va-infobox-mainimage {
   background: transparent;
   border: 0px solid #ed7404;
}
 
.va-infobox-header,
.va-infobox-icon,
.va-infobox-label {
   background: transparent;
   border: 1px solid #ed7404;
   font-weight: bold;
}

.va-infobox-title {
   /* Shared background; see top of page */
   border-radius: 3px;
   text-align: center;
   vertical-align: middle;
   width: 100%;
}

.va-infobox-divider-float {
   border-color: transparent;
   border-style: solid;
   border-width: 0 0 1px 1px;
   clear: right;
   float: right;
   margin: -1px 0 0 2px;
   min-width: 18px;
   padding: 0 0 0 2px;
   text-align: center;
}

/* Tooltips */

.va-infobox-tooltip {
   border-color: #AAA transparent transparent #AAA;
   border-style: solid;
   border-width: 3px;
   float: left;
   height: 0;
   left: -2px;
   margin-bottom: -100%;
   margin-right: -100%;
   position: absolute;
   top: -1px;
   width: 0;
}

/* Inner tables */
.va-infobox-cont,
.va-infobox-group {
   margin: 0;
   width: 100%;
}
 
.va-infobox-mainimage-table {
   margin: 0 auto;
}
 
.va-infobox-mainimage-table + .va-infobox-mainimage-table {
   margin-top: 2px;
}
 
/* Cellspacing */
.va-infobox,
.va-infobox-cont,
.va-infobox-group,
.va-infobox-mainimage-table,
.va-infobox-spacing-h,
.va-infobox-spacing-v {
   background: transparent;
}
 
.va-infobox-spacing-h {
   border-right: 1px solid transparent;
   width: 0%;
}
 
.va-infobox-spacing-v {
   font-size: 1px;
   height: 1px;
   line-height: 0;
}
 
.va-infobox-columns + .va-infobox-spacing {
   display: none !important;
}
 
/* Widths */
.va-infobox-columns-1 .va-infobox-col1 {
   width: 100%;
}
 
.va-infobox-columns-2 .va-infobox-col1,
.va-infobox-columns-3 .va-infobox-col1,
.va-infobox-columns-4 .va-infobox-col1 {
   width: 28%;
}
 
.va-infobox-columns-2 .va-infobox-col2 {
   width: 72%;
}
 
.va-infobox-columns-3 .va-infobox-col2,
.va-infobox-columns-3 .va-infobox-col3 {
   width: 36%;
}
 
.va-infobox-columns-4 .va-infobox-col2,
.va-infobox-columns-4 .va-infobox-col3,
.va-infobox-columns-4 .va-infobox-col4 {
   width: 24%;
}
 
/* Cell styles */
.va-infobox-content,
.va-infobox-footer,
.va-infobox-header,
.va-infobox-image,
.va-infobox-label,
.va-infobox-title {
   padding: 1px 2px;
}
 
 
.va-infobox-image,
.va-infobox-footer,
.va-infobox-header,
.va-infobox-icon,
.va-infobox-mainimage,
.va-infobox-mainimage-cont,
.va-infobox-mainimage-image {
   text-align: center;
   vertical-align: middle;
}
 
.va-infobox-content {
   text-align: left;
   vertical-align: top;
}
 
.va-infobox-label {
   cursor: default;
   text-align: right;
   vertical-align: top;
}
 
.va-infobox-icon-cont {
   margin: 0;
   padding: 0;
   position: relative;
}
 
.va-infobox-icon-table {
   margin: 0 auto;
}
 
.va-infobox-mainimage-cont + .va-infobox-icon-table {
   position: absolute;
   right: 3px;
   top: 1px;
}
 
/* FIXME: Find better method to prevent column width oddities in IE8/Webkit */
.va-infobox-image {
   max-width: 0;
}
 
.va-infobox-image-cont {
   margin-right: -100%;
   margin-right: 0 !ie;
   text-align: center;
   width: 100%;
}
 
.va-infobox-image-desc {
   font-size: 10px;
   line-height: 15px;
   padding: 1px 1px 0;
}
 
.va-infobox-image-upload {
   padding: 15px 3px;
}
 
.va-infobox-mainimage {
   padding: 2px 0;
}
 
.va-infobox-mainimage-cont {
   margin: 0;
   width: 100%;
}
 
.va-infobox-mainimage-image {
   background: transparent;
   padding: 0 1px;
}
 
.va-infobox-mainimage-minheight {
   width: 0%;
}
 
.va-infobox-mainimage-minheight div {
   height: 120px;
   margin: 0;
   padding: 0;
   width: 1px;
}
 
.va-infobox-title-main {
   font-size: 15px;
   font-weight: bold;
   line-height: 20px;
}
 
.va-infobox-title-sub {
   font-size: 12px;
   line-height: 15px;
}
 
.va-infobox-title-super {
   font-size: 10px;
   line-height: 12px;
}
 
.va-infobox-tooltip-cell {
   cursor: help;
}
 
.va-infobox-tooltip-cont {
   height: 0;
   position: relative;
   width: 0;
}
 
/* Collapse buttons */
.va-infobox-group-collapsible .va-infobox-header {
   padding-left: 40px;
   padding-right: 40px;
}
 
.va-infobox-header .mw-collapsible-toggle {
   left: 40px;
   margin-left: -100%;
   position: relative;
}
 
/* Adapting lists & paragraphs */
.va-infobox ul,
.va-infobox ol,
.va-infobox p {
   line-height: 16px;
   margin-bottom: 0;
}
 
.va-infobox ul,
.va-infobox ol {
   margin-left: 20px;
   margin-top: 0;
}
 
.va-infobox p,
.va-infobox * + ul,
.va-infobox * + ol {
   margin-top: 3px;
}
 
.va-infobox ul li,
.va-infobox ol li {
   margin-bottom: 0;
}
 
/* Auxiliary template: Template:Infobox/divider */
 
.va-infobox-divider-vert {
   width: 100%;
}
 
.va-infobox-divider-left,
.va-infobox-divider-right {
   vertical-align: top;
   width: 50%;
}
 
.va-infobox-divider-left {
   border-right: 1px solid #AAA;
   padding: 0 2px 0 0;
}
 
.va-infobox-divider-right {
   padding: 0 0 0 2px;
}
 
.va-infobox-divider-section-start,
.va-infobox-divider-section-end {
   display: none;
}
 
.va-infobox-divider-section-end + .va-infobox-divider-section-start {
   border-top: 1px solid #AAA;
   clear: both;
   display: block;
   margin: 1px 0;
}


/* ################################################## */
/* ### NAVBOXES (Template:Navbox)                 ### */
/* ################################################## */
 
/* NAVBOX COLORS */
/* Outer table - border */
.va-navbox-border {
   border: 1px solid #c6b198; 
   border-radius: 3px;

/* box-shadow commented out
   box-shadow: 2px 2px 2px #AAA;
   -moz-box-shadow: 2px 2px 2px #AAA;
   -webkit-box-shadow: 2px 2px 2px #AAA;
*/

}
 
/* Cell styles and widths */
/* Remember to update the column width calculations when changing widths */
.va-navbox-title {
   /* Shared background; see top of page */
   border: 1px solid #ed7404;
   border-radius: 3px;
   color: #FFF;
   font-weight: normal;
   padding: 1px 2px;
}


.va-navbox-footer,
.va-navbox-group,
.va-navbox-header {
   background: transparent;
   border: 1px solid #ed7404;
}
 
.va-navbox-columncont .va-navbox-spacing-h {
   border-right: 1px solid transparent;
   width: 0%;
}

.va-navbox-colgroup,
.va-navbox-subgroup {
   background: transparent;
   border: 1px solid #ed7404;
}
 
.va-navbox-cell,
.va-navbox-column,
.va-navbox-image {
   background: #transparent;
   border: 1px solid transparent;
}

.va-navbox-nested .va-navbox-title {
   background: #C9D0AC;
   border: 1px solid #AAA;
   color: #000;
}
 
.va-navbox-nested .va-navbox-footer, 
.va-navbox-nested .va-navbox-group,
.va-navbox-nested .va-navbox-header {
   background: #D6DBC1;
}
 
.va-navbox-nested .va-navbox-colgroup, 
.va-navbox-nested .va-navbox-subgroup {
   background: #DDE1CB;
}

/* Outer table - widths, floats */
.va-navbox {
   font-size: 11px; 
   line-height: 16px;
   width: 100%;
}
 
.va-navbox-bottom {
   clear: both; 
   margin: 5px auto 0;
   width: 100%;
}
 
.va-navbox-left {
   clear: left;
   float: left;
   margin: 0 1.5em 0.5em 0;
   width: 240px;
}
 
.va-navbox-right {
   clear: right;
   float: right;
   margin: 0 0 0.5em 1.5em;
   width: 240px;
}
 
.va-navbox-bottom + .va-navbox-bottom {
   margin-top: 2px;
}
 
/* Inner tables */
.va-navbox-brick {
   margin: 0;
   width: 100%;
}
 
/* Cellspacing */
.va-navbox,
.va-navbox-border,
.va-navbox-brickcont,
.va-navbox-padding,
.va-navbox-spacing-h,
.va-navbox-spacing-v {
   background: transparent;
}
 
.va-navbox-padding {
   padding: 1px;
}
 
.va-navbox-spacing-h {
   width: 1px;
}
 
.va-navbox-spacing-v {
   font-size: 1pt;
   height: 1px;
   line-height: 0em;
}
 
.va-navbox-headertext,
.va-navbox-titletext {
   font-weight: bold;
   padding-left: 40px;
   padding-right: 40px;
}
 
.va-navbox-maintitle .va-navbox-titletext {
   font-size: 118%;
}
 
/* v/d/e and collapse button */
.va-navbox-editlink {
   float: left;
   margin-right: -100%;
   text-align: left;
   width: 40px;
}
 
.va-navbox .mw-collapsible-toggle {
   margin-left: -100%;
}
 
.va-navbox-cell,
.va-navbox-colgroup,
.va-navbox-column,
.va-navbox-footer,
.va-navbox-group,
.va-navbox-header,
.va-navbox-image,
.va-navbox-subgroup {
   padding: 1px 2px;
}
 
.va-navbox-colgroup,
.va-navbox-group,
.va-navbox-subgroup {
   font-weight: bold;
}
 
.va-navbox-group,
.va-navbox-subgroup {
   text-align: center;
   width: 15%;
}
 
.va-navbox-cell-nogroups,
.va-navbox-column,
.va-navbox-colgroup,
.va-navbox-footer,
.va-navbox-image {
   text-align: center;
}
 
.va-navbox-cell-withgroups {
   text-align: left;
}
 
.va-navbox-column {
   vertical-align: top;
}
 
.va-navbox-image {
   width: 8%;
}
 
/* Lists in column rows */
.va-navbox-formatlist ul,
.va-navbox-formatlist li {
   list-style-image: none;
   list-style-type: none;
   line-height: 16px;
   margin: 0.6em 0;
   padding: 0;
}
 
.va-navbox-formatlist li li {
   font-size: 90%;
}
 
.va-navbox-formatlist li ul {
   margin-bottom: 0.5em;
   margin-top: -0.1em;
}
 
.va-navbox-formatlist li ul li {
   margin: 0em;
}
 
/* Nested */
.va-navbox .va-navbox-nested {
   font-size: 100%;
}
 
/* Links */
.va-navbox-editlink .va-navbar-item {
   color: #FFF !important;
}
 
.va-navbox-nowraplinks .va-navbox-cell a,
.va-navbox-nowraplinks .va-navbox-column a {
   white-space: nowrap;
}
 
.va-navbox-maintitle a:link,
.va-navbox-maintitle a:visited {
   color: #AFA000 !important;
}
 
.va-navbox-maintitle a:hover,
.va-navbox-maintitle a:active {
   color: #FFF;
}
 
.va-navbox-maintitle a.new {
   color: #F11 !important;
}
 
.va-navbox-maintitle .mw-collapsible-toggle a {
   color: #FFF !important;
}

/* ################################################## */
/* ### TEMPLATE DOCUMENTATION                     ### */
/* ### (Template:Docparam/Template:Documentation) ### */
/* ################################################## */
 
/* Template:Docparam */
.va-docparam {
   background: transparent;
   border: 1px dotted #ed7404;
   margin-bottom: 3px;
   overflow: auto;
   padding: 0 2px 0 20px;
   text-indent: -20px;
}
 
.va-docparam-icon {
   float: left;
   margin: 0;
   padding: 0;
   width: 20px;
}
 
.va-docparam-default {
   float: right;
   font-size: 10px;
}
 
.va-docparam-params {
   font-family: monospace;
}
 
.va-docparam-desc {
   margin: 0;
   padding: 0 0 5px 20px;
}
 
/* Template:Documentation */
.va-documentation,
.va-documentation-bar-top,
.va-documentation-bar-bottom {
   border-color: #AAA;
   border-style: solid;
   clear: both;
}
 
.va-documentation {
   border-width: 1px;
   margin: 10px 0;
}
 
.va-documentation-bar-top,
.va-documentation-bar-bottom {
   background: #black;
   color: #fff;
   margin: 0;
   padding: 5px;
}
 
.va-documentation-bar-top {
   border-width: 0 0 1px 0;
}
 
.va-documentation-bar-bottom {
   border-width: 1px 0 0 0;
   text-align: right;
}
 
.va-documentation-links {
   float: right;
   text-align: right;
}
 
.va-documentation-content {
   margin: 0;
   padding: 10px;
}
 
.va-documentation-small {
   font-size: 10px;
}

/* ################################################## */
/* ### ICONS (Template:Icon)                      ### */
/* ################################################## */
 
.va-icon-sortkey {
   display: none;
}

/* This governs the sections on the Community portal */
.cpbox {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
}
.cpbox #admins {
    box-sizing: border-box;
    width: calc(33% - 10px);
    margin: 5px;
    flex-grow: 1;
    min-width: 300px;
}
.cpbox #help {
    box-sizing: border-box;
    width: calc(67% - 10px);
    margin: 5px;
    flex-grow: 1;
}


/* bar displays by AttemptToCallNil */

.bar-display div {
    width: 7px;
    height: 14px;
    box-sizing: border-box;
    border-radius: 3px;
    display: inline-block;
    white-space: nowrap;
}

.bar-display div + div {
    margin-left: 2px;
}

.bar-display div.filled {
    background-image: linear-gradient(to bottom, #f9f39a 0%, #db9441 100%);
}

.bar-display div:not(.filled) {
    border: 1px solid #696e6e;
}

/* end bar displays */

/*********************
/* Front page styles *
/*********************/
.fpmain {
  width: 100%;
  overflow: hidden;
  z-index: 1;
}

.fpbanner {
  border: 1px solid #c6b198;
  box-shadow: rgba(255, 153, 0, .7) 0 0.1em 0.5em
  background: rgba( 0, 0, 0, .2 );
  color: #ffffff;
  margin: 0 5px 5px 5px;
  padding: 5px;
  min-height: 80px;
}

.fpbannertable {
  display: table;
  border: none;
  background: transparent;
  width: 100%; 
  min-height: 75px;
  margin: 0;
  padding: 5px;
}

.fpbannercell {
  display: table-cell; 
  text-align: center; 
  vertical-align: middle;
}

.fpbannerblock {
  border: none;
  color: #ffffff;
  font-weight: bold;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.75);
  font-size: 132%;
  width: 100%;
  margin: 0 0 10px 0;
  padding: 0 0 5px 0;
}

.fpmidsections {
  float: left;
  width: 100%;
  overflow: hidden;
}

.fpbox {
  box-shadow: rgba(187, 65, 11, .7) 0 0.1em 0.5em;
  margin: 5px 5px 5px 5px;
  padding: 5px 5px 5px 5px;
  overflow: auto;
}

.fpbox .mainheading {
  border: none;
  font-size: 150%;
  font-weight: bold;
  margin: 0 0 10px 0;
  padding: 0 0 5px 0;
  overflow: auto;
}

.fpbox .heading {
  border: none;
  font-size: 132%;
  margin: 0 0 10px 0;
  padding: 0 0 5px 0;
  overflow: auto;
}

.fpmain .columns .leftcol {
  width: 100%;
  margin: 0;
  padding: 0;
}

.fpmain .columns .rightcol {
  width: 100%;
  margin: 0;
  padding: 0;
}

.fpsection1, .fpsection2, .fpsection3, .fpsection4 {
  float: left;
  clear: both; 
  width: 100%;
}

div.fp2columnonly, div.fp3columnonly {
  display: none; 
}

@media (min-width: 790px) {
  .fpsection1 {
    float: left;
    clear: none;
    width: 50%;
  }

  .fpmidsections {
    clear: none;
    float: right;
    width: 50%;
  }

  .fpsection4 {
    float: left;
    clear: none;
    width: 50%;
  }

  div.fp2columnonly {
    display: block; 
  }
}

@media (min-width: 990px) {
  .fpmain .columns .leftcol {
    float: left;
    width: 50%;
    margin: 0;
    padding: 0;
  }

  .fpmain .columns .rightcol {
    float: right;
    width: 50%;
    margin: 0;
    padding: 0;
  }
}

@media (min-width: 1390px) {
  .fpmidsections {
    clear: none;
    float: right;
    width: 66.667%;
  }

  .fpsection1 {
    clear: none;
    width: 33.333%;
  }

  .fpsection2 {
    clear: none;
    width: 50%;
  }

  .fpsection3 {
    clear: none;
    width: 50%;
  }
 
  .fpsection4 {
    clear: left;
    width: 33.333%;
  }

  div.fp2columnonly {
    display: none; 
  }

  div.fp3columnonly {
    display: block; 
  }
}

.fpbox.plain {
  border: none;
  box-shadow: none;
  background: transparent;
}

.fpimagelist ul {
  list-style-type: none;
  list-style-image: none;
}

.fpvideos {
  margin: 0 auto;
  overflow: hidden;
  text-align: center;
}

.fpvideo {
  display: inline-block;
  margin: 0 5px;
}