Difference between revisions of "MediaWiki:Common.css"

From RetroMMO Wiki
m
 
(42 intermediate revisions by 3 users not shown)
Line 4: Line 4:
 
   src: url("https://wiki.retro-mmo.com/w/images/c/c1/RetroPixels.ttf")
 
   src: url("https://wiki.retro-mmo.com/w/images/c/c1/RetroPixels.ttf")
 
     format("truetype");
 
     format("truetype");
}
 
 
html {
 
  /* RetroPixels scales in multiples of 16 */
 
  font-size: 16px;
 
 
}
 
}
  
Line 18: Line 13:
 
   image-rendering: pixelated;
 
   image-rendering: pixelated;
 
   -ms-interpolation-mode: nearest-neighbor;
 
   -ms-interpolation-mode: nearest-neighbor;
 +
}
 +
 +
b, strong {
 +
  font-weight: 600 !important;
 
}
 
}
  
 
#p-banner {
 
#p-banner {
 
   font-family: RetroPixels !important;
 
   font-family: RetroPixels !important;
   font-size: 1.8rem !important;
+
   font-size: 32px !important;
  margin-top: 0.1rem !important;
 
 
   font-variant: none !important;
 
   font-variant: none !important;
 +
  padding: 2px 0 !important;
 
}
 
}
  
Line 36: Line 35:
 
.mw-body dt {
 
.mw-body dt {
 
   font-family: RetroPixels;
 
   font-family: RetroPixels;
 +
  color:white;
 
}
 
}
  
 
#content {
 
#content {
   font-size: 1.5rem !important;
+
   font-size: 24px !important;
}
 
 
 
.sidebar-chunk {
 
  font-size: 1.25rem !important;
 
 
}
 
}
  
 
#f-list {
 
#f-list {
   font-size: 1.5rem;
+
   font-size: 1.6em;
 
}
 
}
  
Line 57: Line 53:
 
th {
 
th {
 
   font-weight: 400;
 
   font-weight: 400;
 +
}
 +
 +
#social-links {
 +
align-items: center;
 +
display: flex;
 +
justify-content: center;
 +
}
 +
 +
#social-links a:hover {
 +
opacity: .75;
 +
}
 +
 +
#social-links a:not(:last-child) {
 +
margin-right: .5em;
 
}
 
}
  
 
.retrommo-infobox {
 
.retrommo-infobox {
 
   float: right;
 
   float: right;
   width: 20rem;
+
   width: 15em;
 
   border: 1px solid #fec9ed;
 
   border: 1px solid #fec9ed;
 
   border-collapse: separate;
 
   border-collapse: separate;
  margin: 0.25rem 0.5rem;
 
 
   text-align: center;
 
   text-align: center;
 
   border-image: url("https://wiki.retro-mmo.com/w/images/6/60/FrameGrey16.png");
 
   border-image: url("https://wiki.retro-mmo.com/w/images/6/60/FrameGrey16.png");
 
   border-image-width: 16px;
 
   border-image-width: 16px;
 
   border-image-slice: 7 7;
 
   border-image-slice: 7 7;
 +
  border-image-outset: 4px;
 
   background-color: #151515;
 
   background-color: #151515;
 +
  margin-left: 1em;
 +
}
 +
 +
/* Title of the table */
 +
.retrommo-infobox:first-child tr:first-child th:first-child {
 +
  font-size: 1.6em;
 
}
 
}
  
Line 76: Line 92:
 
}
 
}
  
a.new, .new a {
+
.retrommo-infobox tr:last-child td {
   color: #e03c28 !important;
+
  padding-bottom: 1em;
 +
}
 +
 
 +
.wikitable, .wikitable td, .wikitable th {
 +
  border: 2px solid #7b7b7b !important;
 +
  color: white !important;
 +
}
 +
 
 +
.wikitable th {
 +
  background-color: #415d66 !important;
 +
  color: white;
 +
}
 +
 
 +
.wikitable tr:not(:first-child) {
 +
  color: #d7d7d8;
 +
}
 +
 
 +
a.new, .new a, a.external.text {
 +
   color: #e03c28;
 +
}
 +
 
 +
a, a.external.text {
 +
  color: #98dcff;
 +
}
 +
 
 +
a:visited, a.external.text:visited {
 +
  color: #0a98ac;
 +
}
 +
 
 +
#p-logo-text a {
 +
  color: #cececf;
 +
}
 +
 
 +
.mw-body h1.firstHeading {
 +
  text-align: left;
 +
  font-size: 48px;
 +
}
 +
 
 +
.mw-body h1.firstHeading, .tools-inline li.selected {
 +
  border-color: #0a98ac;
 +
}
 +
 
 +
.sidebar-chunk span, h3 {
 +
  font-size: 24px !important;
 +
}
 +
 
 +
input#searchInput {
 +
  font-size: 24px !important;
 +
  margin: -10px;
 +
}
 +
 
 +
.diff-addedline .diffchange,
 +
.diff-deletedline .diffchange {
 +
  color: #20212290;
 +
}
 +
 
 +
code, pre, .mw-code {
 +
  font-family: inherit;
 +
}
 +
 
 +
.mw-headline {
 +
  font-size: 32px;
 +
}
 +
 
 +
#user-tools span {
 +
  font-family: 'RetroPixels';
 +
  font-size: 1.3em;
 +
}
 +
 
 +
#mw-toc-heading {
 +
  font-family: inherit;
 +
  font-size: 2em;
 +
}
 +
 
 +
/* Front page yt and discord icons */
 +
#fp-icon-container {
 +
  float: right;
 +
}
 +
 
 +
/* Green color on "Recent Changes" */
 +
.mw-plusminus-pos {
 +
  color: #05c405;
 +
}
 +
 
 +
#catlinks-sidebar a {
 +
  font-size: 24px !important;
 
}
 
}
  
a {
+
@media only screen and (max-width: 600px) {
   color: #0a98ac !important;
+
   .retrommo-infobox, #fp-icon-container {
 +
    float: none;
 +
  }
 
}
 
}

Latest revision as of 09:32, 8 April 2022

/* CSS placed here will be applied to all skins */
@font-face {
  font-family: "RetroPixels";
  src: url("https://wiki.retro-mmo.com/w/images/c/c1/RetroPixels.ttf")
    format("truetype");
}

body {
  image-rendering: optimizeSpeed;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: -o-crisp-edges;
  image-rendering: pixelated;
  -ms-interpolation-mode: nearest-neighbor;
}

b, strong {
  font-weight: 600 !important;
}

#p-banner {
  font-family: RetroPixels !important;
  font-size: 32px !important;
  font-variant: none !important;
  padding: 2px 0 !important;
}

body,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6,
.mw-body dt {
  font-family: RetroPixels;
  color:white;
}

#content {
  font-size: 24px !important;
}

#f-list {
  font-size: 1.6em;
}

b,
strong {
  font-weight: 400;
}

th {
  font-weight: 400;
}

#social-links {
 align-items: center;
 display: flex;
 justify-content: center;
}

#social-links a:hover {
 opacity: .75;
}

#social-links a:not(:last-child) {
 margin-right: .5em;
}

.retrommo-infobox {
  float: right;
  width: 15em;
  border: 1px solid #fec9ed;
  border-collapse: separate;
  text-align: center;
  border-image: url("https://wiki.retro-mmo.com/w/images/6/60/FrameGrey16.png");
  border-image-width: 16px;
  border-image-slice: 7 7;
  border-image-outset: 4px;
  background-color: #151515;
  margin-left: 1em;
}

/* Title of the table */
.retrommo-infobox:first-child tr:first-child th:first-child {
  font-size: 1.6em;
}

.retrommo-infobox td {
  width: 50%;
}

.retrommo-infobox tr:last-child td {
  padding-bottom: 1em;
}

.wikitable, .wikitable td, .wikitable th {
  border: 2px solid #7b7b7b !important;
  color: white !important;
}

.wikitable th {
  background-color: #415d66 !important;
  color: white;
}

.wikitable tr:not(:first-child) {
  color: #d7d7d8;
}

a.new, .new a, a.external.text {
  color: #e03c28;
}

a, a.external.text {
  color: #98dcff;
}

a:visited, a.external.text:visited {
  color: #0a98ac;
}

#p-logo-text a {
  color: #cececf;
}

.mw-body h1.firstHeading {
  text-align: left;
  font-size: 48px;
}

.mw-body h1.firstHeading, .tools-inline li.selected {
  border-color: #0a98ac;
}

.sidebar-chunk span, h3 {
  font-size: 24px !important;
}

input#searchInput {
  font-size: 24px !important;
  margin: -10px;
}

.diff-addedline .diffchange,
.diff-deletedline .diffchange {
  color: #20212290;
}

code, pre, .mw-code {
  font-family: inherit;
}

.mw-headline {
  font-size: 32px;
}

#user-tools span {
  font-family: 'RetroPixels';
  font-size: 1.3em;
}

#mw-toc-heading {
  font-family: inherit;
  font-size: 2em;
}

/* Front page yt and discord icons */
#fp-icon-container {
  float: right;
}

/* Green color on "Recent Changes" */
.mw-plusminus-pos {
  color: #05c405;
}

#catlinks-sidebar a {
  font-size: 24px !important;
}

@media only screen and (max-width: 600px) {
  .retrommo-infobox, #fp-icon-container {
    float: none;
  }
}