MediaWiki:Makeover.css

Hinweis: Leeren Sie nach dem Speichern den Browser-Cache, um die Änderungen sehen zu können.

• Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
• Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
• Internet Explorer: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
• Opera: Extras → Internetspuren löschen … → Individuelle Auswahl → Den kompletten Cache löschen

/* CSS an dieser Stelle wirkt sich nur aus wenn Makeover-Skin selektiert ist */

/* Hinweis, dass unsigned als subst eingebunden werden sollte */
.action-submit .unsigned::after {
    background: none repeat scroll 0 0 #c32e04;
    color: white;
    content: "An `subst:` gedacht?";
    margin-left: .5em;
    padding: .1em .5em;
    vertical-align: top;
}

/* Tabellen Finanzbericht */
.finanzbericht td:not(:first-child) {
  text-align: right;
}

body.action-edit #editform #wpTextbox1 {
  tab-size: 4;  /* Bei Beispielen den Tabgröße auf 4 setzen, passt dann zu Frickl */
}
#editform .mw-editTools > ul {
  list-style: none;
  display: flex;
  justify-content: center;
  gap: 0.5em;
  margin: 0;
}

#editform .mw-editTools > ul li {
  margin: 0;
}

#editform .mw-editTools > ul li button {
  padding: 0.2em 0.5em;
  background-color: white;
  border: thin solid #114;
  border-bottom-style: none;
  border-radius: 0.3em 0.3em 0 0;
}

#editform .mw-editTools > ul > li button[aria-selected=true] {
  background-color: #ccf;
}

#editform .mw-editTools #specialchars {
	border: thin solid #666;
	text-align: center;
	display: block;
}

#editform .mw-editTools #specialchars p {
	line-height: 1.7em;
}

#editform .mw-editTools #specialchars a {
	color: var(--text-color);
	background-color: ButtonFace;
	border-radius: 0.2em;
	padding: 0em 0.3em;
	border: thin solid black;
}


.example {
	border-left-color: #dfac20;
	background-color: var(--yellow1);
}

.example [role=heading] {
	font-weight: bold
}

.private {
	display: none
}


/* Referenz-Tabellen */
div.flexcontainer {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 60em ) {
  div.flexcontainer {
    flex-direction: column;
  }
}

@media (min-width: 40em) {
  div.refcontainer {
	display: grid;
	grid-template-columns: 1fr fit-content(15em);
  }
}

table.attribute-reference {
	width: 100%;
	min-width: 25em;   /* Just a test */
}
table.attribute-reference > caption {
	background: #f1f3f4;
	border: 1px solid #d5d5d5;
	border-bottom: none;
	padding: 0.5em 1em;
}

.flexcontainer dl {
	display: grid;
	grid-template-columns: min-content 1fr;
	row-gap: 0.3em;
}
.flexcontainer dt,
.reference dt { 
	grid-column: 1 / 2;
}
/* und noch der Doppelpunkt */
.flexcontainer dt::after,
.reference dt::after { 
	content: ": "; 
}
.flexcontainer dd,
.reference dd { 
	margin: 0; 
	padding-left: 1em; 
	grid-column: 2 / 3;
}
.flexcontainer ul,
.reference ul { 
	margin: 0 0 0 1em;
}
.flexcontainer dd p:first-child,
.reference dd p:first-child {
	margin-top: 0;
}
.flexcontainer dd p:last-child,
.reference dd p:last-child {
	margin-bottom: 0;
}

table.html5-element-reference .syntax p {
        background-color: #fdfcf3;
        border: 1px dashed #e7c157;
        color: #000000;
        font-family: monospace;
        font-size: 1.2em;
        line-height: 1.1em;
        padding: .8em 1em;
}
.wrapper > table {
  width: 100%;
}

/* Tabelle Hilfe:Farbtabelle */

table.farbtabelle {
        border-collapse: separate;
        border-spacing: .2em;
}
table.farbtabelle tr th, 
table.farbtabelle tr td {
        padding: 0.4em 1em;
        text-align: center;
}
table.farbtabelle tr td:nth-child(2) {
        text-align: left;
}

/* Tabelle JavaScript-Attribute */
table.js-attr {
  margin-bottom: 1.5em;
}
table.js-attr caption {
  text-align: left;
  font-weight: bold;
  margin: 0.4em 0 0.5em;
}
table.js-attr td {
  background-color: light-dark(var(--green3),var(--grey));
  padding: .25em 2em .25em .5em;
  min-width: 5em;
}
table.js-attr td:first-child {
  background-color: light-dark(var(--blue3),var(--moss));
  min-width: 8em;
}
table.js-attr tr:first-child td:last-child {
  border-top-right-radius: .5em;
}
table.js-attr tr:last-child td:first-child {
  border-bottom-left-radius: .5em;
}
table.js-attr tr:last-child td:last-child {
  border-bottom-right-radius: .5em;
}

/* Experiment für Safari */
#quick-access {
/*	Skin bringt mit:
	position: absolute;
	top: 1em oder 3em, je nach width
	left: 100% 
*/
	top: auto !important;
}
#quick-access > ul {
/*	position: fixed ist im Skin gesetzt
	Versuche, die vertikale Position des ul direkt festzulegen und nicht vom #quick-access zu erben
*/
	top: 40%;
	transform: translate(0, -50%, 0);

}

@media (max-width: 60em ) {
	.tocright, .aside {
		width: 100%;
		margin: 0;
		padding: 0;
		text-align: center;
	}
	.aside .toc > b {
		display: block;
	}
	.aside ul {
		display: inline;
		margin: 0!important;
		padding: 0!important;
	}
	.aside li {
		display: inline;
		margin: 0!important;
		padding: 0!important;
	}
	.aside li a::after, .aside li b::after, .aside li strong::after {
		content: url("/skins/Selfhtml/images/bullet.gif");
		padding: 0 .2em 0 .4em;
		white-space: nowrap;
	}
        .aside li b > a::after {
                content: "";
                padding: 0;
        }
	.aside .toc > ul:first-of-type > li:first-of-type > a::before,
        .aside .toc > ul:first-of-type > li:first-of-type > b::before {
		content: url("/skins/Selfhtml/images/bullet.gif");
		padding: 0 .4em 0 .2em;
	}
}