MediaWiki:Common.css: Unterschied zwischen den Versionen
MediaWiki-Schnittstellenseite
Weitere Optionen
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| (38 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 7: | Zeile 7: | ||
/* Banner-Container */ | /* Banner-Container */ | ||
.hover-banner { | .hover-banner { | ||
background-color: # | background-color: #242424B3; /* HEX + Alpha (70% Deckkraft) */ | ||
background-size: cover; | background-size: cover; | ||
background-position: center; | background-position: center; | ||
padding: 30px | padding: 20px 30px; | ||
border-radius: 20px; | border-radius: 20px; | ||
text-align: center; | text-align: center; | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
/* Gesamte Box */ | |||
.box-with-title { | |||
border: 2px solid #555; | |||
border-radius: 10px; | |||
width: 300px; | |||
overflow: hidden; | |||
} | |||
/* Titelbereich */ | |||
.box-with-title .box-title { | |||
background: #333; | |||
color: white; | |||
padding: 8px; | |||
font-weight: bold; | |||
} | |||
/* Inhalt */ | |||
.box-with-title .box-content { | |||
background: #fafafa; | |||
padding: 10px; | |||
} | |||
/* Jedes Wort im Banner */ | /* Jedes Wort im Banner */ | ||
.hover-banner-word { | .hover-banner-word { | ||
font-size: | font-size: 25px; /* Schriftgröße */ | ||
color: white; /* Standardfarbe */ | color: white; /* Standardfarbe */ | ||
text-align: center; | text-align: center; | ||
text-shadow: 2px 2px 5px #000; /* Schatten für Lesbarkeit */ | text-shadow: 2px 2px 5px #000; /* Schatten für Lesbarkeit */ | ||
transition: color 0.3s ease; /* sanfte Farbänderung */ | transition: color 0.3s ease; /* sanfte Farbänderung */ | ||
} | } | ||
| Zeile 44: | Zeile 66: | ||
border-radius: 20px; /* abgerundete Ecken */ | border-radius: 20px; /* abgerundete Ecken */ | ||
padding: 40px 0; /* vertikaler Abstand */ | padding: 40px 0; /* vertikaler Abstand */ | ||
display: block; | display: block; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
.nav- | .nav-bar { | ||
display: flex; | display: flex; | ||
justify-content: space-between; | justify-content: space-between; | ||
align-items: center; | align-items: center; | ||
width: 100%; | |||
background-color: #242424; | background-color: #242424; | ||
border-radius: 20px; | border-radius: 20px; | ||
padding: 15px | padding: 15px 50px; | ||
box-sizing: border-box; | |||
} | } | ||
| Zeile 66: | Zeile 86: | ||
} | } | ||
.nav- | .nav-center { | ||
position: absolute; | |||
left: 50%; | |||
transform: translateX(-50%); | |||
} | |||
.nav-center img { | |||
height: 45px; | |||
} | |||
.nav-bar a { | |||
color: white; | color: white; | ||
font-weight: bold; | font-weight: bold; | ||
| Zeile 74: | Zeile 104: | ||
} | } | ||
. | |||
position: absolute; | .inline-button-row { display:flex; flex-wrap:wrap; gap:10px; } | ||
left: | |||
transform: | .inline-button-card { | ||
display:inline-block; | |||
width:180px; | |||
height:80px; | |||
border-radius:12px; | |||
overflow:hidden; | |||
position:relative; | |||
text-decoration:none; | |||
color:#fff; | |||
background-size:cover; | |||
background-position:center; | |||
transition:transform .26s ease, box-shadow .26s ease; | |||
} | |||
/* Overlay und Text */ | |||
.inline-button-card::after { | |||
content:""; | |||
position:absolute; | |||
inset:0; | |||
background:rgba(0,0,0,0.28); | |||
transition:background .26s ease; | |||
z-index:1; | |||
} | |||
.inline-button-card .ibc-text { | |||
position:absolute; | |||
bottom:8px; | |||
left:12px; | |||
right:12px; | |||
z-index:2; | |||
font-weight:600; | |||
text-shadow:0 1px 3px rgba(0,0,0,0.8); | |||
font-size:15px; | |||
} | |||
/* Hover */ | |||
.inline-button-card:hover { | |||
transform:scale(1.05); | |||
box-shadow:0 6px 18px rgba(0,0,0,0.45); | |||
} | |||
.inline-button-card:hover::after { | |||
background:rgba(0,0,0,0.48); | |||
} | |||
a.new { | |||
color: #BD4242; | |||
} | |||
a.new:hover { | |||
color: #F44D48; | |||
text-decoration: underline; | |||
} | |||
a.mw-selflink, | |||
a:not(.external):not(.new) { | |||
color: #8E9193; | |||
} | |||
a.mw-selflink, | |||
a:not(.external):not(.new):hover { | |||
color: #494B4C; | |||
} | |||
/* Hover */ | |||
a:hover { | |||
color: #494B4C; | |||
text-decoration: underline; | |||
} | |||
.archiv-scroll { | |||
padding:10px; | |||
background:#3E332F; | |||
border: 2px solid #6E5B54; | |||
border-radius: 10px; | |||
} | } | ||
Aktuelle Version vom 22. Dezember 2025, 21:01 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
#ca-talk, #ca-addsection { display: none !important; }
#footer-places-about,
#footer-places-disclaimer { display: none !important; }
/* Banner-Container */
.hover-banner {
background-color: #242424B3; /* HEX + Alpha (70% Deckkraft) */
background-size: cover;
background-position: center;
padding: 20px 30px;
border-radius: 20px;
text-align: center;
display: inline-block;
}
/* Gesamte Box */
.box-with-title {
border: 2px solid #555;
border-radius: 10px;
width: 300px;
overflow: hidden;
}
/* Titelbereich */
.box-with-title .box-title {
background: #333;
color: white;
padding: 8px;
font-weight: bold;
}
/* Inhalt */
.box-with-title .box-content {
background: #fafafa;
padding: 10px;
}
/* Jedes Wort im Banner */
.hover-banner-word {
font-size: 25px; /* Schriftgröße */
color: white; /* Standardfarbe */
text-align: center;
text-shadow: 2px 2px 5px #000; /* Schatten für Lesbarkeit */
transition: color 0.3s ease; /* sanfte Farbänderung */
}
/* Hover-Farbe für jedes Wort */
.hover-banner-word:hover {
color: #FFD700; /* Goldene Farbe beim Hover */
cursor: pointer; /* Zeigt Mauszeiger an */
}
/* Der gesamte Banner */
.fullwidth-banner {
width: 100%; /* über gesamte Seitenbreite */
background-color: #242424;
background-size: cover; /* füllt den gesamten Bereich */
background-position: center;
justify-content: center;
border-radius: 20px; /* abgerundete Ecken */
padding: 40px 0; /* vertikaler Abstand */
display: block;
box-sizing: border-box;
}
.nav-bar {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
background-color: #242424;
border-radius: 20px;
padding: 15px 50px;
box-sizing: border-box;
}
.nav-left, .nav-right {
display: flex;
gap: 30px;
}
.nav-center {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.nav-center img {
height: 45px;
}
.nav-bar a {
color: white;
font-weight: bold;
text-decoration: none;
font-size: 18px;
text-shadow: 1px 1px 2px black;
}
.inline-button-row { display:flex; flex-wrap:wrap; gap:10px; }
.inline-button-card {
display:inline-block;
width:180px;
height:80px;
border-radius:12px;
overflow:hidden;
position:relative;
text-decoration:none;
color:#fff;
background-size:cover;
background-position:center;
transition:transform .26s ease, box-shadow .26s ease;
}
/* Overlay und Text */
.inline-button-card::after {
content:"";
position:absolute;
inset:0;
background:rgba(0,0,0,0.28);
transition:background .26s ease;
z-index:1;
}
.inline-button-card .ibc-text {
position:absolute;
bottom:8px;
left:12px;
right:12px;
z-index:2;
font-weight:600;
text-shadow:0 1px 3px rgba(0,0,0,0.8);
font-size:15px;
}
/* Hover */
.inline-button-card:hover {
transform:scale(1.05);
box-shadow:0 6px 18px rgba(0,0,0,0.45);
}
.inline-button-card:hover::after {
background:rgba(0,0,0,0.48);
}
a.new {
color: #BD4242;
}
a.new:hover {
color: #F44D48;
text-decoration: underline;
}
a.mw-selflink,
a:not(.external):not(.new) {
color: #8E9193;
}
a.mw-selflink,
a:not(.external):not(.new):hover {
color: #494B4C;
}
/* Hover */
a:hover {
color: #494B4C;
text-decoration: underline;
}
.archiv-scroll {
padding:10px;
background:#3E332F;
border: 2px solid #6E5B54;
border-radius: 10px;
}