graham/aprs.me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Move APRS icons before callsigns on info page

Browse source 
Reorder icon and callsign in the page header, Other SSIDs table, and
Stations Near Current Position table so the icon appears first. Fix
icon clipping with flex-shrink-0 h-8 and add py-2 padding to SSIDs
table cells for proper vertical alignment.
This commit is contained in:
Graham McIntire 2026-02-19 18:55:00 -06:00
parent 1caa2fe6bc
commit 993af8447e
No known key found for this signature in database
1 changed files with 18 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
lib/aprsme_web/live/info_live/show.html.heex
View file

@ -11,9 +11,6 @@
{gettext("APRS Station")}
</h1>
<div class="ml-3 flex items-center space-x-3">
<span class="inline-flex items-center rounded-md bg-indigo-100 px-2 py-1 text-xs font-medium text-indigo-700 dark:bg-indigo-400/10 dark:text-indigo-400">
{@callsign}
</span>
<%= if @packet do %>
<% {symbol_table, symbol_code} = AprsmeWeb.AprsSymbol.extract_from_packet(@packet) %>
<% display_symbol =
@ -25,6 +22,9 @@
{render_symbol_html(@packet)}
</div>
<% end %>
<span class="inline-flex items-center rounded-md bg-indigo-100 px-2 py-1 text-xs font-medium text-indigo-700 dark:bg-indigo-400/10 dark:text-indigo-400">
{@callsign}
</span>
</div>
</div>
</div>
@ -341,14 +341,8 @@
<tbody>
<%= for ssid_info <- @other_ssids do %>
<tr>
<td class="font-medium">
<td class="font-medium py-2">
<div class="flex items-center space-x-2">
<.link
navigate={~p"/info/#{ssid_info.callsign}"}
class="font-semibold text-indigo-600 hover:text-indigo-500 dark:text-indigo-400 dark:hover:text-indigo-300"
>
{ssid_info.callsign}
</.link>
<%= if ssid_info.packet do %>
<% {symbol_table, symbol_code} =
AprsmeWeb.AprsSymbol.extract_from_packet(ssid_info.packet) %>
@ -357,10 +351,16 @@
do: symbol_table,
else:
"#{AprsmeWeb.AprsSymbol.normalize_symbol_table(symbol_table)}#{AprsmeWeb.AprsSymbol.normalize_symbol_code(symbol_code)}" %>
<div title={display_symbol}>
<div class="flex-shrink-0 h-8" title={display_symbol}>
{render_symbol_html(ssid_info.packet)}
</div>
<% end %>
<.link
navigate={~p"/info/#{ssid_info.callsign}"}
class="font-semibold text-indigo-600 hover:text-indigo-500 dark:text-indigo-400 dark:hover:text-indigo-300"
>
{ssid_info.callsign}
</.link>
</div>
</td>
<td class="text-gray-500 dark:text-gray-400">
@ -456,12 +456,6 @@
<tr>
<td class="font-medium">
<div class="flex items-center space-x-2">
<.link
navigate={~p"/info/#{neighbor.callsign}"}
class="font-semibold text-indigo-600 hover:text-indigo-500 dark:text-indigo-400 dark:hover:text-indigo-300"
>
{neighbor.callsign}
</.link>
<%= if neighbor.packet do %>
<% {symbol_table, symbol_code} =
AprsmeWeb.AprsSymbol.extract_from_packet(neighbor.packet) %>
@ -470,10 +464,16 @@
do: symbol_table,
else:
"#{AprsmeWeb.AprsSymbol.normalize_symbol_table(symbol_table)}#{AprsmeWeb.AprsSymbol.normalize_symbol_code(symbol_code)}" %>
<div title={display_symbol}>
<div class="flex-shrink-0 h-8" title={display_symbol}>
{render_symbol_html(neighbor.packet)}
</div>
<% end %>
<.link
navigate={~p"/info/#{neighbor.callsign}"}
class="font-semibold text-indigo-600 hover:text-indigo-500 dark:text-indigo-400 dark:hover:text-indigo-300"
>
{neighbor.callsign}
</.link>
</div>
</td>
<td class="text-gray-500 dark:text-gray-400">