From d03220f8cce56d568ad4d0e68f6c16d23ef79995 Mon Sep 17 00:00:00 2001
From: Bofh <bofh@nogafam.es>
Date: Wed, 7 Dec 2022 01:41:49 +0100
Subject: [PATCH] Change order of content arrangement in #instance/filter-users

---
 css/base.php                            |  1 +
 js/templates/instance/filter-users.html | 91 ++++++++++++-------------
 views/instance.php                      |  2 -
 3 files changed, 46 insertions(+), 48 deletions(-)

diff --git a/css/base.php b/css/base.php
index 50f94c8..f9dab69 100644
--- a/css/base.php
+++ b/css/base.php
@@ -59,6 +59,7 @@ body > .toast-container {
 *[id*="-item"] { display: none !important }
 
 .flex { display: flex }
+.inline { display: inline-block }
 .center { margin: auto }
 .wmax { width: 100vw }
 .hmax { height: 100vh }
diff --git a/js/templates/instance/filter-users.html b/js/templates/instance/filter-users.html
index 24b6fff..a4a5520 100644
--- a/js/templates/instance/filter-users.html
+++ b/js/templates/instance/filter-users.html
@@ -1,38 +1,16 @@
-
-<h3>Results: <button id="btncollapse-results-box">hide</button></h3>
-<div id="results-box">
-	<div id="paging"></div>
-	<div id="paging-item">
-		<button class="btn mid" onclick="
-			{view.js}.execute({prev_page},{items_per_page})"
-			><i class="fa fa-chevron-left fa-fw"></i></button>
-		<button class="btn mid" onclick="
-			{view.js}.execute({next_page},{items_per_page})"
-			><i class="fa fa-chevron-right fa-fw"></i></button>
-		<span>{current_page} / {total_pages} ({total_users} users)</span>
+<h3>Your filter presets: <button id="btncollapse-filters-all">hide</button></h3>
+<div id="filters-all"></div>
+<span id="filters-all-item">
+	<a href="javascript:window.set_hash_argument('filter_id','{id}')">
+	<div class="btn mid card inline" style="margin-right: .5em; margin-bottom: .5em">
+		<i class="fa fa-filter fa-fw"></i>{name}
+		<button class="btn small red"
+			onclick="{view.js}.delete_filter('{id}');event.preventDefault()">
+			<i class="fa fa-close fa-fw"></i>
+		</button>
 	</div>
-	<div id="users-all"></div>
-	<div id="users-all-item">
-		<div class="card software {software}">
-			<div class="flex">
-				<img data-src="{avatar}"/>
-				<div class="w100" style="padding:0 1em">
-					<b style="font-size: 1.1em">{name}</b>
-					<br>
-					<span class="gray">@{acct}</span>
-					<div class="props flex">
-						<span>{statuses}<br><span class="gray">statuses</span></span>
-						<span>{following}<br><span class="gray">following</span></span>
-						<span>{followers}<br><span class="gray">followers</span></span>
-					</div>
-				</div>
-			</div>
-			<div class="only mastodon">{mastodon:fields}</div>
-			<div class="note">{note}</div>
-		</div>
-	</div>
-</div>
-<br>
+	</a>
+</span>
 
 <h3>
 	<span id="filter-current-name">*New filter</span>:
@@ -121,17 +99,38 @@
 			Save filter</button>
 	</div>
 </div>
-<br>
-<h3>Your filter presets: <button id="btncollapse-filters-all">hide</button></h3>
-<div id="filters-all"></div>
-<div id="filters-all-item">
-	<a href="javascript:window.set_hash_argument('filter_id','{id}')">
-	<div class="btn card" style="float: left; margin-right: 1em;">
-		<i class="fa fa-filter fa-fw"></i>{name}
-		<button class="btn small red"
-			onclick="{view.js}.delete_filter('{id}');event.preventDefault()">
-			<i class="fa fa-close fa-fw"></i>
-		</button>
+
+<h3>Results: <button id="btncollapse-results-box">hide</button></h3>
+<div id="results-box">
+	<div id="paging"></div>
+	<div id="paging-item">
+		<button class="btn mid" onclick="
+			{view.js}.execute({prev_page},{items_per_page})"
+			><i class="fa fa-chevron-left fa-fw"></i></button>
+		<button class="btn mid" onclick="
+			{view.js}.execute({next_page},{items_per_page})"
+			><i class="fa fa-chevron-right fa-fw"></i></button>
+		<span>{current_page} / {total_pages} ({total_users} users)</span>
+	</div>
+	<div id="users-all"></div>
+	<div id="users-all-item">
+		<div class="card software {software}">
+			<div class="flex">
+				<img data-src="{avatar}"/>
+				<div class="w100" style="padding:0 1em">
+					<b style="font-size: 1.1em">{name}</b>
+					<br>
+					<span class="gray">@{acct}</span>
+					<div class="props flex">
+						<span>{statuses}<br><span class="gray">statuses</span></span>
+						<span>{following}<br><span class="gray">following</span></span>
+						<span>{followers}<br><span class="gray">followers</span></span>
+					</div>
+				</div>
+			</div>
+			<div class="only mastodon">{mastodon:fields}</div>
+			<div class="note">{note}</div>
+		</div>
 	</div>
-	</a>
 </div>
+<br>
diff --git a/views/instance.php b/views/instance.php
index a77510c..90446f2 100644
--- a/views/instance.php
+++ b/views/instance.php
@@ -143,8 +143,6 @@ window.view.instance = {
 			execute: function(page, items_per_page) {
 				const btn = E.elemid('btncollapse-filters-current');
 				if (btn.innerText.trim() === 'hide') btn.click();
-				const btn2 = E.elemid('btncollapse-filters-all');
-				if (btn2.innerText.trim() === 'hide') btn2.click();
 
 				const data = window.view.instance.do.filter_users.get_current_filter();
 				delete data.id;