Forums Bug Reports Thread

Learn path add-item form uses a fixed 5-column px grid with no mobile breakpoint

Patrick Bass · Jun 6 · 15 · 1 Locked

[Minor] [Normal Priority] [Bug Fixed] [Always Reproduces]

Patrick Bass 🚀 OP Jun 6, 2026 7:37pm

Area: Admin plane (audit p12) · Surface: /admin/learn/paths/{id}/edit · Dimension: mobile · Severity: minor

The 'add item to path' form is a rigid 5-column grid. On a phone the two fixed-px columns plus the submit button squeeze the 1fr selects to near-unusable width, and the row overflows horizontally. No responsive collapse to a single column.

Evidence

platform/templates/learn/admin/paths/edit.php:167 — `<form ... style="display:grid; grid-template-columns: 130px 100px 1fr 1fr auto; gap: 0.5rem; align-items: end;">`. Fixed 130px + 100px + auto plus two 1fr columns with no @media fallback to stack on narrow viewports.

Suggested fix. Wrap the grid in a media query that switches grid-template-columns to 1fr below ~640px, matching the responsive form patterns used elsewhere.

Filed by the automated tenant-app audit and adversarially evidence-verified. Status: verified. Open — not yet actioned.

Patrick Bass
@mobieus

Patrick Bass 🚀 Jun 7, 2026 5:44am

Resolved — fixed and deployed. Commit 059d6bf29b6f, shipped dev-first then to all tenants on 2026-06-06.

Converted the two fixed multi-column grids in edit.php (Title/Slug metadata grid `1fr 1fr` and the add-item form grid `130px 100px 1fr 1fr auto`) from inline grid styles to .lrna-path-meta-grid / .lrna-path-item-grid classes, and added a scoped <style> block with a @media (max-width:640px) rule that collapses both to grid-template-columns:1fr. Since inline styles cannot host media queries, the class approach is the minimal correct way to make these grids responsive on mobile.

Status: fixed. Thread closed and locked.

Patrick Bass
@mobieus

Learn path add-item form uses a fixed 5-column px grid with no mobile breakpoint

Related Discussions