segment highlight, all-efforts table, live segment selection preview

src/routes/segments/[id]/+page.svelte

@@ -83,6 +83,27 @@
 	</div>
 {/if}
 
+{#if data.efforts.length > 0}
+	<h2>All efforts ({data.efforts.length})</h2>
+	<div class="card table-wrap">
+		<table>
+			<thead>
+				<tr><th>Athlete</th><th>Time</th><th>Date</th><th>Activity</th></tr>
+			</thead>
+			<tbody>
+				{#each data.efforts as effort (effort.id)}
+					<tr class:me={effort.user_id === data.myUserId}>
+						<td><a href="/users/{effort.username}">{effort.username}</a></td>
+						<td class="time">{effort.elapsed_s !== null ? fmtElapsed(effort.elapsed_s) : '–'}</td>
+						<td>{effort.date ? fmtDate(effort.date) : '–'}</td>
+						<td><a href="/activities/{effort.activity_id}">{effort.activity_name}</a></td>
+					</tr>
+				{/each}
+			</tbody>
+		</table>
+	</div>
+{/if}
+
 <style>
 	.back {
 		display: inline-block;