From 7101ec09ed6efdbc302e38859e988f3b333885ff Mon Sep 17 00:00:00 2001
From: Dan Brown <ssddanbrown@googlemail.com>
Date: Thu, 3 Nov 2022 12:49:05 +0000
Subject: [PATCH] Updated search term lists to flex layouts

---
 .../views/search/parts/term-list.blade.php    | 35 +++++++++----------
 1 file changed, 17 insertions(+), 18 deletions(-)

diff --git a/resources/views/search/parts/term-list.blade.php b/resources/views/search/parts/term-list.blade.php
index 3fbfa18fe..dfcc80269 100644
--- a/resources/views/search/parts/term-list.blade.php
+++ b/resources/views/search/parts/term-list.blade.php
@@ -2,25 +2,24 @@
 @type - Type of term (exact, tag)
 @currentList
 --}}
-<table component="add-remove-rows"
+<div component="add-remove-rows"
        option:add-remove-rows:remove-selector="button.text-neg"
-       option:add-remove-rows:row-selector="tr"
-       class="no-style">
+       option:add-remove-rows:row-selector=".flex-container-row"
+        class="flex-container-column gap-xs">
     @foreach(array_merge($currentList, ['']) as $term)
-        <tr @if(empty($term)) class="hidden" refs="add-remove-rows@model" @endif>
-            <td class="pb-s pr-m">
+        <div @if(empty($term)) refs="add-remove-rows@model" @endif
+            class="{{ $term ? '' : 'hidden' }} flex-container-row items-center gap-x-xs">
+            <div>
                 <input class="exact-input outline" type="text" name="{{$type}}[]" value="{{ $term }}">
-            </td>
-            <td>
-                <button type="button" class="text-neg text-button">@icon('close')</button>
-            </td>
-        </tr>
+            </div>
+            <div>
+                <button type="button" class="text-neg text-button icon-button p-xs">@icon('close')</button>
+            </div>
+        </div>
     @endforeach
-    <tr>
-        <td colspan="2">
-            <button refs="add-remove-rows@add" type="button" class="text-button">
-                @icon('add-circle'){{ trans('common.add') }}
-            </button>
-        </td>
-    </tr>
-</table>
\ No newline at end of file
+    <div class="flex py-xs">
+        <button refs="add-remove-rows@add" type="button" class="text-button">
+            @icon('add-circle'){{ trans('common.add') }}
+        </button>
+    </div>
+</div>
\ No newline at end of file