Relocate pipeline status chip to the sidebar footer

The running label "Updating propagation (HRRR run)" didn't fit in
the 224 px desktop sidebar alongside the NTMS title block, so it
was being truncated. Move the chip to the bottom of the sidebar
(below the auth menu) where it can use the full sidebar width,
let the text wrap naturally instead of truncating, and drop the
trailing ellipsis. Mobile chip stays at the top since the mobile
layout collapses menu + auth into a dropdown.
This commit is contained in:
Graham McIntire 2026-04-14 10:41:11 -05:00
parent 805bbff330
commit 8672ddbafc
No known key found for this signature in database
GPG key ID: F4ABF488E6029E59
2 changed files with 16 additions and 14 deletions

View file

@ -97,9 +97,9 @@ defmodule Microwaveprop.Propagation.PipelineStatus do
end
end
defp running_label(@grid_worker), do: "Updating propagation (HRRR run)"
defp running_label(@asos_worker), do: "Updating propagation (ASOS nudge)"
defp running_label(_), do: "Updating propagation"
defp running_label(@grid_worker), do: "Updating propagation (HRRR run)"
defp running_label(@asos_worker), do: "Updating propagation (ASOS nudge)"
defp running_label(_), do: "Updating propagation"
defp format_age(0), do: "just now"
defp format_age(1), do: "1m"

View file

@ -368,25 +368,25 @@ defmodule MicrowavepropWeb.MapLive do
<div
id={@id}
data-pipeline-state={@status.state}
class="flex items-center gap-1.5 text-xs px-1 py-1"
class="flex items-start gap-1.5 text-xs px-1 py-1 leading-tight"
title={@status.label}
>
<%= case @status.state do %>
<% :running -> %>
<.icon
name="hero-arrow-path"
class="size-3.5 shrink-0 text-info motion-safe:animate-spin"
class="size-3.5 shrink-0 mt-0.5 text-info motion-safe:animate-spin"
/>
<span class="opacity-90 truncate">{@status.label}</span>
<span class="opacity-90 break-words min-w-0">{@status.label}</span>
<% :idle -> %>
<span class="size-2 rounded-full bg-success inline-block shrink-0"></span>
<span class="opacity-70 truncate">{@status.label}</span>
<span class="size-2 rounded-full bg-success inline-block shrink-0 mt-[5px]"></span>
<span class="opacity-70 break-words min-w-0">{@status.label}</span>
<% :stale -> %>
<span class="size-2 rounded-full bg-warning inline-block shrink-0"></span>
<span class="opacity-80 truncate">{@status.label}</span>
<span class="size-2 rounded-full bg-warning inline-block shrink-0 mt-[5px]"></span>
<span class="opacity-80 break-words min-w-0">{@status.label}</span>
<% :unknown -> %>
<span class="size-2 rounded-full bg-base-content/30 inline-block shrink-0"></span>
<span class="opacity-60 truncate">{@status.label}</span>
<span class="size-2 rounded-full bg-base-content/30 inline-block shrink-0 mt-[5px]"></span>
<span class="opacity-60 break-words min-w-0">{@status.label}</span>
<% end %>
</div>
"""
@ -608,8 +608,6 @@ defmodule MicrowavepropWeb.MapLive do
</div>
</div>
<.pipeline_status_chip id="pipeline-status-desktop" status={@pipeline_status} />
<%!-- Band selector --%>
<div class="dropdown">
<div tabindex="0" role="button" class="btn btn-sm w-full justify-between">
@ -723,6 +721,10 @@ defmodule MicrowavepropWeb.MapLive do
</li>
<% end %>
</ul>
<div class="border-t border-base-300 pt-2">
<.pipeline_status_chip id="pipeline-status-desktop" status={@pipeline_status} />
</div>
</div>
</div>
</div>