From 9a26cc6c36a7b63c3fca64244e1eee36bf8c6487 Mon Sep 17 00:00:00 2001
From: psychobunny <rodrigues.andrew@gmail.com>
Date: Wed, 28 Oct 2015 18:03:30 -0400
Subject: [PATCH] better organization of groups less

---
 less/groups.less             | 84 ++++++++++++++++++------------------
 templates/account/groups.tpl | 21 +++++----
 templates/groups/details.tpl |  2 +-
 templates/groups/list.tpl    | 64 ++++++++++++++-------------
 4 files changed, 89 insertions(+), 82 deletions(-)

diff --git a/less/groups.less b/less/groups.less
index 882fc07..1b41e34 100644
--- a/less/groups.less
+++ b/less/groups.less
@@ -1,46 +1,6 @@
-[component="groups/container"] {
+.groups.details {
 	margin-top: 200px;
 
-	[component="groups/summary"] {
-		.panel-body {
-			min-height: 72px;
-		}
-
-		.list-cover {
-			background-size: cover;
-			min-height: 125px;
-			background-position: 50% 50%;
-			.pointer;
-
-			h3 {
-				background-color: rgba(0,0,0,0.5);
-				display: inline-block;
-				padding: 0.25em 0.5em;
-				color: white;
-				font-weight: bold;
-				text-transform: capitalize;
-			}
-		}
-
-		.members {
-			padding-left: 0;
-
-			> li {
-				list-style-type: none;
-				display: inline-block;
-
-				img {
-					width: 32px;
-					height: 32px;
-				}
-			}
-
-			.truncated {
-				vertical-align: bottom;
-			}
-		}
-	}
-
 	[component="groups/cover"] {
 		background-size: cover;
 		background-repeat: no-repeat;
@@ -166,4 +126,46 @@
 			}
 		}
 	}
+}
+
+.groups.list {
+	[component="groups/summary"] {
+		.panel-body {
+			min-height: 72px;
+		}
+
+		.list-cover {
+			background-size: cover;
+			min-height: 125px;
+			background-position: 50% 50%;
+			.pointer;
+
+			h3 {
+				background-color: rgba(0,0,0,0.5);
+				display: inline-block;
+				padding: 0.25em 0.5em;
+				color: white;
+				font-weight: bold;
+				text-transform: capitalize;
+			}
+		}
+
+		.members {
+			padding-left: 0;
+
+			> li {
+				list-style-type: none;
+				display: inline-block;
+
+				img {
+					width: 32px;
+					height: 32px;
+				}
+			}
+
+			.truncated {
+				vertical-align: bottom;
+			}
+		}
+	}
 }
\ No newline at end of file
diff --git a/templates/account/groups.tpl b/templates/account/groups.tpl
index b6eca0e..26f0b92 100644
--- a/templates/account/groups.tpl
+++ b/templates/account/groups.tpl
@@ -1,10 +1,13 @@
+<div class="account">
+	<!-- IMPORT partials/account_menu.tpl -->
 
-<!-- IMPORT partials/account_menu.tpl -->
-
-<div component="groups/container" id="groups-list" class="groups row">
-	<!-- IF !groups.length -->
-	<div class="alert alert-warning">[[groups:no_groups_found]]</div>
-	<!-- ELSE -->
-	<!-- IMPORT partials/groups/list.tpl -->
-	<!-- ENDIF !groups.length -->
-</div>
+	<div class="groups list">
+		<div component="groups/container" id="groups-list" class="row">
+			<!-- IF !groups.length -->
+			<div class="alert alert-warning">[[groups:no_groups_found]]</div>
+			<!-- ELSE -->
+			<!-- IMPORT partials/groups/list.tpl -->
+			<!-- ENDIF !groups.length -->
+		</div>
+	</div>
+</div>
\ No newline at end of file
diff --git a/templates/groups/details.tpl b/templates/groups/details.tpl
index 92b79dd..d747018 100644
--- a/templates/groups/details.tpl
+++ b/templates/groups/details.tpl
@@ -1,4 +1,4 @@
-<div component="groups/container" class="details row">
+<div component="groups/container" class="groups details row">
 	<div component="groups/cover" style="background-image: url({group.cover:url}); background-position: {group.cover:position};">
 		<div class="controls">
 			<span class="upload"><i class="fa fa-fw fa-4x fa-upload"></i></span>
diff --git a/templates/groups/list.tpl b/templates/groups/list.tpl
index 443a18f..82914fc 100644
--- a/templates/groups/list.tpl
+++ b/templates/groups/list.tpl
@@ -1,40 +1,42 @@
-<!-- IMPORT partials/breadcrumbs.tpl -->
+<div class="groups list">
+	<!-- IMPORT partials/breadcrumbs.tpl -->
 
-<div class="row">
-	<div class="col-lg-4">
-		<!-- IF allowGroupCreation -->
-		<button class="btn btn-primary" data-action="new"><i class="fa fa-plus"></i> [[groups:new_group]]</button>
-		<!-- ENDIF allowGroupCreation -->
-	</div>
-	<div class="col-lg-8">
-		<div class="row">
-			<div class="col-xs-3 text-left pull-right">
-				<select class="form-control" id="search-sort">
-					<option value="alpha">[[groups:details.group_name]]</option>
-					<option value="count">[[groups:details.member_count]]</option>
-					<option value="date">[[groups:details.creation_date]]</option>
-				</select>
-			</div>
-			<div class="col-xs-5 text-left pull-right">
-				<div class="input-group">
-					<input type="text" class="form-control" placeholder="[[global:search]]" name="query" value="" id="search-text">
-					<span id="search-button" class="input-group-addon search-button"><i class="fa fa-search"></i></span>
+	<div class="row">
+		<div class="col-lg-4">
+			<!-- IF allowGroupCreation -->
+			<button class="btn btn-primary" data-action="new"><i class="fa fa-plus"></i> [[groups:new_group]]</button>
+			<!-- ENDIF allowGroupCreation -->
+		</div>
+		<div class="col-lg-8">
+			<div class="row">
+				<div class="col-xs-3 text-left pull-right">
+					<select class="form-control" id="search-sort">
+						<option value="alpha">[[groups:details.group_name]]</option>
+						<option value="count">[[groups:details.member_count]]</option>
+						<option value="date">[[groups:details.creation_date]]</option>
+					</select>
+				</div>
+				<div class="col-xs-5 text-left pull-right">
+					<div class="input-group">
+						<input type="text" class="form-control" placeholder="[[global:search]]" name="query" value="" id="search-text">
+						<span id="search-button" class="input-group-addon search-button"><i class="fa fa-search"></i></span>
+					</div>
 				</div>
 			</div>
 		</div>
 	</div>
-</div>
 
-<hr />
+	<hr />
 
-<div component="groups/container" class="row" id="groups-list" data-nextstart={nextStart}>
-	<!-- IF groups.length -->
-	<!-- IMPORT partials/groups/list.tpl -->
-	<!-- ELSE -->
-	<div class="col-xs-12">
-		<div class="alert alert-warning">
-		[[groups:no_groups_found]]
+	<div component="groups/container" class="row" id="groups-list" data-nextstart={nextStart}>
+		<!-- IF groups.length -->
+		<!-- IMPORT partials/groups/list.tpl -->
+		<!-- ELSE -->
+		<div class="col-xs-12">
+			<div class="alert alert-warning">
+			[[groups:no_groups_found]]
+			</div>
 		</div>
+		<!-- ENDIF groups.length -->
 	</div>
-	<!-- ENDIF groups.length -->
-</div>
+</div>
\ No newline at end of file