MediaWiki:Common.css

Aus Guild Wars 2 Wiki
Zur Navigation springen Zur Suche springen

Hinweis: Leere nach dem Veröffentlichen 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/Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
  • Opera: Strg+F5
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */

/*
    TABELLENFORMATIERUNG
*/

/* Standard-Definition für Tabellen im Wiki */
table.wikit, table.wikitbasic {
   margin:1em;
   border-collapse:separate;
   border-spacing:0;
   padding:2px;
   border:1px solid #8d8db4;
}

table.wikit th, table.wikit td,
table.wikitbasic th, table.wikitbasic td {
    padding:2px 5px;
}

table.wikit th {
    background-color:#b5b5e7;
    border-right:1px solid #aaaace; 
    border-bottom:1px solid #aaaace; 
    text-align:left;
}

table.wikit > *:first-child > tr:first-child > th {
    background-color:#a3a3d0;
    border-right:0; 
    border-bottom:1px solid #8e8eb2; 
    text-align:center; 
    padding:5px;
}

table.wikit tr th[colspan]  { border-top:1px solid #aaaace; text-align:center; }

/* Alternierende Hintergrundfarbe */
table.wikit tr:nth-child(even) td { background-color:#ededfa; }
table.wikit.keine-zeilenfarben tr:nth-child(even) td { background-color:transparent; }

/* Bilder in Tabellen automatisch skalieren */
.autoskaliert img {
  width:100%;
  height:auto;
}

/* runde Tabellenrahmen */

table.abgerundet, table.wikit {
  border-radius: 6px;
}

table.wikit > *:first-child > tr:first-child > *:first-child,
table.abgerundet tr:first-child td:first-child,
table.abgerundet tr:first-child th:first-child {
  border-top-left-radius:4px;
}

table.wikit > *:first-child > tr:first-child > *:last-child,
table.abgerundet > *:first-child > tr:first-child > *:last-child {
  border-top-right-radius:4px;
}

table.wikit > *:last-child > tr:last-child > *:first-child,
table.abgerundet > *:last-child > tr:last-child > *:first-child {
  border-bottom-left-radius:4px;
}

table.wikit > *:last-child > tr:last-child > *:last-child,
table.abgerundet > *:last-child > tr:last-child > *:last-child {
  border-bottom-right-radius:4px;
}

/* Normalerweise sind Zelleninhalte mittig ausgerichtet. Hiermit kann
das für eine Tabelle (und alle untergeordneten Tabellen) nach oben
geändert werden */
table.ausrichtung-oben td, table.ausrichtung-oben th {
    vertical-align:top;
}

table.wikit tr.rahmen-unten td {
    border-bottom: 1px solid #BBBBEE;
}

table.wikit tr td.rahmen-unten {
    border-bottom: 1px solid #BBBBEE;
}

table.wikit tr.rahmen-oben td {
    border-top: 1px solid #BBBBEE;
}

table.wikit tr td.rahmen-oben {
    border-top: 1px solid #BBBBEE;
}

/*
   KLASSEN-TABELLEN
*/

/* Klassen-Hintergrundbilder */
.hg-dieb { background:url(images/7/7a/Dieb_Icon_Transparent.png) no-repeat bottom right; }
.hg-elementarmagier { background:url(images/8/89/Elementarmagier_Icon_Transparent.png) no-repeat bottom right; }
.hg-ingenieur { background:url(images/b/ba/Ingenieur_Icon_Transparent.png) no-repeat bottom right; }
.hg-krieger { background:url(images/1/12/Krieger_Icon_Transparent.png) no-repeat bottom right; }
.hg-mesmer { background:url(images/c/ce/Mesmer_Icon_Transparent.png) no-repeat bottom right; }
.hg-nekromant { background:url(images/e/e9/Nekromant_Icon_Transparent.png) no-repeat bottom right; }
.hg-wächter { background:url(images/6/61/Wächter_Icon_Transparent.png) no-repeat bottom right; }
.hg-wiedergänger { background:url(images/3/33/Wiedergänger_Icon_Transparent.png) no-repeat bottom right; }
.hg-waldläufer { background:url(images/5/57/Waldläufer_Icon_Transparent.png) no-repeat bottom right; }

/* wikit-Tabellen in Klassenfarben, Farben aus [[Vorlage:Farbe]], bei Änderung bitte auch dort anpassen. */
table.krieger { border-color: #fecd22 }
table.krieger tr th,
table.krieger tr th[colspan] { background-color:#ffe893; border-color: #fadb71; }
table.krieger > *:first-child > tr:first-child > th { background-color:#ffdb5c; border-color: #ffd236; }
table.krieger tr:nth-child(even) td { background-color:#fff0bd; }

table.wächter { border-color: #5e6f83; }
table.wächter tr th,
table.wächter tr th[colspan] { background-color:#b3c8dd; border-color: #a6bcd2; }
table.wächter > *:first-child > tr:first-child > th { background-color:#8ea8c6; border-color: #788fa8; }
table.wächter tr:nth-child(even) td { background-color:#d3dde8; }

table.wiedergänger { border-color: #771313; }
table.wiedergänger tr th,
table.wiedergänger tr th[colspan] { background-color:#DF7979; border-color: #BA5353; }
table.wiedergänger > *:first-child > tr:first-child > th { background-color:#A93333;border-color: #771313; }
table.wiedergänger tr:nth-child(even) td { background-color:#FFB0B0; }

table.dieb { border-color: #6d5666 }
table.dieb tr th,
table.dieb tr th[colspan] { background-color:#ccb1c3; border-color: #bda4b5; }
table.dieb > *:first-child > tr:first-child > th { background-color:#b38ea7; border-color: #83687a; }
table.dieb tr:nth-child(even) td { background-color:#efe3ef; }

table.ingenieur { border:1px solid #aa5500 }
table.ingenieur tr th,
table.ingenieur tr th[colspan] { background-color:#f9ca92; border-color:#e6b57b; }
table.ingenieur > *:first-child > tr:first-child > th { background-color:#e9a159; border-color: #bf5f00; }
table.ingenieur tr:nth-child(even) td { background-color:#f6e8cd; }

table.waldläufer { border-color: #55aa00 }
table.waldläufer tr th,
table.waldläufer tr th[colspan] { background-color:#b2e77d; border-color: #99c76c; }
table.waldläufer > *:first-child > tr:first-child > th { background-color:#90d847; border-color: #71aa38; }
table.waldläufer tr:nth-child(even) td { background-color:#ddf4c6; }

table.elementarmagier { border-color: #cc2222 }
table.elementarmagier tr th,
table.elementarmagier tr th[colspan] { background-color:#f4a4a4; border-color: #d98e8e;  }
table.elementarmagier > *:first-child > tr:first-child > th { background-color:#ee7777; border-color: #d63939; }
table.elementarmagier tr:nth-child(even) td { background-color:#ffdddd; }

table.mesmer { border-color: #5b2469 }
table.mesmer tr th,
table.mesmer tr th[colspan] { background-color:#df99f0; border-color:#cd81ff; }
table.mesmer > *:first-child > tr:first-child > th  { background-color:#cf51ee; border-color: 1px solid #9a00c1: }
table.mesmer tr:nth-child(even) td { background-color:#eeddff; }

table.nekromant { border:1px solid #66c39a }
table.nekromant tr th,
table.nekromant tr th[colspan] { background-color:#a1f3cf; border-color: #90daba;}
table.nekromant > *:first-child > tr:first-child > th { background-color:#74deaf; border-color: #41c189; }
table.nekromant tr:nth-child(even) td { background-color:#ccffee; }

/* Firefox-Standard ist "font-weight:bolder", was seit deren Einführung
der DirectWrite-API zur Auswahl von Arial Black führt, was wiederum zu
einem sehr unruhigen Schriftbild führt. Um das zu vermeiden, hier eine
Rücksetzung auf einen etwas schöneren Wert (Mozilla Bug#640027) */
b, strong {
    font-weight:bold;
}

/*

    HAUPTSEITEN-DESIGN

*/

.page-Hauptseite #firstHeading,
.page-Hauptseite_Bearbeitungskopie #firstHeading {
  display: none;
}

.page-Hauptseite #content,
.page-Hauptseite_Bearbeitungskopie #content {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}

.skin-vector.page-Hauptseite #content,
.skin-vector.page-Hauptseite_Bearbeitungskopie #content {
  padding-top: 0;
}

.skin-vector.page-Hauptseite #siteNotice {
  margin: 1em;
}

/** Schriftarten **/
@font-face {
    font-family:'EasonPro';
  	src:url('https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot');
  	src:url('https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot?#iefix') format('embedded-opentype'),url('https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.woff') format('woff'),url('https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.ttf') format('truetype'),url('https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.svg#EasonProregular') format('svg');
  	font-weight:normal;
  	font-style:normal;
}

/** Hauptseiten-Basislayout */
#hauptseite2-wrapper {
    position: relative;
}

#hauptseite2-container {
    min-width: 1070px;
    max-width: 1070px;
    margin: 0 auto;
    position: relative;
}

.hs2-header {
    position: relative;
    z-index: 2;
}

div#content h2.hs2-column-title {
    border: 0;
    font-size: 100%;
    text-align: center;
    margin: -80px 0 0;
    padding: 0;
    height: 80px;
    line-height: 80px;
    position: relative;
    z-index: 3;
}

h2.hs2-column-title span {
    font-size: 2em;
    font-family: 'EasonPro', 'Garamond', 'Times New Roman', serif;
    color: #fff;
}

.hs2-column {
    width: 33%;
    vertical-align: top;
    padding-bottom: 5px;
}

.hs2-header span.wide, .hs2-column.wide {
    width: 66%;    
}

.hs2-inner {
    margin: 0 30px;
    background: linear-gradient(to bottom, #dbd0db 0%,#f0f0f0 100%);
    box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.75);
    width: 1010px;
    margin-top: -15px;
    padding: 15px 0 15px;
    display: flex;
}

.hs2-inner-footer {
    margin: -240px 30px 0;
    color: #fff;
    position: relative;
    bottom: -135px;
    display: flex;
    width: 1010px;
    pointer-events: auto;
}

.hs2-inner-footer a {
    color: #fff;
    font-weight: normal;
}

.hs2-column-content {
    padding: 5px 15px;
    height: 100%;
}

.hs2-content .hs2-column:not(:first-child) .hs2-column-content {
    border-left: 1px solid #866171;
}

/** Oberer Bereich **/
#hs2-zeile1 .hs2-header span {
    position: relative;
    top: 80px;
}

#hs2-zeile1 ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 12px;
}

#hs2-zeile1 ul small {
    font-weight: bold;
    font-size: 10px;
}

/** Unterer Bereich **/
#hs2-zeile3 .hs2-inner {
    padding-bottom: 150px; 
}

#hs2-zeile2, 
#hs2-zeile3 {
    margin-top: -15px;    
}

#hs2-footer {
    margin-top: -150px;
    position: relative;
    pointer-events: none;
}

/** Hintergrundbilder **/
#hs2-bg1 {
    position: absolute;
    top: 0;
    left: 0px;
    width: 467px;
    height: 783px;    
    background: url('//wiki-de.guildwars2.com/images/2/20/Hauptseite_Hintergrund_Balthasar.jpg') no-repeat;
}

#hs2-bg2 {
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 455px;
    height: 1000px;
    background: url('//wiki-de.guildwars2.com/images/e/ed/Hauptseite_Hintergrund_Raptor.jpg') no-repeat;
}

#hs2-zeile1 .hs2-header {
    height: 124px;
    background: url('//wiki-de.guildwars2.com/images/6/64/Hauptseite_Logo.png') no-repeat 35px center,
                url('//wiki-de.guildwars2.com/images/7/71/Hauptseite_Box_1.png') no-repeat top center;
}

#hs2-zeile2 .hs2-header {
    height: 80px;
    line-height: 80px;
    background: url('//wiki-de.guildwars2.com/images/b/b3/Hauptseite_Box_2.png') no-repeat top center;
}

#hs2-zeile3 .hs2-header {
    height: 78px;
    line-height: 78px;
    background: url('//wiki-de.guildwars2.com/images/3/3c/Hauptseite_Box_3.png') no-repeat top center;
}

#hs2-footer {
    height: 272px;
    background: url('//wiki-de.guildwars2.com/images/c/c5/Hauptseite_Box_4.png') no-repeat top center;
}

#hauptseite-editcopy {
    text-align: center;
}

/* 

    INFOBOXEN

*/


/* Allgemeine Infobox-Formatierung, Kopf- und Inhaltsbereiche */
div.infobox { margin: 0 0 0.5em 0.5em; border:1px solid silver; border-radius:7px; float:right; font-size:0.95em; text-align:left; width: 260px; }
div.infobox .infobox-kopf  { text-align:center; background-color:#ccc; font-weight:bold; margin:8px 2px; border-radius:4px; padding:2px; }
div.infobox .infobox-kopf:first-child { margin-top:2px; }
div.infobox .infobox-daten { margin:8px 0; }

/* Aufzählunglisten (Verwendung ;Key :Value) mit Trennlinie */
div.infobox .infobox-daten dl { margin: 0; padding: 0; }
div.infobox .infobox-daten dt { clear: left; float: left; text-align: right; line-height: 1em; margin: 0; padding: 5px 8px 2px 3px; font-weight: bold; }
div.infobox .infobox-daten dd { float: left; text-align:left; border-left-width:2px; border-left-style: solid; border-left-color:inherit; font-weight: normal; margin: 0; padding: 2px 3px 2px 7px; }

div.infobox .infobox-daten dt { width:43%; }
div.infobox .infobox-daten dd { width:48%; }

/* Verbreitert die Listen-Spalten zum Verhältnis 2:1 (Standard ist etwa 1:1) */
div.infobox .infobox-daten.aufzählung-numerisch dt { width: 60%; }
div.infobox .infobox-daten.aufzählung-numerisch dd { width: 29%; }

/* Und einmal 1:2 */
div.infobox .infobox-daten.aufzählung-kleinetitel dt { width: 30%; }
div.infobox .infobox-daten.aufzählung-kleinetitel dd { width: 59%; }

/* Ermöglicht die Definition einer globalen Rahmenfarbe, die auch von enthaltenen Listen übernommen wird */
div.infobox * { border-color:inherit; }

/* Spezielle Infoboxen */
.infobox-effektliste { margin-top:1em; font-style:normal; font-size:95%; }
.infobox-effektliste ul { list-style:none; margin:0; }

.effektliste.eigenschaft { padding-top:1em; font-style:normal; font-size:95%; }
.effektliste.eigenschaft dd { margin-left:0; }


/* Farben für Infoboxen - Diskussion: [[GW2Wiki Diskussion:Formatierung]] */
div.infobox-aufgabe .infobox-kopf { background-color: #fee88f }
div.infobox-aufgabe { border-color: #fecb00 }

div.infobox-event .infobox-kopf { background-color: #fcbe5d }
div.infobox-event { border-color: #d66f1b }

div.infobox-persönliche-geschichte .infobox-kopf { background-color: #bee57c }
div.infobox-persönliche-geschichte { border-color: #79924f }

div.infobox-schauplatz .infobox-kopf { background-color: #dfcea1 }
div.infobox-schauplatz .infobox-kopf.ebene2 { background-color: #dfd0aa }
div.infobox-schauplatz { border-color: #857b60 }

div.infobox-effekt .infobox-kopf { background-color: #f6c1a7 }
div.infobox-effekt { border-color: #a96b4c }

div.infobox-gegenstand .infobox-kopf,
div.vorlage-rezept .infobox-kopf { background-color: #acbbc2 }
div.infobox-gegenstand,
div.vorlage-rezept { border-color: #929fa6 }

div.infobox-waffe .infobox-kopf,
div.vorlage-rezept.waffe .infobox-kopf { background-color: #bbbbff }
div.infobox-waffe,
div.vorlage-rezept.waffe { border-color: #6f6f97 }

div.infobox-rüstung .infobox-kopf,
div.vorlage-rezept.rüstung .infobox-kopf { background-color: #cbe4e4 }
div.infobox-rüstung,
div.vorlage-rezept.rüstung { border-color: #7ea19c }

div.infobox-schmuck .infobox-kopf,
div.vorlage-rezept.schmuck .infobox-kopf { background-color: #a9d4d8 }
div.infobox-schmuck,
div.vorlage-rezept.schmuck { border-color: #85a7aa }

div.infobox-nsc  .infobox-kopf { background-color: #e2d0b6}
div.infobox-nsc  { border-color: #9c8f7d}

/* Standardanzeige für Handelsposten-Preis: Verkaufspreis anzeigen */
.tradeprice .buy  { display:none; }
.tradeprice .sell { display:inline; }

/* Formatierung für Waffengalerie/Rückengalerie */
ul.galerie { list-style:none; padding:0; margin:0 }
ul.galerie > li { display:inline-block; width:206px; vertical-align:top }
ul.galerie > li > div:first-child { width:180px; height:220px; margin:5px auto; padding: 10px; border:1px solid #ccc; background-color:#f9f9f9; }

/*

   CLEAR-Klassen

   clearfix: Alle nachfolgenden Elemente fließen nicht mehr.
   clear: Ich selbst möchte nicht mehr fließen, erzeugt auch einen kleinen Absatz.

   Bevorzugte Methode sollte immer clear sein, clearfix nur in den Fällen, in denen
   es nicht anders geht oder wo ein größerer Abstand gefordert ist (für's Layout). 

*/

.clearfix:before, .clearfix:after { content:""; display:table; }
.clearfix:after { clear:both; }
.clearfix { zoom:1; } /* IE 6/7 */

.clear { clear: both; }


/*

    VERSCHIEDENES

*/

/* Dropdown und sowas */
.dropdown-box {
  display: none;
}

.dropdown-auslöser:hover .dropdown-box {
  display: inline !important;
}

/* Überschriften erster Ebene sind derart bedeutsam, dass keine Floatobjekte hineinragen dürfen */
#bodyContent h1 {
  clear: both;
}

/* Schachbrett-Muster als Hintergrund für Bildervorschau, damit man die Transparenz erkennen kann */
#file img {
   background: url('/images/c/c3/Schachbrett.png');
}

/* Verschiebbare Bilder (anwenden auf direktes Elternelement des Bildes) */
.draggable {
  cursor: move;
  overflow: hidden;
  width: 80%;
  height: 500px;
}

/* IE-Bugfixes... bitte nur IE9+ sonst kommen wir hier nicht mit dem Platz aus... */

/* 
   http://haslayout.net/css/Non-Inherited-TH-Text-Align-Bug, 
   http://paulirish.com/2009/browser-specific-css-hacks/
 */

th {text-align:inherit\0/;}

/* Unsere wikit-Deklaration überschreibt das padding von class="sortable" */
table.wikit.jquery-tablesorter > * > tr > th.headerSort {
    padding-right:21px;
}

.hilfe {
    border-bottom: 1px dotted #aaa;
    cursor: help;
}

/* CSS für Karten, siehe [[Widget:Karte]] und [[MediaWiki:Common.js]] */
.gw2map{
	width: 800px;
	height: 450px;
	background-color: #fff;
}

.sector_text{
	color: #fff;
	font-family: Menomonia,sans-serif;
	font-style: italic;
	font-size: 20px;
	white-space: nowrap;
	text-align: center;
}

.table-row{
	display: table-row;
}

.table-cell{
	display: table-cell;
	vertical-align: top;
}

.linkbox{
	overflow: scroll;
	overflow-x: auto;
	overflow-y: scroll;
	padding: 0 .25em 0 .25em;
}

.linkbox > div{
	white-space: nowrap;
	cursor: pointer;
}

.linkbox > div.header{
	cursor: default;
	font-size: 200%;
	font-weight: bold;
	padding: 0.25em 0 0.25em 0;
}

.linkbox > div.header.sub{
	font-size: 150%;
	padding: 0.25em 0 0.25em 0;
}

.linkbox > div:not(.header):not(.sub):hover{
	background-color: #ccc;
}

div.mw-dismissable-notice .mw-dismissable-notice-body { margin: 0; margin-bottom: .5em; }
div.mw-dismissable-notice .mw-dismissable-notice-close { margin-right: 5px; }

/* Spalten für SMW-Listen */
ul.smw-format.ul-format.zweispaltig {
	column-count: 2;
}

ul.smw-format.ul-format.dreispaltig {
	column-count: 3;
}

ul.smw-format.ul-format.vierspaltig {
	column-count: 4;
}

ul.smw-format.ul-format.inline {
	display: inline-block;
}

ul.smw-format.ul-format.inline.zweispaltig,
ul.smw-format.ul-format.inline.dreispaltig,
ul.smw-format.ul-format.inline.vierspaltig {
	column-gap: 2em;
}