iPad fix sweep: crcp.html nav breakpoint 760->1024, licensed-agents badge width cap

0f635d90929b57f5c61542c31d2e9e1c6465a24d · 2026-07-16 17:16:16 -0700 · Steve

- crcp.html: nav-wrap media query was max-width:760px, missed iPad portrait
  (768px) by 8px -> raised to 1024 + overflow-x:hidden guard.
- licensed-agents.html: a stray long a.status value made a nowrap .badge
  balloon to 1512px and spill 1216px off-screen; capped max-width:60% +
  min-width:0 + ellipsis so any status text stays contained.
- Verified: all 15 CRCP pages now zero horizontal overflow at 768 & 1024
  both orientations (WebKit/iPad engine). Other 13 pages were already clean.

Files touched

M public/crcp.html
M public/licensed-agents.html

Diff

commit 0f635d90929b57f5c61542c31d2e9e1c6465a24d
Author: Steve <steve@designerwallcoverings.com>
Date:   Thu Jul 16 17:16:16 2026 -0700

    iPad fix sweep: crcp.html nav breakpoint 760->1024, licensed-agents badge width cap
    
    - crcp.html: nav-wrap media query was max-width:760px, missed iPad portrait
      (768px) by 8px -> raised to 1024 + overflow-x:hidden guard.
    - licensed-agents.html: a stray long a.status value made a nowrap .badge
      balloon to 1512px and spill 1216px off-screen; capped max-width:60% +
      min-width:0 + ellipsis so any status text stays contained.
    - Verified: all 15 CRCP pages now zero horizontal overflow at 768 & 1024
      both orientations (WebKit/iPad engine). Other 13 pages were already clean.
---
 public/crcp.html            | 6 ++++--
 public/licensed-agents.html | 5 +++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/public/crcp.html b/public/crcp.html
index bcfd553..6cbecb7 100644
--- a/public/crcp.html
+++ b/public/crcp.html
@@ -35,12 +35,14 @@
   .tile.gold .v{color:var(--gold);} .tile.active .v{color:var(--active);} .tile.draft .v{color:var(--draft);} .tile.staged .v{color:var(--staged);}
   .cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
   @media(max-width:880px){.cols{grid-template-columns:1fr;}}
-  /* mobile: header + nav wrap instead of overflowing the viewport */
-  @media(max-width:760px){
+  /* tablet + mobile: header + nav wrap instead of overflowing the viewport
+     (was 760px — missed iPad portrait at 768px; raised to 1024 to cover the whole tablet band) */
+  @media(max-width:1024px){
     header{flex-wrap:wrap;}
     header .nav{flex-wrap:wrap;gap:10px 12px;width:100%;}
     .wrap{padding:14px;}
     #modal{width:96vw;padding:16px;}
+    html,body{overflow-x:hidden;}
   }
   .panel{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:16px;margin-bottom:16px;}
   .panel h3{margin:0 0 12px;font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--gold);display:flex;justify-content:space-between;cursor:pointer;user-select:none;}
diff --git a/public/licensed-agents.html b/public/licensed-agents.html
index d088173..3ff26f5 100644
--- a/public/licensed-agents.html
+++ b/public/licensed-agents.html
@@ -22,9 +22,10 @@
   .grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(var(--cw,320px),1fr));}
   .card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:13px 14px;}
   .card .top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;}
-  .card .nm{font-weight:700;font-size:14px;}
+  .card .nm{font-weight:700;font-size:14px;min-width:0;overflow-wrap:anywhere;}
   .card .bk{color:var(--mut);font-size:12px;margin-top:1px;}
-  .badge{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:12px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;}
+  /* max-width + ellipsis so a stray long status value (a.status sometimes holds a full DRE sentence) can't blow the card off-screen */
+  .badge{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:12px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;flex:0 1 auto;min-width:0;max-width:60%;overflow:hidden;text-overflow:ellipsis;}
   .b-active{background:rgba(63,185,80,.14);color:var(--acc);border:1px solid rgba(63,185,80,.5);}
   .b-un{background:rgba(139,148,158,.12);color:var(--mut);border:1px solid var(--line);}
   .b-warn{background:rgba(210,153,34,.14);color:var(--warn);border:1px solid rgba(210,153,34,.5);}

← b59aea1 afternoon CRE update 2026-07-16 · back to Commercialrealestate · add on-demand CRCP front-end deploy script (mac3->Kamatera) a8e4386 →