MediaWiki:Common.css

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. */

/* Grundlegende Farbpalette */
:root {
    --primary-color: #3E3E3E; /* Dunkleres Grau für Hintergründe */
    --secondary-color: #9E9E9E; /* Mittelgrau für Karten/Boxen */
    --accent-color: #BA6700; /* Dunklere Rostfarbe für Akzente */
    --text-color: #E0E0E0; /* Helles Grau für Text */
    --link-color: #8AB4F8; /* Verblasstes Blau für Links */
    --button-hover-color: #4CAF50; /* Verblasstes Grün für Button-Hover */
}

/* Erweiterte Texturierung und Farbanpassungen */
:root {
    --button-texture: url('https://de.maddraxikon.com//asphalt.png'); /* Pfad zur Texturgrafik */
}

/* Schriftarten und Typografie */
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');

body, input, button, select, textarea {
    font-family: 'Special Elite', Courier, monospace; /* Schreibmaschinenschrift */
}

/* Grafische Elemente */
.button {
    border: 1px solid var(--accent-color);
    background-image: var(--button-texture), linear-gradient(var(--secondary-color), var(--primary-color));
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}

/* Anwendung der Farben */
body {
    background-color: var(--primary-color);
    color: var(--text-color);
}

a {
    color: var(--link-color);
}

a:hover {
    color: var(--button-hover-color);
}

/* Stile für UI-Elemente */
.button {
    background-color: var(--secondary-color);
    color: var(--text-color);
}

.button:hover {
    background-color: var(--accent-color);
}

/* Hintergründe für Abschnittstitel */
.section-title {
    background-color: var(--secondary-color);
    border-bottom: 2px solid var(--accent-color);
}


/* Hauptmenü-Stil */
#mw-panel .vector-menu-content-list li {
    margin-bottom: 5px; /* Abstand zwischen den Menüpunkten */
}

#mw-panel .vector-menu-content-list li a {
    display: block;
    padding: 8px 10px; /* Innenabstand */
    background-color: #333; /* Dunkler Hintergrund für die Buttons */
    color: white; /* Helle Textfarbe */
    text-decoration: none; /* Keine Unterstreichung */
    border-radius: 4px; /* Abgerundete Ecken */
    transition: background-color 0.3s; /* Animation für Hover-Effekt */
}

#mw-panel .vector-menu-content-list li a:hover {
    background-color: #555; /* Hintergrundfarbe beim Überfahren mit der Maus */
}

/* Stil für die Hauptmenü-Überschriften */
#mw-panel .vector-menu-portal .vector-menu-heading {
    background-color: #444; /* Dunkler Hintergrund */
    color: #c0c0c0; /* Leicht helle Textfarbe */
    padding: 8px 12px; /* Erhöhter Innenabstand */
    font-family: 'Courier New', Courier, monospace; /* Monospaced-Schriftart */
    font-size: 1.1em; /* Vergrößerte Schrift */
    border-bottom: 1px solid #333; /* Untere Grenze für die Trennung */
    text-transform: uppercase; /* Großbuchstaben */
    letter-spacing: 1px; /* Buchstabenabstand */
    text-shadow: 2px 2px 2px #000; /* Textschatten für einen Kontureffekt */
}

/* Link "Umschalten zum bisherigen Aussehen" im Hauptmenü versteckt */
.mw-sidebar-action-content {
    display: none;
}

#mw-panel {
    background-image: url('https://de.maddraxikon.com//beton.png');
    background-size: cover; /* Stellt sicher, dass das Bild den gesamten Bereich abdeckt */
    background-repeat: no-repeat; /* Verhindert das Wiederholen des Bildes */
}







/* Alte CSS-Codes (werden nach und nach ersetzt) */

/* Veröffentlichungen nur untereinander, wenn notwendig */
.veroeffentlichungen {
display: flex;
flex-wrap: wrap;
}

.veroeffentlichungen > * {
flex: 1 1 300px;
margin: 10px;
}

@media (max-width: 600px) {
.veroeffentlichungen {
flex-direction: column;
}
}

/* Linkfarben */

/* Buttons */
.Hauptseite-Button a {
	display: inline-block;
	color: #69c23c;
	font-size: 1.4rem;
	font-family: 'Permanent Marker', bold;
	text-decoration: none;
	background-color: #858381;
	padding: 2px 6px 2px 6px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	border-left: 1px solid #CCCCCC;
	border-radius: 8px;
	background-size: 300px 100px;
	width: 175px;
}
.Hauptseite-Button div {
	width: 100%;
}

/*
.generated-sidebar a {
color:#21350d !important;
}*/

/* Hauptseite */
 .Hauptseite-Box {
   box-shadow: 0.4em 0.4em 0.4em rgba(0,0,0,0.25);
   -moz-box-shadow: 0.4em 0.4em 0.4em rgba(0,0,0,0.25);
   -webkit-box-shadow: 0.4em 0.4em 0.4em rgba(0,0,0,0.25);
 }

.generated-sidebar a {
color:#...... !important;
}

body.page-Hauptseite h1.firstHeading { display:none; }

 .Hauptseite-Box h2 {
   border: 1px solid #AAAAAA;
   background-color: #68211C;
   color: #69c23c;
   text-shadow: 2px 2px 2px black, 5px 5px 10px black;
   padding: 0.2em 0;
   margin: 0 !important;
   font-size: 110%;
   font-weight: bold;
   text-indent: 0.5em;
 }
 /*.Hauptseite-Inhalt {
   border: 1px solid #472322;
   border-top: 0px solid #FFFFFF;
   background-color: #FFFFFF;
   margin-bottom: 1em;
   padding: 0.2em 0.8em 0.2em 0.8em;
 }*/

/* +++++ Standardtabelle für Auflistung +++++ */

 table.maddraxikon_std_table {
        border: 1px solid #605f46;
        border-collapse: collapse;
        background-color: #FFF;
        width: 100%;
 }	
		
 table.maddraxikon_std_table tr {
        border: 1px solid #605f46;
        border-collapse: collapse;
 }

 table.maddraxikon_std_table th {
        border: 1px solid #605f46;
        border-collapse: collapse;
        padding: 2px 4px;
        text-align: left;
        background-color: #605f46;
 }

 table.maddraxikon_std_table td { 
        border: 1px solid #605f46;
        border-collapse: collapse;
        padding: 2px 4px;
        text-align: left;
        vertical-align: center;
 }

/* +++++ Standardtabelle Für Tabelle mit rechter Ausrichtung      +++++ */
/* +++++ Angabe erfolgt so: class = "maddraxikon_std_table right" +++++ */
 table.right {
        float: right;
        margin: 5px 0px 5px 15px;
 }

/* +++++ Standardtabelle Für Tabelle mit mitte Ausrichtung      +++++ */
/* +++++ Angabe erfolgt so: class = "maddraxikon_std_table center" +++++ */
 table.center {
        margin-left: auto;
        margin-right: auto;
 }

/* +++++ Rechter Div-Block der jeden anderen Inhalt verdrängt     +++++ */
/* +++++ Angabe erfolgt so: class = "maddraxikon_std_rframe"       +++++ */
 div.maddraxikon_std_rframe {
        border: 1px solid; 
        border-color: white;
        border-width: 0 0 0 1.4em;
        background-color: #fff; 
        clear: right; 
        float: right; 
 }

/* +++++ Div-Block-Breite für Überblicktabellen                       +++++ */
/* +++++ Angabe erfolgt so: class = "maddraxikon_std_rframe overview"  +++++ */
 div.overview {
        width: 60%;
 }

/* +++++ Div-Block-Breite für Überblicktabellen                       +++++ */
/* +++++ Angabe erfolgt so: class = "maddraxikon_std_rframe astrodata" +++++ */
 div.astrodata {
        width: 40%;
 }

/* +++++ Hintergrundfarbe für Weltraumbilder                          +++++ */
/* +++++ Angabe erfolgt so: class = "astrodata_bg"                    +++++ */
 .astrodata_bg {
        background-color: #000;
 }

/* +++++ SONSTIGE ANPASSUNGEN (Spezialseiten u. a.) +++++ */
 
/* +++++ Markierung von Redirects in [[Special:Allpages]], [[Special:Watchlist]], Kategorien +++++ */
 
 .allpagesredirect {
        font-style: italic;
 }
 
 .watchlistredir {
        font-style: italic;
 }
 
 .redirect-in-category {
        font-style: italic;
 }

 div.BoxenVerschmelzen,
 div.NavFrame {
    margin:  0px;
    padding: 0px;
    border: 1px solid #FFDEAD;
    background-color: #FFDEAD;
    text-align: center;
    border-collapse: collapse;
    font-size: 95%;
    clear:both;
 }
 div.BoxenVerschmelzen div.NavFrame {
    border-style: none;
    border-style: hidden;
 }
 div.NavFrame + div.NavFrame {
    border-top-style: none;
    border-top-style: hidden;
 }
 div.NavPic {
    background-color: #FFDEAD;
    margin: 0px;
    padding: 0px;
    float: left;
 }
 /* Hier kann man einstellen wie die Überschriften der Navigationsleisten in Artikeln aussehen sollen */
 div.NavFrame div.NavHead {
    font-weight: bold;
    font-size: 110%;
    background-color: #FFDEAD;
 }
 div.NavFrame p {
    font-size: 100%;
 }
 div.NavFrame div.NavContent {
    font-size: 100%;
 }
 div.NavFrame div.NavContent p {
    font-size: 100%;
 }
 div.NavEnd {
    margin: 0px;
    padding: 0px;
    line-height: 1px;
    clear: both;
 }
 
/* Stylesheet fuer den 'Ausklappen'-Button an Navileisten, der in [[MediaWiki:Common.js]] implementiert wird */
 .NavToggle {
    font-size: x-small;
    float:right;
 }
 
/* Workaround für Internet Explorer 6 */
 div.NavFrame, div.NavPic, .NavToggle {
    position:relative;
 }
 
 /* Abstand vor Navigationsleisten */
 
 div.BoxenVerschmelzen,
 div.NavFrame {
   margin-top: 1.5em;
 }
 div.BoxenVerschmelzen div.NavFrame {
   margin-top: 0;
 }
 div.NavFrame + div.NavFrame {
   margin-top: 0;
 }

/* Triff die Community */
.random-users-avatars {
        padding: 0px 0px 0px 10px;
}
 
.random-users-avatars h2 {
        border-bottom: none;
        margin: 0px 0px 0px 0px;
        padding: 7px 0px 8px 0px;
}
 
.random-users-avatars img {
        border: 1px solid #DCDCDC;
        display: block;
        float: left;
        height: 50px;
        margin: 0px 8px 8px 0px;
        width: 50px;
}

/* Zeitleiste */
table.tl_table{
         border-width: thin;
         border-spacing: 2px;
         border-style: outset;
         border-color: black;
         border-collapse: separate;
         background-color: white;
         -moz-border-radius: 9px; }
     th.tl_title{
         text-transform: uppercase
         text-align: center;
         border-width: 1px;
         padding: 1px;
         border-style: outset;
         border-color: blue;
         background-color: rgb(243, 248, 252);
         -moz-border-radius: 9px; }
   th.tl_years{
         text-align: center;
         font-style: italic;
         border-width: 1px;
         padding: 1px;
         border-style: outset;
         border-color: blue;
         background-color: rgb(223, 228, 252);
         -moz-border-radius: 4px; }
   th.tl_months{
         text-align: center;
         border-width: 1px;
         padding: 1px;
         border-style: outset;
         border-color: blue;
         background-color: rgb(243, 248, 252);
         -moz-border-radius: 2px; }
   th.tl_days{
         text-align: center;
         border-width: 1px;
         padding: 1px;
         border-style: outset;
         border-color: blue;
         background-color: rgb(243, 248, 252);
         -moz-border-radius: 2px; }
   td.tl_freetime{
         background-color: rgb(187, 210, 236);
         border-width: 1px;
         border-color: black;
         border-style: inset;
         -moz-border-radius: 7px; }
   td.tl_event{
         text-align: center;
         padding: 1px;
         background-color: rgb(61, 114, 194);
         border-width: 1px;
         border-color: white;
         border-style: inset;
         color: white;
         -moz-border-radius: 7px;
         white-space: normal }
   td.tl_foot{
         text-align: center;
         padding: 1px;
         background-color: rgb(243, 248, 252);
         border-width: 1px;
         border-color: blue;
         border-style: ridge;
         color: gray;
         -moz-border-radius: 9px; }
thead.tl_header{}
tbody.tl_body{}
tfoot.tl_footer{}

/* Schnellüberblicksfeld Hauptseite */
.mp-welcome-logged-in {
        margin: 0px 0px 0px 15px;
}
 
.mp-welcome-logged-in h2 {
        font-size: 20px;
        line-height: 24px;
        border-bottom: none;
        padding: 8px 0px 10px 0px !important;
        margin: 0px 0px 0px 0px !important;
}
 
.mp-welcome-info {
        float: left;
        width: 240px;
}
 
.mp-welcome-image {
        float: left;
        margin: 0px 10px 0px 0px;
        text-align: center;
}
 
.mp-welcome-image a {
        font-size: 10px;
        text-decoration: none;
}
 
.mp-welcome-image img {
        background-color: #68211C;
        border: 1px solid #DCDCDC;
        padding: 3px;
}
 
.mp-welcome-points {
        float: left;
        width: 200px;
}
 
.points-and-level {
        margin: 0px 0px 3px;
}
 
.needed-points {
        color: #666666;
        font-size: 10px;
        line-height: 12px;
        padding: 5px 0px 0px;
}
 
.total-points {
        background-color: #CC0000;
        color: #68211C;
        float: left;
        font-size: 12px;
        font-weight: bold;
        margin: 0px 5px 0px 0px;
        padding: 1px 5px;
        text-align: center;
}
 
.honorific-level {
        float: left;
}

/*** font class für 'hellklick' in Balkennavigation ***/
 
.hellklick a, .hellklick a:visited { 
     text-decoration: underline; color: #fefefe !important;
}
.hellklick a:hover, .hellklick a:active { 
     color: #9ad9ff !important;
}
 
/*** font class für 'hellklick2' in Tutorial ***/
 
.hellklick2 a, .hellklick2 a:visited { 
     text-decoration: none; color: #fefefe !important;
}
.hellklick2 a:hover, .hellklick2 a:active { 
     color: #9ad9ff !important; text-decoration: underline;
}
 
.whitelink a {
 color: white !important;
 text-decoration: none;
}
 
.whitelink a:hover {
 color: white !important;
}
 
.yellowlink a {
 color: yellow !important;
 text-decoration: none;
}
 
.yellowlink a:hover {
 color: yellow !important;
}
 
/* Ausklappen per Mausklick (s.a. [[MediaWiki:Common.js]]  */
 
 .klapp {
      cursor: pointer;
 }
 span.klapp {
      text-decoration: none;
      color: #002bb8;
      background: none;
      }
 
 span.klapp:hover {
      text-decoration: underline;
      }
 
 /* Drag & Drop */
 .jstest{
      position:relative;
      cursor:move;
      z-index: 100;
      padding:20px 45px 20px 0px;
      border-width:1px;
      }