MediaWiki:Common.css: Difference between revisions

Latest revision as of 13:32, 21 July 2026

/* ==== Profilkarte ==== */
.pw-profil { background:#fff; border:1px solid #dadde1; border-radius:12px; overflow:hidden; margin-bottom:16px; }
.pw-cover { height:90px; background:linear-gradient(90deg,#1b4b7a,#2d7fc4); }
.pw-kopf { padding:0 20px 20px; }
.pw-avatar-zeile { display:flex; align-items:flex-end; gap:14px; margin-top:-38px; }
.pw-avatar img, .pw-avatar-leer {
	width:80px; height:80px; border-radius:50%; border:4px solid #fff;
	object-fit:cover; background:#e7f0f8; display:flex; align-items:center;
	justify-content:center; font-size:26px; color:#1b4b7a;
}
.pw-name { font-size:22px; font-weight:600; line-height:1.2; }
.pw-sub { font-size:13px; color:#65676b; }
.pw-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.pw-chip { font-size:12px; padding:5px 12px; border-radius:999px; background:#e7f0f8; color:#1b4b7a; }
.pw-bio { margin-top:14px; font-size:15px; line-height:1.7; }

/* ==== Feed-Posts ==== */
.pw-post { background:#fff; border:1px solid #dadde1; border-radius:12px; padding:16px 20px; margin-bottom:16px; }
.pw-post-kopf { font-size:15px; font-weight:600; }
.pw-post-meta { font-size:12px; color:#65676b; }
.pw-video { margin-top:12px; }
.pw-post video, .pw-post iframe { width:100%; max-width:560px; border-radius:8px; }

/* ==== Buttons ==== */
.pw-cta {
	display:inline-block; padding:10px 18px; border-radius:8px;
	background:#1b4b7a; color:#fff !important; font-weight:600;
	text-decoration:none; margin:4px 8px 4px 0;
}

/* ==== Athletenverzeichnis (Kacheln) ==== */
.pw-grid { display:flex; flex-wrap:wrap; gap:16px; margin:16px 0; }
.pw-card { width:190px; border:1px solid #dadde1; border-radius:12px; overflow:hidden; background:#fff; }
.pw-card:hover { border-color:#2d7fc4; }
.pw-card-cover { height:54px; background:linear-gradient(90deg,#1b4b7a,#2d7fc4); }
.pw-card-av {
	width:54px; height:54px; border-radius:50%; border:3px solid #fff;
	margin:-27px auto 0; background:#e7f0f8; display:flex; align-items:center;
	justify-content:center; font-size:17px; color:#1b4b7a; overflow:hidden;
}
.pw-card-av img { width:100%; height:100%; object-fit:cover; }
.pw-card-body { padding:8px 12px 14px; text-align:center; }
.pw-card-name { font-weight:600; }
.pw-card-name a { color:#1b4b7a; text-decoration:none; }
.pw-card-name a:hover { text-decoration:underline; }
.pw-card-meta { font-size:12px; color:#65676b; }

/* ==== Formulare (PageForms) ==== */
.formtable { width:100%; max-width:560px; border:none; border-collapse:separate; border-spacing:0 6px; }
.formtable th { display:block; text-align:left; font-size:14px; font-weight:600; color:#444; padding:10px 0 4px; border:none; background:none; }
.formtable td { display:block; padding:0; border:none; }
.formtable input[type="text"], .formtable input[type="number"], .formtable input[type="date"],
.formtable textarea, .formtable select {
	width:100%; box-sizing:border-box; padding:12px 14px; font-size:16px;
	border:1px solid #ccd0d5; border-radius:10px; background:#f5f6f7;
}
.formtable input:focus, .formtable textarea:focus, .formtable select:focus {
	outline:none; border-color:#2d7fc4; background:#fff;
	box-shadow:0 0 0 2px rgba(45,127,196,.25);
}
.formtable .oo-ui-inputWidget, .formtable .oo-ui-comboBoxInputWidget { max-width:100% !important; width:100% !important; }
.formtable .mw-ui-button, .formtable button, .formtable a.button {
	display:inline-block; width:auto; padding:8px 16px; font-size:14px;
	border-radius:8px; background:#e7f0f8; color:#1b4b7a; border:1px solid #cfe0ef;
}
form.createbox input[type="submit"], .formtable input[name="wpSave"] {
	background:#1b4b7a; color:#fff; border:none; border-radius:10px;
	padding:14px 22px; font-size:16px; font-weight:600;
}

/* ==== Mobil ==== */
@media (max-width:640px) {
	.pw-avatar-zeile { flex-direction:column; align-items:flex-start; }
	.pw-name { font-size:19px; }
	.pw-card { width:calc(50% - 8px); }
	.formtable { max-width:100%; }
	.formtable textarea { min-height:120px; }
}

/* ==== Upload-Dialog (Profilfoto) mobil ==== */
#mw-upload-form fieldset { border:1px solid #dadde1; border-radius:10px; padding:12px; margin:0 0 14px; }
#mw-upload-form legend { font-weight:600; font-size:14px; padding:0 6px; }
#mw-upload-form td, #mw-upload-form th { display:block; text-align:left; padding:4px 0; }
#mw-upload-form input[type="text"], #mw-upload-form textarea, #mw-upload-form select {
	width:100%; box-sizing:border-box; font-size:16px; padding:10px 12px;
	border:1px solid #ccd0d5; border-radius:8px; background:#f5f6f7;
}
#mw-upload-form input[type="submit"] {
	background:#1b4b7a; color:#fff; border:none; border-radius:10px;
	padding:12px 20px; font-size:16px; font-weight:600;
}
/* Nebensaechliches ausblenden: Zusammenfassung + Optionen */
#mw-upload-form .mw-htmlform-field-HTMLTextAreaField,
#mw-upload-form .mw-htmlform-field-HTMLCheckField { display:none; }

/* ==== Upload-Popup: nie breiter als der Bildschirm ==== */
#mw-upload-form { max-width:100%; box-sizing:border-box; }
#mw-upload-form fieldset { max-width:100%; box-sizing:border-box; overflow:hidden; }
#mw-upload-form table { width:100%; max-width:100%; table-layout:fixed; }
#mw-upload-form td, #mw-upload-form th { word-wrap:break-word; overflow-wrap:break-word; }
#mw-upload-form input[type="file"] { max-width:100%; font-size:14px; }
/* Popup-Container (PageForms) auf Viewport begrenzen */
.pfUploadWindow, #fancybox-wrap, #fancybox-outer, #fancybox-content, #fancybox-frame {
	max-width:100vw !important; box-sizing:border-box !important;
}
@media (max-width:640px) {
	#fancybox-wrap { left:0 !important; width:100vw !important; }
	#fancybox-frame { width:100% !important; }
}