Difference between revisions of "MediaWiki:Common.css"

Revision as of 17:24, 22 September 2019

/* CSS placed here will be applied to all skins */

/*INFOBOX STUFF*/

/* Navbar styling when nested in infobox and navbox */
.infobox .navbar {
	font-size: 100%;
}



/* Infobox template style */
.infobox {
	border: 1px solid #a2a9b1;
	border-spacing: 3px;
	background-color: #f8f9fa;
	color: black;
	/* @noflip */
	margin: 0.5em 0 0.5em 1em;
	padding: 0.2em;
	/* @noflip */
	float: right;
	/* @noflip */
	clear: right;
	font-size: 88%;
	line-height: 1.5em;
}
.infobox caption {
	font-size: 125%;
	font-weight: bold;
	padding: 0.2em;
	text-align: center;
}
.infobox td,
.infobox th {
	vertical-align: top;
	/* @noflip */
	text-align: left;
}
.infobox.bordered {
	border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
	border: 1px solid #a2a9b1;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
	border: 0;
}

.infobox.sisterproject {
	width: 20em;
	font-size: 90%;
}

.infobox.standard-talk {
	border: 1px solid #c0c090;
	background-color: #f8eaba;
}
.infobox.standard-talk.bordered td,
.infobox.standard-talk.bordered th {
	border: 1px solid #c0c090;
}

/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
	border: 0;
	border-top: 1px solid #a2a9b1;
	/* @noflip */
	border-right: 1px solid #a2a9b1;
}

.infobox.bordered .mergedrow td,
.infobox.bordered .mergedrow th {
	border: 0;
	/* @noflip */
	border-right: 1px solid #a2a9b1;
}

/* Styles for geography infoboxes, eg countries,
   country subdivisions, cities, etc.            */
.infobox.geography {
	border-collapse: collapse;
	line-height: 1.2em;
	font-size: 90%;
}

.infobox.geography  td,
.infobox.geography  th {
	border-top: 1px solid #a2a9b1;
	padding: 0.4em 0.6em 0.4em 0.6em;
}
.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th {
	border-top: 1px solid #a2a9b1;
	padding: 0.4em 0.6em 0.2em 0.6em;
}

.infobox.geography .mergedrow td,
.infobox.geography .mergedrow th {
	border: 0;
	padding: 0 0.6em 0.2em 0.6em;
}

.infobox.geography .mergedbottomrow td,
.infobox.geography .mergedbottomrow th {
	border-top: 0;
	border-bottom: 1px solid #a2a9b1;
	padding: 0 0.6em 0.4em 0.6em;
}

.infobox.geography .maptable td,
.infobox.geography .maptable th {
	border: 0;
	padding: 0;
}

/*Makes the property labels bold, with the exception of captions.*/
.infobox > * > tr > td:first-child {
    font-weight: bold;
}
/*Makes the property labels bold*/
.infobox > * > tr > td.caption {
    font-weight: normal;
}
/*Makes the headers in infoboxes more spacious.*/
.infobox > * > tr > th {
    padding: 10px !important;
}

table.infobox > * > tr > th {
    background-color: #232323;
    border: none;
}
table.infobox, table.wikitable > * > tr > td{
    background-color: #5B5760;
    border: none;
    width: 300px;
}

.infobox {
    padding: 0px;
    border-spacing: 0px;
}

/*Forum stuff:*/
table.mw-wikiforum-frame {
    background: #423C49;
}
td.mw-wikiforum-thread-main {
    background: #46414a;
}
th.mw-wikiforum-thread-top {
    background: #2c272f;
}
tr.mw-wikiforum-title, tr.mw-wikiforum-normal, table.mw-wikiforum-title, .mw-wikiforum-thread-sub {
    background: #46414a !important;
}
textarea, input {
    background: #342f38;
    color: #f3f3f3;
}
td.mw-wikiforum-thread-main, td.mw-wikiforum-thread-sub {
    word-break: keep-all;
}
/*Spoiler text*/
.spoiler, .spoiler2{ 
    color: #271E27;
    background-color: #271E27;
    padding: 3px;
    border-radius: 6px;
}

.spoiler:hover{
    color: white;
}

/* Contrasted text */
.contrasted {
    background: inherit;
    background-clip: text;
    color: transparent;
    filter: grayscale(100%) contrast(100000%) invert(100%);
}

/*Animations*/
@webkit-keyframes spin {
    from {} to {transform:rotate(360deg);}
}
@keyframes spin {
    from {} to {transform:rotate(360deg);}
}
:root{
  --intensity: 5px
}
@keyframes vertical {
  0%   {transform: translate(0px, calc(-1*var(--intensity)) )}
  50%  {transform: translate(0px, calc(   var(--intensity)) )}
  100% {transform: translate(0px, calc(-1*var(--intensity)) )}
}
@keyframes horizontal {
  0%   {transform: translate(calc(-1*var(--intensity)), 0px)}
  50%  {transform: translate(calc(   var(--intensity)), 0px)}
  100% {transform: translate(calc(-1*var(--intensity)), 0px)}
}

@keyframes rainbow {
  0%   {}
  100% {filter:hue-rotate(360deg)}
}

/* redirect marker */

#contentSub, #contentSub2 {
    color: #AFAFAF;
}

/* Overlay styling for stuff like seizure warnings */
#overlay {
  position: fixed; /* Sit on top of the page content */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #55505a; /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
}

/*button styling*/
.button-confirm, .button-cancel{
    font-weight: bold;
    border-radius: 5px;
    padding: 5px;     /*thicc button*/
    margin: 5px;
    cursor: pointer; /*Make it look clickable*/
}

.button-confirm { background: #44B83B; }
.button-cancel  { background: #D36443; }

/*sidebar*/
#mw-panel {
    background: #45404A;
    left: -12px;
    padding-bottom: 11px;
    padding-top: 34px;
    top: -27px;
    border-radius: 10px;
    position: fixed;
}