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:
parent
805bbff330
commit
8672ddbafc
2 changed files with 16 additions and 14 deletions
|
|
@ -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"
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue