Add tab options to layout designer

assets/css/admin.css

@@ -640,6 +640,13 @@ table.widefat.sp-sortable-table tbody tr .icon {
 }
 
 /* Sortable lists */
+.sp-sortable-list {
+	margin: 0;
+	overflow: hidden;
+	padding-top: 5px;
+	min-height: 50px;
+}
+
 .sp-sortable-list li {
 	float: left;
 	clear: both;

assets/css/sportspress.css

@@ -40,6 +40,37 @@
 	overflow: hidden;
 }
 
+/* Tabs */
+.sp-tab-menu {
+	display: block;
+	clear: both;
+	padding: 0 5px;
+	margin: 0 0 1.5em;
+	list-style: none;
+}
+.sp-tab-menu-item {
+	display: inline-block;
+	margin: 0;
+}
+.sp-tab-menu-item a {
+	display: block;
+	margin: 0 10px;
+	color: inherit;
+	opacity: 0.5;
+    transition: all .3s;
+}
+.sp-tab-menu-item a:focus {
+    outline: none;
+}
+.sp-tab-menu-item-active a,
+.sp-tab-menu-item a:hover {
+	color: inherit;
+	opacity: 1;
+}
+.sp-tab-content {
+	display: none;
+}
+
 /* Data Tables */
 .sp-scrollable-table-wrapper {
 	width: 100%;
@@ -339,6 +370,7 @@
 	max-width: none;
 	width: 100%;
 	height: auto;
+	color: inherit;
 }
 
 .sp-template-event-logos-block .team-logo img {

assets/js/admin/sportspress-admin.js

@@ -315,7 +315,8 @@ jQuery(document).ready(function($){
 	// Sortable lists
     $( ".sp-sortable-list" ).sortable({
     	handle: ".sp-item-handle",
-		placeholder: "sp-item-placeholder"
+		placeholder: "sp-item-placeholder",
+		connectWith: ".sp-connected-list"
     });
 
 	// Autosave

assets/js/sportspress.js

@@ -79,4 +79,12 @@ function sp_viewport() {
 	/* Scrollable Tables */
 	$(".sp-scrollable-table").wrap("<div class=\"sp-scrollable-table-wrapper\"></div>");
 
+	/* Template tabs */
+	$(".sp-tab-menu-item a").click(function() {
+		$template = $(this).data("sp-tab");
+		$(this).closest(".sp-tab-menu-item").addClass("sp-tab-menu-item-active").siblings(".sp-tab-menu-item").removeClass("sp-tab-menu-item-active");
+		$(this).closest(".sp-tab-group").find(".sp-tab-content-"+$template).show().siblings(".sp-tab-content").hide();
+		return false;
+	});
+
 })(jQuery);