From 605131f123f41f21b74148542b92d160e436896f Mon Sep 17 00:00:00 2001
From: Peder Bergebakken Sundt <pbsds@hotmail.com>
Date: Thu, 16 Nov 2017 21:12:42 +0100
Subject: [PATCH] Clean up vsplit in svg list

---
 resources/cards/svg.css | 15 +++++++--------
 resources/cards/svg.vm  | 35 ++++++++++++++---------------------
 2 files changed, 21 insertions(+), 29 deletions(-)

diff --git a/resources/cards/svg.css b/resources/cards/svg.css
index 489a9da..d041781 100644
--- a/resources/cards/svg.css
+++ b/resources/cards/svg.css
@@ -46,15 +46,14 @@ h4 {
     margin:0;
 }
 
-.splitcontainer {
+.vsplit {
     width: 100%;
     overflow: hidden;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    justify-content: space-around;
 }
-.splitl {
-    width: 45%;
-    float:left;
-}
-.splitr {
-    width: 45%;
-    float:right;
+.vsplit >* {
+    flex-grow: 1;
 }
diff --git a/resources/cards/svg.vm b/resources/cards/svg.vm
index 0258f30..70bfeba 100644
--- a/resources/cards/svg.vm
+++ b/resources/cards/svg.vm
@@ -24,14 +24,15 @@
             <input type="hidden" name="collection" value="$escape_html($current_collection)">
         #end
         <input type="submit">
+        
+        <center>
+            <h4>Collections:</h4>
+            <a href="svg">No collection</a>
+            #foreach($collection in $collections)
+            - <a href="svg?collection=$escape_html($collection)">$escape_html($collection)</a>
+            #end
+        </center>
     </form>
-    <center>
-        <h4>Collections:</h4>
-        <a href="svg">No collection</a>
-        #foreach($collection in $collections)
-        - <a href="svg?collection=$escape_html($collection)">$escape_html($collection)</a>
-        #end
-    </center>
 #end
 #macro(pagination)
     #if($has_next || $page>1)
@@ -53,13 +54,9 @@
 #end
 
 <a href="../" style="opacity:0.6;">Return to cardlist</a>
-<div class="splitcontainer">
-	<div class="splitl">
-		#upload_svgs_form()
-	</div>
-	<div class="splitr">
-		#filter_and_collection_forms()
-	</div>
+<div class="vsplit">
+	#upload_svgs_form()
+	#filter_and_collection_forms()
 </div>
 
 <h1>Available SVGs:</h1>
@@ -77,13 +74,9 @@
 
 #pagination()
 
-<div class="splitcontainer">
-	<div class="splitl">
-		#upload_svgs_form()
-	</div>
-	<div class="splitr">
-		#filter_and_collection_forms()
-	</div>
+<div class="vsplit">
+	#upload_svgs_form()
+	#filter_and_collection_forms()
 </div>
 
 <a href="../" style="opacity:0.6;">Return to cardlist</a>