From: Bartosz Dziewoński <matma.rex@gmail.com>
Date: Wed, 30 Jan 2019 23:54:42 +0000 (-0800)
Subject: mw.widgets: Use CSS grid for the calendar in supporting browsers
X-Git-Tag: 1.34.0-rc.0~2844^2
X-Git-Url: http://git.cyclocoop.org/%22.%20generer_url_ecrire%28%22sites%22%2C%22%22%29.%20%22?a=commitdiff_plain;h=377dcabeaadc62b03d596f98c76de0a213a7cdf1;p=lhc%2Fweb%2Fwiklou.git

mw.widgets: Use CSS grid for the calendar in supporting browsers

Bug: T214997
Change-Id: I05dca01585f3de86580e7ae94ceeae1716f56ba3
---

diff --git a/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.less b/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.less
index 253784e8f5..7932f735c6 100644
--- a/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.less
+++ b/resources/src/mediawiki.widgets/mw.widgets.CalendarWidget.less
@@ -63,6 +63,7 @@
 .mw-widget-calendarWidget-body-wrapper {
 	.mw-widget-calendarWidget-body {
 		display: inline-block;
+		display: inline-grid;
 		// Fit 7 days, 3em each
 		width: @calendarWidth;
 		// Fit 6 weeks + heading line, 2em each
@@ -108,6 +109,7 @@
 
 	.mw-widget-calendarWidget-body {
 		display: block;
+		display: grid;
 	}
 
 	.mw-widget-calendarWidget-body:first-child {
@@ -123,6 +125,7 @@
 
 	.mw-widget-calendarWidget-body {
 		display: block;
+		display: grid;
 	}
 
 	.mw-widget-calendarWidget-body:first-child {
@@ -132,6 +135,20 @@
 	}
 }
 
+// Support: Browsers that render CSS Grid. All others ignore unknown `grid-*` properties.
+// This avoids any calculation issues pushing items to next line.
+.mw-widget-calendarWidget-body-month {
+	grid-template-columns: auto auto auto auto auto auto auto;
+}
+
+.mw-widget-calendarWidget-body-year {
+	grid-template-columns: auto auto;
+}
+
+.mw-widget-calendarWidget-body-duodecade {
+	grid-template-columns: auto auto auto auto auto;
+}
+
 .mw-widget-calendarWidget-day,
 .mw-widget-calendarWidget-day-heading,
 .mw-widget-calendarWidget-month,