From 3775be4ce9c56639146efa877eefabb9e9f23b3c Mon Sep 17 00:00:00 2001
From: Mario <mario@mariovavti.com>
Date: Mon, 26 Nov 2018 12:44:10 +0100
Subject: use flex for the default template

---
 view/css/default.css      | 37 ++++++++++++++++++++++++++-----------
 view/css/mod_connedit.css |  1 -
 view/php/default.php      | 14 +++++++++-----
 3 files changed, 35 insertions(+), 17 deletions(-)

(limited to 'view')

diff --git a/view/css/default.css b/view/css/default.css
index 765a197d9..bd0f14ba2 100644
--- a/view/css/default.css
+++ b/view/css/default.css
@@ -1,22 +1,37 @@
 main {
-	display: table;
-	table-layout: fixed;
 	position: relative;
-	width: 100%;
-	height: 100vh;
+	min-height: 100vh;
+	display: flex;
+	flex-direction: column;
 }
 
-aside {
+.content {
+	display: flex;
+	flex: 1;
+}
+
+.columns {
+	display: flex;
+	flex:1;
+	min-width: 0;
+}
+
+#region_1 {
 	position: relative;
-	display: table-cell;
-	vertical-align: top;
+	order: 1;
 	padding: 4.5rem 7px 0px 7px;
 }
 
-section {
+#region_2 {
 	position: relative;
-	width: 100%;
-	display: table-cell;
-	vertical-align: top;
+	flex: 1;
+	order: 2;
 	padding: 4.5rem 7px 200px 7px;
+	min-width: 0;
+}
+
+#region_3 {
+	position: relative;
+	order: 3;
+	padding: 4.5rem 7px 0px 7px;
 }
diff --git a/view/css/mod_connedit.css b/view/css/mod_connedit.css
index 67a182c5c..b02f928f0 100644
--- a/view/css/mod_connedit.css
+++ b/view/css/mod_connedit.css
@@ -71,7 +71,6 @@
 	width: 32px;
 	height: 32px;
 	border-radius: 4px;
-	border: 1px solid #ccc;
 	text-align: center;
 }
 
diff --git a/view/php/default.php b/view/php/default.php
index 60f3f6a6f..388c94382 100644
--- a/view/php/default.php
+++ b/view/php/default.php
@@ -10,12 +10,16 @@
 	<header><?php if(x($page,'header')) echo $page['header']; ?></header>
 	<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark"><?php if(x($page,'nav')) echo $page['nav']; ?></nav>
 	<main>
-		<aside id="region_1"><div class="aside_spacer"><div id="left_aside_wrapper"><?php if(x($page,'aside')) echo $page['aside']; ?></div></div></aside>
-		<section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
+		<div class="content">
+			<div class="columns">
+				<aside id="region_1"><div class="aside_spacer"><div id="left_aside_wrapper"><?php if(x($page,'aside')) echo $page['aside']; ?></div></div></aside>
+				<section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
 					<div id="page-footer"></div>
-			<div id="pause"></div>
-		</section>
-		<aside id="region_3" class="d-none d-xl-table-cell"><div class="aside_spacer"><div id="right_aside_wrapper"><?php if(x($page,'right_aside')) echo $page['right_aside']; ?></div></div></aside>
+					<div id="pause"></div>
+				</section>
+				<aside id="region_3" class="d-none d-xl-table-cell"><div class="aside_spacer"><div id="right_aside_wrapper"><?php if(x($page,'right_aside')) echo $page['right_aside']; ?></div></div></aside>
+			</div>
+		</div>
 	</main>
 	<footer><?php if(x($page,'footer')) echo $page['footer']; ?></footer>
 </body>
-- 
cgit v1.2.3