Listing style tweaks

Cleaned up pagination to make it easier to identify what page is
currently being displayed and tweaks font sizes of page links for better
legibility.

public/assets/css/front/listing.css

@@ -12,7 +12,6 @@ section[role="listings"] a {
   font-size: 2em;
   font-weight: bold;
   border: 0;
-  display: block;
 }
 
 section[role="listings"] a label {
@@ -25,3 +24,13 @@ section[role="listings"] a label {
 section[role="listings"] a:hover {
   color: var(--white);
 }
+
+section[role="listings"] div[role="paginate"] {
+  padding: 5px;
+}
+
+section[role="listings"] div[role="paginate"] span {
+  vertical-align: super;
+  font-weight: bold;
+  font-size: 1.5em;
+}

src/Service/HandleLocations.php

@@ -45,11 +45,18 @@ class HandleLocations
         $response     = null;
         //$utils        = new StringTools();
         //$term = $utils->removeCommonWords($terms);
-        $terms = str_replace(",", "", $terms);
+        $rawSearch = $terms;
-        $terms = str_replace(" ", "|", $terms);
+        $terms     = str_replace(",", "", $terms);
+        $terms     = str_replace(" ", "|", $terms);
 
         try {
             $search = $this->connection->fetchAllAssociative("SELECT * FROM searchlocations('$terms')");
+            $active = [];
+            foreach ($search as $item) {
+                if ($item["active"] == true) {
+                    array_push($active, $item);
+                }
+            }
         } catch (PDOException $error) {
             $errorMessage = $error->getMessage();
         } catch (DBALException $error) {
@@ -71,8 +78,8 @@ class HandleLocations
             $response = [
                 "status"  => true,
                 "message" => "Good Reqeust",
-                "items"   => $search,
+                "items"   => $active,
-                "terms"   => $terms,
+                "terms"   => $rawSearch,
             ];
         }
 

templates/front/listing.twig

@@ -6,10 +6,20 @@
 	{% block main %}
 		<section role="listings">
 			<h1>The Bad Space Listings</h1>
-			<h2>Page
+			<div role="paginate">
-				{{ options.currentPage }}
+				<a href="/listings/page/{{ options.prevPage }}" title="previous page">
-				of
+					<i class="ti ti-arrow-left"></i>
-				{{ options.list.total }}</h2>
+				</a>
+				<span>
+					Page
+					{{ options.currentPage }}
+					of
+					{{ options.list.total }}
+				</span>
+				<a href="/listings/page/{{ options.nextPage }}" title="next page">
+					<i class="ti ti-arrow-right"></i>
+				</a>
+			</div>
 			{% for location in options.list.locations %}
 
 				<a href="/location/{{ location.uuid }}">
@@ -17,7 +27,21 @@
 					{{ location.name }}</a>
 				<br/>
 			{% endfor %}
-			<a href="/listings/page/{{ options.prevPage }}">Previous</a>
+
-			<a href="/listings/page/{{ options.nextPage }}">Next</a>
+			<div role="paginate">
+				<a href="/listings/page/{{ options.prevPage }}" title="previous page">
+					<i class="ti ti-arrow-left"></i>
+				</a>
+				<span>
+					Page
+					{{ options.currentPage }}
+					of
+					{{ options.list.total }}
+				</span>
+				<a href="/listings/page/{{ options.nextPage }}" title="next page">
+					<i class="ti ti-arrow-right"></i>
+				</a>
+			</div>
+
 		</section>
 	{% endblock %}