fix(ui): expand develop sidebar width and fix ruler track and chip label wrapping in desktop STUDIO

docker/frontend/src/App.tsx

@@ -4392,10 +4392,11 @@ export function Workspace() {
         <div className="chips">
           {/* column 1 — the tab's own chips, RESET ruled off at the foot */}
           <div
+            key={tab === 'light' ? 'col-dev' : tab === 'create' ? 'col-create' : 'col-main'}
             className={`col col-main${tab === 'create' ? ' col-create' : ''}${
               tab === 'light' ? ' col-dev' : ''
             }`}
-            data-col="main"
+            data-col={tab === 'light' ? 'dev' : 'main'}
           >
             {/* The phone's way back is the path under the strip (see .crumb):
                 TABS > LIGHT > WB, each name returning to the strip it names.
@@ -4495,6 +4496,7 @@ export function Workspace() {
             {/* MY PHOTOS and FAVORITED are lists of names rather than buttons, so
                 their column is the visitor's to widen (see ColGrip). */}
             {listTab ? <ColGrip col="main" /> : null}
+            {tab === 'light' ? <ColGrip col="dev" min={320} max={600} /> : null}
             {tab === 'favorited' && saved.length === 0 ? <p className="hint">{t('sec.savedEmpty')}</p> : null}
 
             {/* RESET is the way out of an edit, not one more chip: it sits under