MediaWiki:Common.css: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 1: | Zeile 1: | ||
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | ||
/* | /* Dunkles Hintergrunddesign */ | ||
body { | body { | ||
background-color: # | background-color: #121212; /* Sehr dunkles Grau für den Hintergrund */ | ||
font-family: ' | color: #e0e0e0; /* Helles Grau für den Text */ | ||
font-family: 'Roboto', sans-serif; /* Roboto als moderne Schriftart */ | |||
} | } | ||
/* Hauptüberschriften */ | /* Veränderte Hauptüberschriften */ | ||
h1, h2, h3 { | h1, h2, h3 { | ||
font-family: 'Minecraft', sans-serif; /* | font-family: 'Minecraft', 'Arial', sans-serif; /* Minecraft-ähnliche Schrift für Überschriften */ | ||
color: # | color: #FF6347; /* Tomatenrot für Überschriften */ | ||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); /* Schatten für besseren Kontrast */ | |||
} | } | ||
| Zeile 15: | Zeile 17: | ||
#p-navigation a { | #p-navigation a { | ||
color: #00BFFF; /* Helles Blau für Links */ | color: #00BFFF; /* Helles Blau für Links */ | ||
text-decoration: none; | |||
} | |||
#p-navigation a:hover { | |||
background-color: #444444; /* Hintergrund für Hover-Effekte */ | |||
} | } | ||
/* Header anpassen */ | /* Header-Bereich anpassen */ | ||
#p-logo a { | #p-logo a { | ||
background-image: url('https://tcjb.de.cool/img/www/150.png'); /* Dein Logo */ | background-image: url('https://tcjb.de.cool/img/www/150.png'); /* Dein Logo */ | ||
| Zeile 28: | Zeile 35: | ||
/* Sidebar anpassen */ | /* Sidebar anpassen */ | ||
#p-navigation { | #p-navigation { | ||
background-color: # | background-color: #1c1c1c; /* Dunkler Hintergrund für Sidebar */ | ||
padding: 10px; | padding: 15px; | ||
border-radius: 10px; /* Abgerundete Ecken für Sidebar */ | |||
} | } | ||
#p-navigation a { | #p-navigation a { | ||
color: # | color: #ffffff; /* Weiße Schrift für Links */ | ||
text-decoration: none; | text-decoration: none; | ||
} | } | ||
#p-navigation a:hover { | #p-navigation a:hover { | ||
background-color: #555555; | background-color: #555555; /* Dunklerer Hover-Effekt */ | ||
} | } | ||
/* Footer anpassen */ | /* Footer anpassen */ | ||
#footer { | #footer { | ||
background-color: # | background-color: #1c1c1c; | ||
color: white; | color: white; | ||
text-align: center; | text-align: center; | ||
padding: | padding: 20px 0; | ||
border-top: 3px solid #FF6347; /* Roter Rand oben im Footer */ | |||
} | } | ||
/* | /* Buttons (z.B. für Links oder Aktionen) */ | ||
button, .mw-ui-button { | |||
background-color: #FF6347; /* Roter Hintergrund für Buttons */ | |||
color: white; | |||
border: none; | |||
padding: 10px 20px; | |||
border-radius: 5px; | |||
} | |||
button:hover, .mw-ui-button:hover { | |||
background-color: #FF4500; /* Dunkleres Rot bei Hover */ | |||
} | |||
/* Responsives Design für mobile Geräte */ | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
#p-logo a { | #p-logo a { | ||
| Zeile 57: | Zeile 79: | ||
#p-navigation { | #p-navigation { | ||
padding: | padding: 10px; | ||
} | |||
/* Sidebar für kleine Geräte anpassen */ | |||
#p-navigation { | |||
font-size: 14px; | |||
} | } | ||
} | |||
.freeman-regular { | |||
font-family: "Freeman", serif; | |||
font-weight: 400; | |||
font-style: normal; | |||
} | } | ||
Version vom 10. Januar 2025, 23:17 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
/* Dunkles Hintergrunddesign */
body {
background-color: #121212; /* Sehr dunkles Grau für den Hintergrund */
color: #e0e0e0; /* Helles Grau für den Text */
font-family: 'Roboto', sans-serif; /* Roboto als moderne Schriftart */
}
/* Veränderte Hauptüberschriften */
h1, h2, h3 {
font-family: 'Minecraft', 'Arial', sans-serif; /* Minecraft-ähnliche Schrift für Überschriften */
color: #FF6347; /* Tomatenrot für Überschriften */
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); /* Schatten für besseren Kontrast */
}
/* Links in der Sidebar */
#p-navigation a {
color: #00BFFF; /* Helles Blau für Links */
text-decoration: none;
}
#p-navigation a:hover {
background-color: #444444; /* Hintergrund für Hover-Effekte */
}
/* Header-Bereich anpassen */
#p-logo a {
background-image: url('https://tcjb.de.cool/img/www/150.png'); /* Dein Logo */
background-size: contain;
height: 100px;
width: 300px;
display: block;
}
/* Sidebar anpassen */
#p-navigation {
background-color: #1c1c1c; /* Dunkler Hintergrund für Sidebar */
padding: 15px;
border-radius: 10px; /* Abgerundete Ecken für Sidebar */
}
#p-navigation a {
color: #ffffff; /* Weiße Schrift für Links */
text-decoration: none;
}
#p-navigation a:hover {
background-color: #555555; /* Dunklerer Hover-Effekt */
}
/* Footer anpassen */
#footer {
background-color: #1c1c1c;
color: white;
text-align: center;
padding: 20px 0;
border-top: 3px solid #FF6347; /* Roter Rand oben im Footer */
}
/* Buttons (z.B. für Links oder Aktionen) */
button, .mw-ui-button {
background-color: #FF6347; /* Roter Hintergrund für Buttons */
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
}
button:hover, .mw-ui-button:hover {
background-color: #FF4500; /* Dunkleres Rot bei Hover */
}
/* Responsives Design für mobile Geräte */
@media (max-width: 768px) {
#p-logo a {
height: 80px;
width: 200px;
}
#p-navigation {
padding: 10px;
}
/* Sidebar für kleine Geräte anpassen */
#p-navigation {
font-size: 14px;
}
}
.freeman-regular {
font-family: "Freeman", serif;
font-weight: 400;
font-style: normal;
}