|
|
| Line 3: |
Line 3: |
| /* --- General look and feel of the site --- */ | | /* --- General look and feel of the site --- */ |
|
| |
|
| /* latin-ext */
| | html { |
| @font-face {
| | background-color: black; |
| font-family: 'Titillium Web';
| |
| font-style: normal;
| |
| font-weight: 400;
| |
| src: local('Titillium Web'), local('TitilliumWeb-Regular'), url('/resources/dark/fonts/TitilliumWeb-Regular.ttf') format('truetype');
| |
| unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
| |
| }
| |
| /* latin */
| |
| @font-face {
| |
| font-family: 'Titillium Web';
| |
| font-style: normal;
| |
| font-weight: 400;
| |
| src: local('Titillium Web'), local('TitilliumWeb-Regular'), url('/resources/dark/fonts/TitilliumWeb-Regular.ttf') format('truetype');
| |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
| |
| }
| |
| /* latin-ext */
| |
| @font-face {
| |
| font-family: 'Titillium Web';
| |
| font-style: normal;
| |
| font-weight: 600;
| |
| src: local('Titillium WebSemiBold'), local('TitilliumWeb-SemiBold'), url('/resources/dark/fonts/TitilliumWeb-SemiBold.ttf') format('truetype');
| |
| unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
| |
| }
| |
| /* latin */
| |
| @font-face {
| |
| font-family: 'Titillium Web';
| |
| font-style: normal;
| |
| font-weight: 600;
| |
| src: local('Titillium WebSemiBold'), local('TitilliumWeb-SemiBold'), url('/resources/dark/fonts/TitilliumWeb-SemiBold.ttf') format('truetype');
| |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
| |
| }
| |
| /* latin-ext */
| |
| @font-face {
| |
| font-family: 'Titillium Web';
| |
| font-style: normal;
| |
| font-weight: 700;
| |
| src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url('/resources/dark/fonts/TitilliumWeb-Bold.ttf') format('truetype');
| |
| unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
| |
| }
| |
| /* latin */
| |
| @font-face {
| |
| font-family: 'Titillium Web';
| |
| font-style: normal;
| |
| font-weight: 700;
| |
| src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url('/resources/dark/fonts/TitilliumWeb-Bold.ttf') format('truetype');
| |
| unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
| |
| }
| |
| | |
| /* --- remove sidebar label and upper border of custom toolbox to make it look like that point is part of the tools section --- */
| |
| | |
| #p-tb {
| |
| padding-bottom: 0 !important;
| |
| }
| |
| | |
| #p-custom-tb {
| |
| border-top: none !important;
| |
| padding-top: 0 !important;
| |
| }
| |
| | |
| #p-custom-tb-label {
| |
| display: none;
| |
| }
| |
| | |
| /* Remove overdone top margin on slideshow galleries */
| |
| | |
| ul.gallery.mw-gallery-slideshow {
| |
| margin: 1em 0;
| |
| }
| |
| | |
| /* Adjust wikitable padding */
| |
| | |
| table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
| |
| padding: 0.15em 0.45em
| |
| }
| |
| | |
| /* Hide the semantic wiki notices for now */
| |
| | |
| .smw-editpage-help {
| |
| display: none;
| |
| }
| |
| | |
| /* --- End of General look and feel of the site --- */
| |
| | |
| /* --- boilerplate style class for templates that deal with the wiki organisation etc examples: template:archive, template:merge, template:delete, template:stub, template:disambiguation --- */
| |
| | |
| .factorio-boilerplate {
| |
| margin:auto auto 10px;
| |
| width:100%
| |
| }
| |
| | |
| .factorio-boilerplate table {
| |
| margin:auto;
| |
| text-align:left;
| |
| border:2px solid #aaa;
| |
| background-color: #e4f0f7;
| |
| width:calc(100% - 23em)
| |
| }
| |
| | |
| /* --- Template:Achievement --- */
| |
| | |
| .achievement {
| |
| border:none;
| |
| background:none
| |
| }
| |
| | |
| /* --- Template:Key --- */
| |
| | |
| .keyboard-key {
| |
| border: 1px solid #aaa;
| |
| background-color: #f9f9f9;
| |
| border-radius: 0.2em;
| |
| box-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, 0.1);
| |
| padding: 0.1em 0.3em;
| |
| font-family: inherit;
| |
| font-size: 0.85em;
| |
| }
| |
| | |
| /* --- Template:ContentCell --- */
| |
| | |
| .factorio-contentcell {
| |
| background: #F9F9F9;
| |
| border: 1px solid #AAAAAA;
| |
| vertical-align: top;
| |
| -moz-border-radius: 5px;
| |
| -webkit-border-radius: 5px;
| |
| padding: 7px;
| |
| }
| |
| | |
| .factorio-contentcell .titlebar {
| |
| background: #E4F0F7;
| |
| padding: 5px;
| |
| margin: 3px;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| color: #033251;
| |
| font-size: 120%;
| |
| }
| |
| | |
| /* --- TEMPLATE:Icon --- */
| |
| | |
| .factorio-icon {
| |
| display:inline-block;
| |
| margin:5px;
| |
| position:relative;
| |
| padding:3px;
| |
| width:32px;
| |
| height:32px;
| |
| border:1px solid #4B4543;
| |
| }
| |
| | |
| .factorio-icon-text {
| |
| position:absolute;
| |
| bottom: -3px;
| |
| right: 2px;
| |
| color:#fff;
| |
| font-size:larger;
| |
| font-weight: bold;
| |
| text-shadow: 0px 1px 1px #000, 0px -1px 1px #000, 1px 0px 1px #000,-1px 0px 1px #000;
| |
| pointer-events: none
| |
| }
| |
| | |
| /* --- TEMPLATE:NavboxIconLink --- */
| |
| .navbox-icon {
| |
| position: relative;
| |
| }
| |
| | |
| .navbox-icon-text {
| |
| position: absolute;
| |
| bottom: -5px;
| |
| right: 1px;
| |
| color:#fff;
| |
| font-size:10px;
| |
| font-weight: bold;
| |
| text-shadow: 0px 1px 1px #000, 0px -1px 1px #000, 1px 0px 1px #000,-1px 0px 1px #000;
| |
| pointer-events: none
| |
| }
| |
| | |
| span.whiteLink a { color: white; }
| |
| | |
| /* --- Gerneral --- */
| |
| .hidden {
| |
| display: none;
| |
| }
| |
| | |
| /* --- Languages template --- */
| |
| .languages-container {
| |
| background: #EFEFEF;
| |
| padding: 5px;
| |
| border-color: #ACACAC;
| |
| border-width: 1px;
| |
| border-style: solid;
| |
| border-bottom-width: medium;
| |
| }
| |
| | |
| .languages-container p {
| |
| margin: 0;
| |
| }
| |
| | |
| .languages-message {
| |
| font-weight: bold;
| |
| font-size: smaller;
| |
| }
| |
| | |
| /* --- Spoilers --- */
| |
| .spoiler-container .button {
| |
| background: #E4F0F7;
| |
| border: 1px solid #b1d3e7;
| |
| box-shadow: -1px 1px 5px #777777;
| |
| display: inline-block;
| |
| padding: 2px;
| |
| font-weight: bold;
| |
| cursor: pointer;
| |
| margin-bottom: 4px;
| |
| }
| |
| | |
| .spoiler-container .button:active {
| |
| box-shadow: -1px 1px 1px #777777;
| |
| }
| |
| | |
| /* --- Infobox --- */
| |
| .infobox {
| |
| width: 22em;
| |
| float: right;
| |
| border: 1px solid #aaa;
| |
| border-radius: 10px 10px 0 0;
| |
| margin-left: 5px;
| |
| }
| |
| | |
| .infobox table, .infobox tr {
| |
| width: 100%;
| |
| }
| |
| | |
| .infobox table {
| |
| border-spacing: 0;
| |
| padding: 4px;
| |
| }
| |
| | |
| .infobox .infobox-image img{
| |
| width: 100%;
| |
| height: auto;
| |
| }
| |
| | |
| .infobox-header > div:first-child {
| |
| text-align: center;
| |
| }
| |
| | |
| .infobox-header > div {
| |
| padding: 5px 0;
| |
| }
| |
| | |
| .infobox-header-text {
| |
| padding:0;
| |
| text-align: left !important;
| |
| }
| |
| | |
| .infobox-header-text span{
| |
| font-size: 1.2em;
| |
| font-weight: bold;
| |
| line-height: 1.2em;
| |
| }
| |
| | |
| .infobox-header-text p{
| |
| margin: 0;
| |
| }
| |
| | |
| .infobox-edit-link {
| |
| font-weight:normal;
| |
| font-size:small;
| |
| padding-right: 0.5em;
| |
| text-align: right;
| |
| }
| |
| | |
| .infobox-edit-link a {
| |
| color: inherit !important;
| |
| font-style: italic;
| |
| text-decoration: underline;
| |
| }
| |
| | |
| /* switching the infobox-header colors per category using classes so that they can be easily modified by user css */
| |
| | |
| .infobox .combat {
| |
| background: #FF0000;
| |
| color: white;
| |
| }
| |
| | |
| .infobox .intermediates {
| |
| background: #AAAAAA;
| |
| }
| |
| | |
| .infobox .production {
| |
| background: #FFA600;
| |
| }
| |
| | |
| .infobox .logistics {
| |
| background: #A1056F;
| |
| color: white;
| |
| }
| |
| | |
| .infobox .technology {
| |
| background: #228B22;
| |
| }
| |
| | |
| .infobox .default-infobox {
| |
| background: lightblue;
| |
| }
| |
| | |
| /* end of the style classes for the infobox header color switcher */
| |
| | |
| .infobox p {
| |
| margin: 0;
| |
| }
| |
| .infobox .infobox-header th {
| |
| white-space: nowrap;
| |
| }
| |
| | |
| .infobox .infobox-header > div {
| |
| display: inline-block;
| |
| }
| |
| | |
| .infobox .infobox-header .header-icon {
| |
| vertical-align: top;
| |
| }
| |
| | |
| .infobox .infobox-header {
| |
| border-radius: 7px 7px 0 0;
| |
| overflow: hidden;
| |
| }
| |
| | |
| .infobox tr.border-top td {
| |
| border-top: 1px solid #aaa;
| |
| }
| |
| | |
| .infobox tr td:nth-child(2) {
| |
| text-align: right;
| |
| }
| |
| | |
| .infobox .infobox-header th > div {
| |
| display: inline-block;
| |
| }
| |
| | |
| .infobox-vrow-value {
| |
| text-align: center;
| |
| }
| |
| | |
| .infobox .tabber .tabbernav {
| |
| margin-top: 5px;
| |
| }
| |
| | |
| .infobox .tabber .tabbertab {
| |
| border: 0px;
| |
| padding: 0px;
| |
| | |
| }
| |
| .infobox .tabber table {
| |
| padding-bottom: 0px;
| |
| }
| |
| | |
| /* --- Navbox --- */
| |
| .navbox {
| |
| padding-top: 1.5em;
| |
| }
| |
| | |
| .navbox th {
| |
| background: rgba(173, 216, 230, 1.0);
| |
| border-radius: 10px;
| |
| }
| |
| | |
| .navbox, .navbox tr, .navbox table, .navbox p {
| |
| width: 100%;
| |
| }
| |
| | |
| .navbox-header p {
| |
| text-align: center;
| |
| font-size: 125%;
| |
| }
| |
| | |
| .navbox p {
| |
| margin: 0;
| |
| }
| |
| | |
| .navbox td > div, .navbox th > div {
| |
| margin: 0px 10px;
| |
| }
| |
| | |
| .navbox .navbox-header {
| |
| width: 100%;
| |
| }
| |
| | |
| .navbox .list-data {
| |
| width: 100%;
| |
| border-radius: 0 10px 10px 0;
| |
| background: rgba(173, 216, 230, 0.4);
| |
| }
| |
| | |
| .navbox .group-data {
| |
| white-space: nowrap;
| |
| text-align: right;
| |
| border-radius: 10px 0 0 10px;
| |
| background: rgba(173, 216, 230, 0.7);
| |
| }
| |
| | |
| /* Style for horizontal lists (separator following item).
| |
| @source mediawiki.org/wiki/Snippets/Horizontal_lists
| |
| @revision 9 (2016-08-10)
| |
| @author [[User:Edokter]]
| |
| */
| |
| .hlist dl,
| |
| .hlist ol,
| |
| .hlist ul {
| |
| margin: 0;
| |
| padding: 0;
| |
| }
| |
| /* Display list items inline */
| |
| .hlist dd,
| |
| .hlist dt,
| |
| .hlist li {
| |
| margin: 0;
| |
| display: inline;
| |
| }
| |
| /* Display nested lists inline */
| |
| .hlist.inline,
| |
| .hlist.inline dl,
| |
| .hlist.inline ol,
| |
| .hlist.inline ul,
| |
| .hlist dl dl, .hlist dl ol, .hlist dl ul,
| |
| .hlist ol dl, .hlist ol ol, .hlist ol ul,
| |
| .hlist ul dl, .hlist ul ol, .hlist ul ul {
| |
| display: inline;
| |
| }
| |
| /* Hide empty list items */
| |
| .hlist .mw-empty-li,
| |
| .hlist .mw-empty-elt {
| |
| display: none;
| |
| }
| |
| /* Generate interpuncts */
| |
| .hlist dt:after {
| |
| content: ": ";
| |
| }
| |
| .hlist dd:after,
| |
| .hlist li:after {
| |
| content: " · ";
| |
| font-weight: bold;
| |
| }
| |
| .hlist dd:last-child:after,
| |
| .hlist dt:last-child:after,
| |
| .hlist li:last-child:after {
| |
| content: none;
| |
| }
| |
| /* Add parentheses around nested lists */
| |
| .hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
| |
| .hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
| |
| .hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
| |
| content: " (";
| |
| font-weight: normal;
| |
| }
| |
| .hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
| |
| .hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
| |
| .hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
| |
| content: ")";
| |
| font-weight: normal;
| |
| }
| |
| /* Put ordinals in front of ordered list items */
| |
| .hlist ol {
| |
| counter-reset: listitem;
| |
| }
| |
| .hlist ol > li {
| |
| counter-increment: listitem;
| |
| }
| |
| .hlist ol > li:before {
| |
| content: " " counter(listitem) "\a0";
| |
| }
| |
| .hlist dd ol > li:first-child:before,
| |
| .hlist dt ol > li:first-child:before,
| |
| .hlist li ol > li:first-child:before {
| |
| content: " (" counter(listitem) "\a0";
| |
| }
| |
| | |
| /* Template:Stub */
| |
| | |
| .stub {
| |
| border: 5px solid #FF6666;
| |
| border-radius: 10px;
| |
| -moz-border-radius: 10px;
| |
| -webkit-border-radius: 10px;
| |
| -khtml-border-radius: 10px;
| |
| -icab-border-radius: 10px;
| |
| -o-border-radius: 10px;
| |
| padding: 5px;
| |
| }
| |
| | |
| /* Template:Inventory */
| |
| | |
| .tab-header div {
| |
| display: inline-block
| |
| }
| |
| | |
| .tab-head {
| |
| position: relative;
| |
| cursor: pointer
| |
| }
| |
| | |
| .tab-head:after {
| |
| content: attr(data-name);
| |
| pointer-events: none;
| |
| position: absolute;
| |
| display: none;
| |
| z-index: 1000;
| |
| background-color: rgba(67, 67, 72, 0.8);
| |
| padding: 8px 8px;
| |
| min-width: 125px;
| |
| font-family: 'Titillium Web',sans-serif;
| |
| color: white
| |
| }
| |
| | |
| .tab-head img {
| |
| border-top: 1px solid #c7c7c7;
| |
| border-left: 1px solid #6e6e6e;
| |
| border-right: 1px solid #6e6e6e;
| |
| border-bottom: 1px solid #1c1c1c;
| |
| background-color: #8e8e8e;
| |
| margin: 5px 0px 5px 1px
| |
| }
| |
| | |
| .tab-head img:hover {
| |
| background-color: #e39827
| |
| }
| |
| | |
| .tab-head-active img {
| |
| background-color: #e39827;
| |
| border-top: 1px solid #2A2A2A;
| |
| border-left: 1px solid #2A2A2A;
| |
| border-right: 1px solid #CCC;
| |
| border-bottom: 1px solid #CCC
| |
| }
| |
| | |
| .tab .factorio-icon {
| |
| margin: 0.5px;
| |
| background-color: #313131;
| |
| border-top: 1px solid #454545;
| |
| border-left: 1px solid #212121;
| |
| border-right: 1px solid #212121;
| |
| border-bottom: 1px solid #191919
| |
| }
| |
| | |
| .tab .factorio-icon img {
| |
| filter: drop-shadow(0px 0px 4px #000)
| |
| }
| |
| | |
| .tab .factorio-icon:hover {
| |
| background-color: #e39827
| |
| }
| |
| | |
| .tab .factorio-icon:after {
| |
| position: absolute;
| |
| pointer-events: none;
| |
| display: none;
| |
| z-index: 1000;
| |
| background-color: rgba(67, 67, 72, 0.8);
| |
| padding: 8px 8px;
| |
| min-width: 125px;
| |
| font-family: 'Titillium Web',sans-serif;
| |
| color: white
| |
| }
| |
| | |
| .tab {
| |
| min-height: 370px
| |
| }
| |
| | |
| .factorio-contentcell .inventory {
| |
| margin: auto;
| |
| width: 500px
| |
| }
| |
| | |
| /* Custom list symbols */
| |
| | |
| .factorio-list ul {
| |
| list-style-image: none;
| |
| }
| |
| | |
| .factorio-list ul li ul {
| |
| list-style-type: square;
| |
| }
| |
| | |
| .factorio-list ul li ul li ul {
| |
| list-style-type: circle;
| |
| }
| |
| | |
| .factorio-list ul li ul li ul li ul{
| |
| list-style-type: disc;
| |
| }
| |
| | |
| /* Template:Documentation */
| |
| | |
| .factorio-doc {
| |
| margin-top:1em;
| |
| clear: both;
| |
| border: 2px dotted #666666;
| |
| padding: 0.6em;
| |
| background-color: #f5f5f5;
| |
| }
| |
| | |
| .factorio-doc-heading {
| |
| padding-bottom:3px;
| |
| border-bottom:1px solid #aaa;
| |
| margin-bottom:1ex;
| |
| }
| |
| | |
| /* Template:BlueprintString */
| |
| | |
| .bps-box {
| |
| background-color: #105482;
| |
| border: 3px solid;
| |
| border-color: #c1c1c1 #616161 #616161 #c1c1c1;
| |
| padding: 5px;
| |
| width: 13em;
| |
| border-radius: 3px;
| |
| text-align: center;
| |
| cursor: pointer;
| |
| margin: 3px
| |
| }
| |
| .bps-box:active {
| |
| background-color:#074774;
| |
| border-color: #616161 #c1c1c1 #c1c1c1 #616161;
| |
| }
| |
| .bps-box img {
| |
| pointer-events: none;
| |
| }
| |
| | |
| .gallerytext .bps-box {
| |
| margin: auto
| |
| }
| |
| | |
| /* Text blinking in rail signal colors */
| |
| | |
| @keyframes rail-signal-blink {
| |
| 33% { color: #55FF55; }
| |
| 66% { color: #FFFF55; }
| |
| }
| |
| @-webkit-keyframes rail-signal-blink {
| |
| 33% { color: #55FF55; }
| |
| 66% { color: #FFFF55; }
| |
| }
| |
| .rail-signal-blink {
| |
| animation: rail-signal-blink 3s step-start 0s infinite;
| |
| -webkit-animation: rail-signal-blink 3s step-start 0s infinite;
| |
| color: #ee7777;
| |
| }
| |
| | |
| /* Prototype parents list */
| |
| | |
| .prototype-parents {
| |
| background-color: #eaecf0;
| |
| margin-top: -1em !important;
| |
| padding-bottom: 3px;
| |
| padding-left: 0.5em;
| |
| }
| |
| | |
| /* Prototype table of contents */
| |
| .prototype-toc {
| |
| list-style-type: none;
| |
| border-collapse: collapse;
| |
| font-size: 14px;
| |
| line-height: 1.2;
| |
| }
| |
| .prototype-toc td {
| |
| font-family: monospace;
| |
| padding-bottom: 3px;
| |
| border-bottom: 1px dotted #d8d8d8;
| |
| }
| |
| .prototype-toc-item-name {
| |
| width: 20em;
| |
| padding-left: 2em;
| |
| padding-right: 1em;
| |
| }
| |
| .prototype-toc-item-info {
| |
| padding-left: 1em;
| |
| }
| |
| .prototype-property-type-usage {
| |
| columns: 22em 3;
| |
| -moz-columns: 22em 3;
| |
| -webkit-columns: 22em 3;
| |
| break-inside: avoid-column;
| |
| page-break-inside: avoid;
| |
| -webkit-column-break-inside: avoid;
| |
| font-family: monospace;
| |
| font-size: 14px;
| |
| }
| |
| | |
| /* Prototype tree on Prototype definitions */
| |
| /* The few prototypes that are roots of the prototype tree */
| |
| .prototype-tree-root ul {
| |
| list-style-image: none;
| |
| margin: 0;
| |
| }
| |
| | |
| .prototype-tree-root li {
| |
| list-style-type: none;
| |
| }
| |
| | |
| .prototype-tree-root li::before {
| |
| content: "⯀";
| |
| margin-right: 5px;
| |
| pointer-events: none
| |
| }
| |
| | |
| /* The actual prototype tree, without roots. */
| |
| .prototype-tree ul {
| |
| list-style-image: none;
| |
| border-left: solid rgb(95, 95, 95) 1px;
| |
| padding-left: 9px;
| |
| margin-left: 6px;
| |
| }
| |
| | |
| .prototype-tree li {
| |
| list-style-type: none;
| |
| }
| |
| | |
| .prototype-tree li::before {
| |
| content: "⯀";
| |
| margin-right: 5px;
| |
| pointer-events: none
| |
| }
| |
| | |
| .prototype-tree .prototype-tree-parent::before {
| |
| content: "⮝";
| |
| }
| |
| | |
| .prototype-tree .prototype-tree-parent-collapsed::before {
| |
| content: "⮟";
| |
| } | | } |