Merge pull request #71 from JeroenVdb/use-flexbox

Use flexbox to layout months
year-calendar · Aug 22, 2021 · ada2107 · ada2107
2 parents 691804c + 392e14a
commit ada2107
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/src/less/js-year-calendar.less b/src/less/js-year-calendar.less
@@ -123,11 +123,11 @@
 	.months-container {
 		width:100%;
 		display:none;
+		flex-wrap: wrap;
 
 		.month-container {
 			float: left;
 			text-align:center;
-			height:200px;
 			padding:0;
 
 			&.month-2 {

diff --git a/src/ts/js-year-calendar.ts b/src/ts/js-year-calendar.ts
@@ -341,7 +341,7 @@ export default class Calendar<T extends CalendarDataSourceElement> {
 			// Fade animation
 			var months = this.element.querySelector('.months-container') as HTMLElement;
 			months.style.opacity = '0';
-			months.style.display = 'block';
+			months.style.display = 'flex';
 			months.style.transition = 'opacity 0.5s';
 			setTimeout(() => {
 				months.style.opacity = '1';