Flexpanel equal-height row options.

e107_admin/includes/layouts/flexpanel_default.php

@@ -37,7 +37,7 @@ $FLEXPANEL_LAYOUT = '
 				</div>
 			</div>
 			
-			<div class="row">
+			<div class="row row-flex">
 				<div class="col-sm-4">
 					<div class="draggable-panels" id="menu-area-03">
 						{MENU_AREA_03}
@@ -65,7 +65,7 @@ $FLEXPANEL_LAYOUT = '
 				</div>
 			</div>
 			
-			<div class="row">
+			<div class="row row-flex">
 				<div class="col-sm-6">
 					<div class="draggable-panels" id="menu-area-07">
 						{MENU_AREA_07}

e107_themes/bootstrap3/admin_style.css

@@ -1540,6 +1540,8 @@ footer {
 body#admin-menus > .container-fluid > .row,
 body#admin-menus .admin-left-panel,
 
+
+/* Flex Classes */
 .row-flex,
 .row-flex > div[class*='col-'] {
     display: -webkit-box;
@@ -1551,6 +1553,44 @@ body#admin-menus .admin-left-panel,
 
 }
 
+.row-flex-wrap {
+	-webkit-flex-flow: row wrap;
+    align-content: flex-start;
+    flex:0;
+}
+
+
+.row-flex > div[class*='col-'], .container-flex > div[class*='col-'] {
+	 margin:-.2px;
+
+}
+
+
+.container-flex > div[class*='col-'] div,.row-flex > div[class*='col-'] div {
+	width:100%;
+}
+
+
+.flex-col {
+    display: flex;
+    display: -webkit-flex;
+    flex: 1 100%;
+	flex-flow: column nowrap;
+}
+
+.flex-grow {
+	display: flex;
+    -webkit-flex: 2;
+    flex: 2;
+}
+
+.row-flex .panel { height: 100%;  }
+
+.admin-main-content .row-flex { margin-bottom:20px }
+
+
+
+
 body#admin-menus > .container-fluid > .row {
 	height: 92vh;
 }
@@ -1682,3 +1722,5 @@ td img.thumbnail { margin-bottom:0 }
 
 
 	}
+
+

e107_web/js/core/admin.flexpanel.js

@@ -43,11 +43,13 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 						var $placeholders = $('.draggable-placeholder');
 						var $draggablePanels = $(e107.settings.flexPanel.selector);
 
-						$placeholders.css('margin', '15px');
+						/*$placeholders.css('margin', '15px');*/
 						$placeholders.css('background-color', '#337ab7');
 
-						$draggablePanels.css('min-height', '20px');
+						$draggablePanels.css('min-height', '80px');
+
 						$draggablePanels.css('border', '1px dashed #CCCCCC');
+						$draggablePanels.css('background-color', 'rgba(0,0,0,0.1)');
 						$draggablePanels.css('margin-bottom', '30px');
 
 						$panel.sortable("refreshPositions");
@@ -58,6 +60,7 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 						$draggablePanels.css('min-height', '0');
 						$draggablePanels.css('border', 'none');
 						$draggablePanels.css('margin-bottom', '0');
+						$draggablePanels.css('background-color', 'transparent');
 
 						e107.callbacks.flexPanelSavePanelOrder();
 					}