From 6b7baceb7d58e487b9d9a06569c6a809a8b9b121 Mon Sep 17 00:00:00 2001
From: Elias Showk <eshowk@entrouvert.com>
Date: Tue, 22 May 2018 10:22:53 +0200
Subject: [PATCH] cells : avoid list of forms overlapping contents (#23977)

---
 static/includes/_cells.scss | 42 ++++++++++++++++++++++++++++++-------
 1 file changed, 34 insertions(+), 8 deletions(-)

diff --git a/static/includes/_cells.scss b/static/includes/_cells.scss
index f6a50b9..085473b 100644
--- a/static/includes/_cells.scss
+++ b/static/includes/_cells.scss
@@ -125,8 +125,23 @@ div.wcscurrentformscell ul {
 	z-index: 0;
 
 	& > li > a {
+		display: -webkit-box;
+	  display: -moz-box;
+	  display: -ms-flexbox;
+	  display: -webkit-flex;
+	  display: flex;
+	  -webkit-justify-content: space-around;
+	  -moz-justify-content: space-around;
+	  -ms-justify-content: space-around;
+	  justify-content: space-around;
+	  -ms-flex-pack: space-around;
+	  -webkit-flex-wrap: wrap;
+	  -moz-flex-wrap: wrap;
+	  -ms-flex-wrap: wrap;
+	  -o-flex-wrap: wrap;
+	  flex-wrap: wrap;
+
 		padding: 1rem;
-		display: block;
 		color: $cell-entry-color;
 		border-bottom: 1px solid $cell-entry-border-color;
 		position: relative;
@@ -206,13 +221,24 @@ div.wcscurrentformscell ul {
 }
 
 div.list-of-forms {
-	span.form-number {
-		opacity: 0.3;
-		font-size: 80%;
-	}
-	span.form-status {
-		position: absolute;
-		right: 1ex;
+	span {
+		margin-right: 0.5rem;
+
+		&.form-status {
+			margin-right: 0;
+			margin-left: auto;
+		}
+
+		&.form-number {
+			-webkit-flex-grow: 1;
+			-moz-flex-grow: 1;
+			-ms-flex-grow: 1;
+			-o-flex-grow: 1;
+			flex-grow: 1;
+
+			opacity: 0.3;
+			font-size: 80%;
+		}
 	}
 }
 
-- 
2.17.0