Changes

Jump to navigation Jump to search

MediaWiki:Common.css (view source)

Revision as of 18:15, 5 November 2022

7,968 bytes added ,  18:15, 5 November 2022
no edit summary
Line 1: Line 1: −
/* CSS placed here will be applied to all skins */
+
body {
 +
    background: url(resources/assets/tl-wiki-head.webp) #f6f6f6 top left no-repeat; /* Top left bg image */
 +
    font-family: 'IBM Plex Sans','Helvetica Neue','Arial',sans-serif;
 +
}
 +
 
 +
 
 +
 
 +
/* Mainpage Right */
 +
 
 +
.mainpage-right {
 +
    flex: 1;
 +
    display: flex;
 +
    flex-flow: column wrap;
 +
}
 +
 
 +
.mainpage-right > * {
 +
    margin: 0 0 0.9rem;
 +
}
 +
 
 +
.arrow {
 +
    background: url('https://tradelands.net/wiki/images/b/bc/White_Chevron.png') no-repeat;
 +
    display: inline-block;
 +
    height: 0.7rem;
 +
    width: 0.45rem;
 +
    vertical-align: middle;
 +
}
 +
 
 +
 
 +
.mainpage-social {
 +
    border: none;
 +
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
 +
}
 +
 
 +
.mainpage-social .tile-top {
 +
    display: flex;
 +
    align-items: center;
 +
    padding: 1em 1.5em;
 +
}
 +
 
 +
.mainpage-social .tile-top a {
 +
    flex: 1;
 +
    position: relative;
 +
    text-decoration: none;
 +
}
 +
 
 +
.mainpage-social .tile-top a:hover .arrow {
 +
    transform: translateX(50%);
 +
}
 +
 
 +
.mainpage-social .tile-bottom {
 +
    border: none;
 +
    padding: 1em 1.75em;
 +
}
 +
 
 +
.mainpage-social .tile-bottom p {
 +
    color: #ffffff;
 +
    font-weight: bold;
 +
    font-size: 0.9em;
 +
    text-align: center;
 +
    text-transform: uppercase;
 +
    letter-spacing: 0.03em;
 +
    margin: 0;
 +
}
 +
 
 +
.mainpage-social .social-icon {
 +
    margin-right: 0.75em;
 +
    width: 60px;
 +
    text-align: center;
 +
}
 +
 
 +
.mainpage-social .social-header {
 +
    color: #ffffff;
 +
    font-weight: bold;
 +
    font-size: 1.15em;
 +
    margin: 0.5em 0 -0.15em;
 +
}
 +
 
 +
body.wgl-readermode .mainpage-social .social-header {
 +
    font-size: 1.05em;
 +
}
 +
 
 +
.mainpage-social .social-tagline {
 +
    color: rgba(255, 255, 255, 0.9);
 +
    margin-bottom: 0.5em;
 +
}
 +
 
 +
.mainpage-social .arrow {
 +
    position: absolute;
 +
    top: calc(50% - .5em);
 +
    right: 0;
 +
    height: 1em;
 +
    width: 0.7em;
 +
    background-size: 0.7em 1em;
 +
    transition: 0.3s ease-out;
 +
}
 +
 
 +
.mainpage-social.mainpage-discord .tile-top {
 +
    background: #7289da;
 +
}
 +
 
 +
.mainpage-social.mainpage-discord .tile-bottom {
 +
    background: #697ec4;
 +
}
 +
 
 +
/*Mainpage Popular */
 +
 
 +
.mainpage-left {
 +
    flex: 2;
 +
    display: flex;
 +
    flex-flow: column wrap;
 +
    margin-right: 0.9rem;
 +
}
 +
 
 +
.mainpage-popular li a:first-child {
 +
    border-radius: 3px;
 +
    padding: 4px;
 +
    background: #e6e6e6;
 +
}
 +
 
 +
.mainpage-popular ul {
 +
    columns: 3;
 +
    margin: 1em 0.7em 0.7em 1em;
 +
}
 +
 
 +
.mainpage-popular li {
 +
    display: flex;
 +
    margin-bottom: 0.4em;
 +
    isolation: isolate;
 +
}
 +
 
 +
.mainpage-popular li a:last-child {
 +
    flex: 1;
 +
    display: flex;
 +
    align-items: center;
 +
    color: #36414f;
 +
    font-weight: bold;
 +
    padding-left: 0.7em;
 +
    text-decoration: none;
 +
}
 +
 
 +
.mainpage-popular li:hover a:first-child {
 +
    border-radius: 3px 0 0 3px;
 +
}
 +
 
 +
.mainpage-popular li:hover a:last-child {
 +
    color: rgba(255, 255, 255, 0.9);
 +
    border-radius: 0 3px 3px 0;
 +
}
 +
 
 +
 
 +
/* TILES */
 +
 
 +
.mainpage-contents .tile-halves {
 +
    flex: 1;
 +
    margin-right: 0.9rem;
 +
}
 +
 
 +
.mainpage-contents .tile-top {
 +
    height: 5rem!important;
 +
    position: relative;
 +
}
 +
 
 +
.mainpage-tiles .tile-halves {
 +
    flex: 1;
 +
    align-content: flex-start;
 +
    margin-right: 0.9rem;
 +
}
 +
.mainpage-body {
 +
    display: flex;
 +
    flex-flow: row wrap;
 +
}
 +
 
 +
.mainpage-body h2 a {
 +
    color: #444e5a;
 +
}
 +
 
 +
.mainpage-body .tile {
 +
    padding-left: 1.75em;
 +
    padding-right: 1.75em;
 +
    max-width: 100%;
 +
}
 +
 
 +
.mainpage-body .tile-row {
 +
    width: 100%;
 +
    margin-bottom: 0.9rem;
 +
}
 +
 
 +
 
 +
.tile {
 +
    background: #ffffff;
 +
    border: 1px solid #e4eaee;
 +
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
 +
    padding: 1.5em 2em 1em;
 +
    max-width: 40em;
 +
}
 +
 
 +
.tile h2 {
 +
    font-size: 1.4em;
 +
    font-weight: bold;
 +
    border: none;
 +
    margin: 0 0 0.4em;
 +
}
 +
 
 +
.tile .byline + h2 {
 +
    margin-top: -0.5em;
 +
}
 +
 
 +
.tile.link-button {
 +
    padding: 0;
 +
}
 +
 
 +
.tile.link-button a {
 +
    color: inherit;
 +
    display: block;
 +
    padding: 1.25em 1.5em 0.75em;
 +
    text-decoration: none;
 +
}
 +
 
 +
.tile.dark {
 +
    color: #ffffff;
 +
    background: #5d6773;
 +
    border: none;
 +
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
 +
}
 +
 
 +
.tile.dark h2,
 +
.tile.dark h3 {
 +
    color: #ffffff;
 +
}
 +
 
 +
.tile.dark a {
 +
    color: #ccd2d8;
 +
}
 +
 
 +
.tile.dark .byline {
 +
    color: rgba(255, 255, 255, 0.7);
 +
}
 +
 
 +
.byline {
 +
    font-size: 0.9em;
 +
    color: #949eaa;
 +
}
 +
 
 +
.byline a {
 +
    color: #949eaa;
 +
}
 +
 
 +
.tile-row {
 +
    display: flex;
 +
    flex-flow: row wrap;
 +
    margin-bottom: 1em;
 +
}
 +
 
 +
.tile-halves {
 +
    display: flex;
 +
    flex-flow: row wrap;
 +
    border: 1px solid #e4eaee;
 +
    background: #ffffff;
 +
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
 +
}
 +
 
 +
.tile-halves h2 {
 +
    font-size: 1.4em;
 +
    font-weight: bold;
 +
    border: none;
 +
    margin: 0 0 0.4em;
 +
}
 +
 
 +
.tile-halves .byline + h2 {
 +
    margin-top: -0.5em;
 +
}
 +
 
 +
.tile-top {
 +
    width: 100%;
 +
    padding: 1.3rem 1.5rem 0.6rem;
 +
}
 +
 
 +
.tile-top.tile-image {
 +
    display: flex;
 +
    align-items: center;
 +
    background-color: #949eaa;
 +
    overflow: hidden;
 +
    padding: 0;
 +
    height: 13vw;
 +
    max-height: 12em;
 +
}
 +
 
 +
.tile-top.tile-image a {
 +
    width: 100%;
 +
}
 +
 
 +
.tile-top.tile-image img {
 +
    width: 100%;
 +
    height: auto;
 +
    transition: 0.4s ease-out;
 +
}
 +
 
 +
.tile-bottom {
 +
    background: #ffffff;
 +
    border-top: 1px solid #e4eaee;
 +
    width: 100%;
 +
    padding: 1rem 1.5rem 0.6rem;
 +
}
 +
 
 +
.tile-bottom.link-button {
 +
    align-self: flex-end;
 +
    padding: 0;
 +
}
 +
 
 +
.tile-bottom.link-button a {
 +
    display: block;
 +
    text-align: center;
 +
    padding: 0.75em 1.5em 0.8em;
 +
    text-decoration: none;
 +
}
 +
 
 +
.tile-bottom.read-more {
 +
    background: #f9fafa;
 +
    transition: 0.3s ease-out;
 +
}
 +
 
 +
.tile-bottom.read-more a {
 +
    color: #949eaa;
 +
    font-weight: bold;
 +
    text-align: right;
 +
}
 +
 
 +
.tile-bottom.read-more:hover {
 +
    background: #f2f4f4;
 +
}
 +
 
 +
.tile-bottom.read-more:hover .arrow {
 +
    transform: translateX(50%);
 +
}
 +
 
 +
.tile-bottom.read-more .arrow {
 +
    filter: invert(43%) sepia(50%) hue-rotate(175deg);
 +
    margin-left: 0.4em;
 +
    transition: 0.3s ease-out;
 +
}
 +
 
 +
/* TILES */
 +
 
 +
#simpleSearch input {
 +
    background-color: transparent;
 +
    color: #000;
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
}
 +
 
 +
#simpleSearch {
 +
height: 2.485em !important;
 +
}
 +
 
 +
 
 +
#p-search form {
 +
    margin: 0;
 +
}
 +
 
 +
#p-logo {
 +
    margin-bottom: 6em;
 +
}
 +
 
 +
#p-search {
 +
margin: 0;
 +
}
 +
 
 +
.vectorTabs ul li {
 +
    background: #eeeeee!important;
 +
}
 +
 
 +
body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }
 +
 
 +
.mw-body {
 +
    border-color: transparent;
 +
    box-shadow: 0 0 7px rgba(0,0,0,0.15);
 +
    background-color: #f9f9f9;
 +
}
 +
 
 +
.vector-menu-tabs a {
 +
background-image: none;
 +
}
 +
#mw-page-base {
 +
background:none;
 +
}
 +
 
 +
.mainpage-header {
 +
    display: flex;
 +
    margin: 0 1.75em 1.5em;
 +
}
 +
 
 +
.mainpage-header .header-stats ul {
 +
    list-style: none;
 +
}
 +
 
 +
.mainpage-header .header-intro h1 {
 +
    font-size: 2.5em;
 +
}
 +
 
 +
.mainpage-header .header-stats {
 +
    flex: 1;
 +
    display: flex;
 +
    justify-content: center;
 +
    align-items: center;
 +
    margin-top: -1em;
 +
}
 +
 
 +
.homepagecont {
 +
    max-width: 75em;
 +
    margin: 0 auto;
 +
}
 +
 
 +
.mainpage-header .header-intro {
 +
    flex: 2;
 +
}
 +
 
 +
.shipwrightsays {
 +
    background: #eee;
 +
    border: 1px solid #aaa;
 +
    margin: 0 0 1em 1em;
 +
    padding: 1em;
 +
    max-width: 800px;
 +
    overflow: hidden;
 +
}
 +
 
 +
.shipwrightsays img {
 +
float: left;
 +
}
 +
 
    
.infobox {
 
.infobox {
Line 25: Line 454:  
}
 
}
    +
.card {
 +
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0,0,0,0.1);
 +
    transition: 0.3s;
 +
    border: 1px solid #e4eaee;
 +
}
 +
 +
 +
 +
.vectorTabs {
 +
    background-color: #f9f9f9;
 +
    background-image: none !important;
 +
}
 +
 +
.vectorTabs li.selected {
 +
    background: #f9f9f9 !important;
 +
}
 +
 +
.vectorTabs ul li {
 +
    background: #f6f6f6;
 +
    background-image: none !important;
 +
}
 +
 +
.vectorTabs span {
 +
    background-image: none !important;
 +
}
   −
h2 {
  −
  width: 100%;
  −
  text-align: center;
  −
  border-bottom: 1px solid #000;
  −
  line-height: 0.1em;
  −
  margin: 10px 0 20px;
  −
}
     −
h2 span {  
+
#simpleSearch {
−
     background:#fff;  
+
    border: none;
−
     padding:0 10px;  
+
     background: #ffffff;
 +
    height: 2.1em;
 +
    margin-top: 0;
 +
    box-shadow: inset 0 -7px 7px -7px rgba(0,0,0,0.15);
 +
}
 +
 
 +
#simpleSearch #searchInput {
 +
     padding: 1em 0 0 .75em;
 +
}
 +
 
 +
div.vectorTabs ul li:not(.selected), div#mw-head div.vectorMenu h3 {
 +
    box-shadow: inset 0 -7px 7px -7px rgba(0,0,0,0.15);
 +
}
 +
 
 +
div.vectorTabs ul li:not(.selected), div#mw-head div.vectorMenu h3 {
 +
    box-shadow: inset 0 -7px 7px -7px rgba(0,0,0,0.15);
 +
}
 +
 
 +
div.vectorTabs, div.vectorTabs ul, div#mw-head div.vectorMenu h3 {
 +
    background: #f6f6f6;
 +
}
 +
 
 +
a {
 +
    text-decoration: none;
 +
    color: #0645ad !important;
 +
    background: none;
 +
}
 +
 
 +
a:visited {
 +
    color: #0b0080;
 
}
 
}
Retrieved from ‘https://tradelands.net/wiki/Special:MobileDiff/45...3736’
Cookies help us deliver our services. By using our services, you agree to our use of cookies.

Navigation menu