Moved sort onclick to header only

src/components/runners/RunnersOverview.svelte

@@ -35,7 +35,7 @@
     {
       accessorKey: "distance",
       header: () => "distance",
-      filterFn: `equals`,
+      canFilter: false,
     },
   ];
 
@@ -129,8 +129,9 @@
         {#each $table.getHeaderGroups() as headerGroup}
           <tr>
             {#each headerGroup.headers as header}
-              <th on:click={header.column.getToggleSortingHandler()}>
+              <th>
                 {#if !header.isPlaceholder}
+                  <div on:click={header.column.getToggleSortingHandler()}>
                     <svelte:component
                       this={flexRender(
                         header.column.columnDef.header,
@@ -142,6 +143,7 @@
                     {:else if header.column.getIsSorted().toString() == "desc"}
                       🔽
                     {/if}
+                  </div>
                 {/if}
                 {#if header.column.getCanFilter()}
                   <div class="relative max-w-xs">