MediaWiki:Common.css: Difference between revisions

From Protochroma Wiki
imported>Konz
mNo edit summary
No edit summary
 
(36 intermediate revisions by 3 users not shown)
Line 1: Line 1:
/* Font imports */
/* -- Font imports -- */
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,700&display=swap');
body {
  font-family: 'PT Serif', serif;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Open Sans', sans-serif;
    color: #042229;
}
h1 {
    font-weight: bold;
}
/* Wiki background */
body
{
    background-image: url(https://static.miraheze.org/protochromawiki/2/26/Background.png);
    background-repeat: repeat;
}
/* Content background */
.mw-body
{
    background-color: #D0D0D0;
}
#sidebar div.pBody {
    background-image: linear-gradient(to right, #181a1b, #42484b);
    border-left: 5px solid #1e90ff;
    border-right: transparent;
    border-top: transparent;
    border-bottom: transparent;
}
#sidebar a {
    color: #1affff;
    font-size: 13px;
}
#sidebar a:hover {
    color: white;
}
/* Removes Monobook white banner at the top */
div#globalWrapper
{
    font-size: 130%;
    width: 100%;
    margin: 0; padding: 0;
    background-image: none;
}


/* Gallery styles background changes are restricted to screen view. In printing we should avoid applying backgrounds. */
/* Gallery styles background changes are restricted to screen view. In printing we should avoid applying backgrounds. */
Line 76: Line 24:
}
}


/* -- Main page containers -- */


.maincontainer { 


/* nav styling */
    width: 100%;
#p-personal li a {
    display: flex;
  color: #ffffff;
    margin: auto;
}
#p-personal li a:hover {
  background: none;
}
}


.mw-echo-notifications-badge:before {
.textcontainer {
  background-color: #ffffff;
 
  box-shadow: 0px 0px 5px #ffffff;
    width: 70%;
}
    padding-right: 10px;  
    text-align:justify;


[role="navigation"] {
  font-family: 'Open Sans', sans-serif;
}
}


#p-cactions li.selected {
.rsscontainer {
  border-color: #00FFFF;
}


#sidebar h3 {
    border: 2px solid;
  color: #ffffff;
    border-color: #1e90ff;
}
    background-color: #a9a9a9;
    text-align:justify;  
    padding-right: 8px;
    width: 30%;


.mw-body:not(.toc) a:not(.new) {
  color: #042229;
  text-decoration: underline;
  font-weight: bold;
}
}


.mw-body a.new {
.toplinkcontainer, .toplinkcontainer2 {
  text-decoration: underline;
  font-weight: bold;
}


#footer, .mw-footer {
     border: 2px solid;  
     border-top: 1px dotted white;
     border-color: #1e90ff;  
     border-bottom: 1px dotted white;
     background-color: #000000;
     background-color: #a9a9a9;
    color:#ffffff; font-size:3em;
    width: 50%;  
     font-family: 'Open Sans', sans-serif;
     font-family: 'Open Sans', sans-serif;
     font-size: 13px;
     padding-left: 5px;
 
}
}


/* link style */
.linkcontainer, .linkcontainer2 {
a, a:visited {
 
     color: #000080;
     background-color: #a9a9a9;
    width: 50%;
 
}
}


a:hover {
/* -- Mobile -- */
     color: #0000CD;
 
@media (max-width: 1278px){
 
.maincontainer, .textcontainer, .toplinkcontainer, .linkcontainer, .toplinkcontainer2, .linkcontainer2 {
 
     flex-direction: column;
    width: 100% !important;
 
}
}


/* border coloring */
.infobox {


h1, h2 {
    float: none !important;
  border-bottom: 1px solid #000000;
    width: 100% !important;
    margin: 0px !important;
}
}


hr {
.scrollbox {
  color: #99815f;
 
  background-color: #99815f;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}
}


/* Tabbed infoboxes */
.rsscontainer {


table {
    visibility: hidden;
     font-family: 'Open Sans', sans-serif;
     display: none;
}
}


element.style {
    font-size: 140%;
}
}


.tabbedInfobox {
@media screen and (max-width: 550px){
  float: right;
table.border {
}
 
.tabbedInfobox ul.tabbernav{
    width: 100%;
  border: none;
  font: inherit;
  padding: 0px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
.tabbedInfobox .tabbertab {
  padding: 0px;
  border: none;
}
}
.tabbedInfobox ul.tabbernav li a {
  border: solid 2px #5f8b99;
  border-bottom: none;
  border-radius: 0.25em 0.25em 0px 0px;
  display: inline-block;
  width: 85%;
}
}
ul.tabbernav li {
  flex: 1 0 25%;
  margin-right: 2%;
 
}
/* Wiki table */


/* Header */
/* -- Wiki table -- */


/* header */
.wikitable > tr > th, .wikitable > * > tr > th {
.wikitable > tr > th, .wikitable > * > tr > th {
     background-color: #afafaf;
     background-color: black;
    color: white;
}
}


/* Body */  
/* sortable table header */
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort  {
    background-image: url(https://protochroma.wiki/w/images/a/a6/Sort_both.png);
    background-color: black;
    color: white;
}


.wikitable {
.wikitable {
    background-color: #afafaf;
     color: #000000;
     color: #000000;
     margin: 1em 0;
     margin: 1em 0;
     border: 1px solid #a2a9b1;
     border: 1px dotted #ffffff;
     border-collapse: collapse;
     border-collapse: collapse;
    font-family: 'Open Sans', sans-serif;
     font-size: 12px;
     font-size: 13px;
}
}


.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
.wikitable > tr > td, .wikitable > * > tr > td {
     border: 1px dotted #ffffff;
     background-color: #c1c1c1;
}
}

Latest revision as of 18:38, 9 April 2023

/* -- Font imports -- */
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,700&display=swap');

/* Gallery styles background changes are restricted to screen view. In printing we should avoid applying backgrounds. */
@media screen {
	/* The backgrounds for galleries. */
	#content .gallerybox div.thumb {
		/* Light gray padding */
		background-color: #f8f9fa;
	}
	/* Put a chequered background behind images, only visible if they have transparency.
	'.filehistory a img' and '#file img:hover' are handled by MediaWiki core (as of 1.19) */
	.gallerybox .thumb img {
		background: #fff url(//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png) repeat;
	}
	/* But not on articles, user pages, portals or with opt-out. */
	.ns-0 .gallerybox .thumb img,
	.ns-2 .gallerybox .thumb img,
	.ns-100 .gallerybox .thumb img,
	.nochecker .gallerybox .thumb img {
		background-image: none;
	}
}

/* -- Main page containers -- */

.maincontainer {  

    width: 100%;  
    display: flex; 
    margin: auto;
}

.textcontainer {

    width: 70%; 
    padding-right: 10px; 
    text-align:justify;

}

.rsscontainer {

    border: 2px solid;
    border-color: #1e90ff; 
    background-color: #a9a9a9; 
    text-align:justify; 
    padding-right: 8px; 
    width: 30%;

}

.toplinkcontainer, .toplinkcontainer2 {

    border: 2px solid; 
    border-color: #1e90ff; 
    background-color: #000000; 
    color:#ffffff; font-size:3em; 
    width: 50%; 
    font-family: 'Open Sans', sans-serif;
    padding-left: 5px;

}

.linkcontainer, .linkcontainer2 {

    background-color: #a9a9a9; 
    width: 50%;

}

/* -- Mobile -- */

@media (max-width: 1278px){

.maincontainer, .textcontainer, .toplinkcontainer, .linkcontainer, .toplinkcontainer2, .linkcontainer2 {

    flex-direction: column;
    width: 100% !important;

}

.infobox {

    float: none !important;
    width: 100% !important;
    margin: 0px !important;
}

.scrollbox {

    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.rsscontainer {

    visibility: hidden;
    display: none;
}

}

@media screen and (max-width: 550px){
table.border {

    width: 100%;
}
}

/* -- Wiki table -- */

/* header */
.wikitable > tr > th, .wikitable > * > tr > th {
    background-color: black;
    color: white;
}

/* sortable table header */
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort  {
    background-image: url(https://protochroma.wiki/w/images/a/a6/Sort_both.png);
    background-color: black;
    color: white;
}

.wikitable {
    color: #000000;
    margin: 1em 0;
    border: 1px dotted #ffffff;
    border-collapse: collapse;
    font-size: 12px;
}

.wikitable > tr > td, .wikitable > * > tr > td {
    background-color: #c1c1c1;
}