Skip to content

fix(dashboard): expand delivery attempts sidebar to full viewport height before scrolling - #2893

Merged
mekilis merged 2 commits into
frain-dev:mainfrom
vicenteyu:fix-delivery-attempts-sidebar
Oct 22, 2026
Merged

mekilis merged 2 commits into
frain-dev:mainfrom
vicenteyu:fix-delivery-attempts-sidebar

Conversation

@vicenteyu

Copy link
Copy Markdown
Contributor

Problem

On the Delivery Attempts detail page, the left sidebar (delivery attempts list) has a fixed max-h-[520px] constraint — it shows a scrollbar even when there's plenty of empty space below it. This means users see fewer attempt records at once and have to scroll more than necessary, while the right side of the page extends much further down.

The sidebar should use the full available vertical space (matching the right content area height) and only show a scrollbar when the list actually exceeds that height.

Solution

Replace the fixed max-h-[520px] with a relative/absolute layout pattern. The outer container uses relative with contain: size to establish the height boundary, and the inner list uses absolute inset-0 to fill that space. This way the sidebar naturally grows to match the right panel's height, and scrolling only kicks in when content overflows.

Code Changes

Before:

<div class="w-full md:w-[380px] shrink-0 flex flex-col gap-4px max-h-[520px] overflow-y-auto" ...>
  ...
</div>

After:

<div class="w-full md:w-[380px] shrink-0 md:relative overflow-y-auto" style="contain: size;">
  <div class="md:absolute md:inset-0 flex flex-col gap-4px overflow-y-auto" ...>
    ...
  </div>
</div>

Before

  • Left sidebar has a fixed max-h-[520px]
  • Scrollbar appears even though there's empty space below the list
  • Only a small number of delivery attempts are visible at once
  • Right content area extends much further down than the left list

After

  • Left sidebar expands to fill the full available height (same as the right content area)
  • Scrollbar only appears when the number of delivery attempts exceeds the available height
  • More records visible at a glance, reducing unnecessary scrolling
  • Better visual balance between left and right panels

Screenshots

Before — sidebar is short, scrolls with empty space below:
screenshot-20261022-022343

After — sidebar uses full height, scrolls only when needed:
screenshot-20261022-030505

@CLAassistant

CLAassistant commented Oct 21, 2026 •

Copy link
Copy Markdown

CLA assistant check
All committers have signed the CLA.

@vicenteyu vicenteyu changed the title fix: expand delivery attempts sidebar to full viewport height before scrolling fix(dashboard): expand delivery attempts sidebar to full viewport height before scrolling Oct 22, 2026
@vicenteyu vicenteyu closed this Oct 22, 2026
@vicenteyu vicenteyu reopened this Oct 22, 2026
@vicenteyu

Copy link
Copy Markdown
Contributor Author

Hi, I've signed the CLA. Could you please approve the workflow runs so the checks can start? Thanks!

@vicenteyu
vicenteyu force-pushed the fix-delivery-attempts-sidebar branch from 19aa1d7 to 3e7e35e Compare October 22, 2026 03:11
@mekilis

mekilis commented Oct 22, 2026

Copy link
Copy Markdown
Collaborator

Hi, I've signed the CLA. Could you please approve the workflow runs so the checks can start? Thanks!

Yes, approved

@mekilis
mekilis enabled auto-merge October 22, 2026 06:45
@mekilis
mekilis added this pull request to the merge queue Oct 22, 2026
Merged via the queue into frain-dev:main with commit d7c61dc Oct 22, 2026
26 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants