MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 128: / Line 128: @@
 .home-section-intro {
-	margin: 0 0 20px 0;
+	margin: 0 0 28px 0;
 	font-size: 1.25em;
 	line-height: 1.65;
@@ Line 200: / Line 200: @@
 	width: 100%;
 	align-items: start;
-	margin-bottom: 8px;
+	margin-bottom: 12px;
 }
 .grid-four .grid-item {
-	display: grid;
+	display: flex;
-	grid-template-rows: 72px auto 1fr;
+	flex-direction: column;
-	align-items: start;
+	align-items: stretch;
 	min-width: 0;
 }
@@ Line 215: / Line 215: @@
 	line-height: 1.1;
 	text-align: left;
-	margin: 0 0 2px 0;
+	margin: 0 0 6px 0;
-	height: 72px;
+	min-height: 2.2em;
-	display: flex;
+	max-height: 2.2em;
-	align-items: flex-start;
+	overflow: hidden;
-	min-width: 0;
 	overflow-wrap: anywhere;
+	word-break: normal;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
 }
@@ Line 227: / Line 230: @@
 	width: 100%;
 	height: auto;
-	margin: 0 auto;
+	margin: 0;
 	border: 1px solid #777;
 }
 .grid-four .grid-text {
-	margin-top: 10px;
+	margin-top: 12px;
 	font-size: 1.1em;
-	line-height: 1.55;
+	line-height: 1.6;
 	text-align: left;
-	min-width: 0;
 	overflow-wrap: anywhere;
 }
@@ Line 244: / Line 246: @@
 		grid-template-columns: repeat(2, minmax(0, 1fr));
 		gap: 20px;
-	}
-	.grid-four .grid-item {
-		grid-template-rows: 64px auto 1fr;
 	}
 	.grid-four .grid-title {
 		font-size: 24px;
-		height: 64px;
+		min-height: 2.2em;
-		margin: 0 0 6px 0;
+		max-height: 2.2em;
 	}
 }
@@ Line 269: / Line 267: @@
 .grid-three .grid-item {
-	display: grid;
+	display: flex;
-	grid-template-rows: 82px auto 1fr;
+	flex-direction: column;
-	align-items: start;
+	align-items: stretch;
 	min-width: 0;
 }
 .grid-three .grid-title {
-	height: 82px;
+	font-weight: bold;
-	display: flex;
+	font-size: 26px;
-	align-items: flex-start;
-	font-size: 30px;
 	line-height: 1.1;
 	text-align: left;
-	margin: 0 0 10px 0;
+	margin: 0 0 6px 0;
+	min-height: 2.2em;
+	max-height: 2.2em;
+	overflow: hidden;
 	overflow-wrap: anywhere;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+}
+.grid-three .grid-item img {
+	display: block;
+	width: 100%;
+	height: auto;
+	margin: 0;
+	border: 1px solid #777;
 }
 .grid-three .grid-text {
-	font-size: 1.1em;
+	margin-top: 12px;
+	font-size: 1.08em;
 	line-height: 1.6;
 	text-align: left;
@@ Line 296: / Line 307: @@
 		grid-template-columns: repeat(2, minmax(0, 1fr));
 		gap: 20px;
-	}
-	.grid-three .grid-item {
-		grid-template-rows: 74px auto 1fr;
 	}
 	.grid-three .grid-title {
-		height: 74px;
+		font-size: 24px;
-		font-size: 27px;
 	}
 }