MediaWiki:Common.css - Revision history

Ivans at 11:17, 24 November 2025

2025-11-24T11:17:50Z

← Older revision		Revision as of 13:17, 24 November 2025
Line 352:		Line 352:


	~~/* === Replace the old flex-based row rules with this GRID version === */~~
	.dw-card .dw-row {		.dw-card .dw-row {
	display: grid;		display: grid;
	grid-template-columns: auto minmax(0, 1fr); ~~/* 1: icon, 2: flexible text */~~		grid-template-columns: auto minmax(0, 1fr);
	column-gap: 12px;		column-gap: 12px;
	align-items: flex-start;		align-items: flex-start;
Line 363:		Line 362:
	}		}

	/* Icon column~~: always in column 1~~ */		/* Icon column */
	.dw-card .dw-row > .dw-icon {		.dw-card .dw-row .dw-icon {
	grid-column: 1;		grid-column: 1;
	}		}

	/* Text column~~: everything that is NOT the icon goes in column 2~~ */		/* Text column */
	.dw-card .dw-row ~~> :not(~~.dw-~~icon)~~ {		.dw-card .dw-row .dw-content {
	grid-column: 2;		grid-column: 2;
	}		}

	~~/* Icon image */~~
	.dw-card .dw-icon img {		.dw-card .dw-icon img {
	height: auto;		height: auto;
	max-width: 160px; ~~/* keep this */~~		max-width: 160px;
	}		}


	/* Headline */		/* Headline */

2025-11-24T11:05:41Z

← Older revision		Revision as of 13:05, 24 November 2025
Line 352:		Line 352:


			/* === Replace the old flex-based row rules with this GRID version === */
	.dw-card .dw-row {		.dw-card .dw-row {
	display: ~~flex~~;		display: grid;
	~~flex~~-~~wrap~~: ~~wrap~~;		grid-template-columns: auto minmax(0, 1fr); /* 1: icon, 2: flexible text */
			column-gap: 12px;
	align-items: flex-start;		align-items: flex-start;
	~~gap: 12px;~~
	width: 100%;		width: 100%;
	box-sizing: border-box;		box-sizing: border-box;
	padding: 14px; ~~/* ✅ move the spacing here instead of .dw-card */~~		padding: 14px;
	}		}

	.dw-card .dw-row > ~~div:last~~-~~child~~ {		/* Icon column: always in column 1 */
	~~flex~~: 1;		.dw-card .dw-row > .dw-icon {
	~~min-width: 0; /* ✅ prevents overflow due to long text/links */~~		grid-column: 1;
	}		}

			/* Text column: everything that is NOT the icon goes in column 2 */
			.dw-card .dw-row > :not(.dw-icon) {
			grid-column: 2;
			}

			/* Icon image */
			.dw-card .dw-icon img {
			height: auto;
			max-width: 160px; /* keep this */
			}

	~~.dw-card .dw-icon img { height: auto; }~~		/* Headline */
	.dw-card .dw-headline {		.dw-card .dw-headline {
	display: block;		display: block;
Line 376:		Line 386:
	margin: 0px 0 0px;		margin: 0px 0 0px;
	}		}
	.dw-card .dw-body { line-height: 1.6; width: 100%;}
	.dw-card .dw-body--spacious { line-height: 1.8; }		/* Body text (your existing rules) */
			.dw-card .dw-body {
			line-height: 1.6;
			width: 100%;
			}
			.dw-card .dw-body--spacious {
			line-height: 1.8;
			}

2025-11-24T10:54:51Z

← Older revision		Revision as of 12:54, 24 November 2025
Line 362:		Line 362:
	}		}

	~~/* everything that is NOT the icon becomes the flexible text column */~~		.dw-card .dw-row > div:last-child {
	.dw-card .dw-row > :~~not(.dw~~-~~icon)~~ {		flex: 1;
	flex: 1 ~~1 auto~~;		min-width: 0; /* ✅ prevents overflow due to long text/links */
	min-width: 0;
	}		}

2025-11-24T10:52:55Z

← Older revision		Revision as of 12:52, 24 November 2025
Line 362:		Line 362:
	}		}

	.dw-card .dw-row > ~~div~~:~~last~~-~~child~~ {		/* everything that is NOT the icon becomes the flexible text column */
	flex: 1;		.dw-card .dw-row > :not(.dw-icon) {
	min-width: 0; ~~/* ✅ prevents overflow due to long text/links */~~		flex: 1 1 auto;
			min-width: 0;
	}		}


	.dw-card .dw-icon img { height: auto; }		.dw-card .dw-icon img { height: auto; }

2025-11-20T19:15:46Z

← Older revision		Revision as of 21:15, 20 November 2025
Line 159:		Line 159:

	/* Hover effect */		/* Hover effect */
	.wikitable.custom-table td:hover {		.wikitable.custom-table tr:hover td {
	~~box~~-~~shadow: 0px 5px 10px~~ rgba(0, 0, 0, 0.8)~~!important~~;		background: #FFF;
			background: linear-gradient(0deg,rgba(0, 0, 255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 255, 1) 100%);
	}		}

	~~.wikitable.custom-table tr:nth-child(even) td:hover {~~
	~~box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;~~
	}

	/* Rounded corners for first & last rows */		/* Rounded corners for first & last rows */

2025-11-20T19:15:07Z

← Older revision		Revision as of 21:15, 20 November 2025
Line 160:		Line 160:
	/* Hover effect */		/* Hover effect */
	.wikitable.custom-table td:hover {		.wikitable.custom-table td:hover {
			box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;
			}

			.wikitable.custom-table tr:nth-child(even) td:hover {
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;		box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;
	}		}

2025-11-20T19:14:23Z

← Older revision		Revision as of 21:14, 20 November 2025
Line 159:		Line 159:

	/* Hover effect */		/* Hover effect */
	.wikitable.custom-table tr:hover td {		.wikitable.custom-table td:hover {
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;		box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;
	}		}

2025-11-20T19:13:30Z

← Older revision		Revision as of 21:13, 20 November 2025
Line 160:		Line 160:
	/* Hover effect */		/* Hover effect */
	.wikitable.custom-table tr:hover td {		.wikitable.custom-table tr:hover td {
	~~background: #FFF;~~
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;		box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;
	}		}

2025-11-20T19:12:02Z

← Older revision		Revision as of 21:12, 20 November 2025
Line 161:		Line 161:
	.wikitable.custom-table tr:hover td {		.wikitable.custom-table tr:hover td {
	background: #FFF;		background: #FFF;
	~~background~~: ~~linear-gradient(0deg,~~rgba(0, 0, ~~255, 1) 0%, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 1) 85%, rgba(~~0, 0~~, 255, 1) 100%~~);		box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.8)!important;
	}		}

2025-11-20T14:50:30Z