fix(webgui): scale task sheet width with viewport

[SimonFair]

Summary

Tracked-task sheets open too narrow on desktop. This change scales their default width with the browser viewport and keeps the responsive safeguards.

Why This Exists

The foreground sheet shows task logs and progress output. The 60rem default leaves unused desktop space and causes unnecessary text wrapping.

Resolution

The shared Nchan sheet now uses clamp(60rem, 70vw, 100rem) as its default. The existing 90vw cap keeps it inside narrow desktop viewports.

The full-screen mobile rule, stored widths, and 600px resize minimum remain unchanged.

Reviewer Considerations

• This default applies to all shared Nchan sheets, including tracked tasks, Release Notes, and alert viewers.
• A saved browser width still overrides the default and can be as small as 600px.
• The task tray remains 320px wide.

Behavior Changes

• Desktop sheets without a saved preference scale from 60rem to 100rem with the browser viewport.
• Existing saved preferences and mobile sheets do not change.

Implementation Summary

• Set the CSS fallback for --nchan-sheet-width to clamp(60rem, 70vw, 100rem).
• Keep 90vw as the outer viewport cap.
• Update the width-management comments to describe the responsive default and unchanged resize range.

Verification

• php -l emhttp/plugins/dynamix/include/DefaultPageLayout/BodyInlineJS.php completed with no syntax errors.
• git diff --check completed with no errors.
• Width calculations produced 600px at 768px, 840px at 1200px, and 1000px at 1440px and 1920px.
• A static CSS assertion found the responsive desktop rule and the 100vw mobile override.

Risk

Low. This change updates one CSS fallback expression and comments. It does not change task state, stored width handling, or mobile behavior.

Related to OS-645.

Follow-up to OS-377.

[coderabbitai]

Walkthrough

The Nchan sheet fallback width now uses clamp(60rem, 70vw, 100rem) and remains capped at 90vw. Related comments now describe the width behavior. Runtime sizing logic is unchanged.

Changes

Nchan sheet sizing

Layer / File(s)	Summary
Update Nchan width defaults emhttp/plugins/dynamix/styles/default-base.css, emhttp/plugins/dynamix/include/DefaultPageLayout/BodyInlineJS.php	The CSS fallback uses responsive clamping and retains the 90vw cap. JavaScript comments describe the width behavior without changing runtime logic.

Estimated code review effort: 1 (Trivial) | ~5 minutes

Suggested reviewers: elibosley

Poem

A rabbit hops as sheet widths flow,
With clamp-defined bounds in tow.
The viewport cap still guards the view,
While comments keep the sizing true.
Carrots cheer the CSS too!

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes the main change: scaling the task sheet width with the viewport.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[github-actions]

🔧 PR Test Plugin Available

A test plugin has been generated for this PR that includes the modified files.

Version: 2026.08.10.1925
Build: View Workflow Run

📥 Installation Instructions:

Install via Unraid Web UI:

1. Go to Plugins → Install Plugin
2. Copy and paste this URL:

https://preview.dl.unraid.net/pr-plugins/pr-2716/webgui-pr-2716.plg

3. Click Install

Alternative: Direct Download

• 📦 Download PLG
• 📦 Download TXZ

⚠️ Important Notes:

• Testing only: This plugin is for testing PR changes
• Backup included: Original files are automatically backed up
• Easy removal: Files are restored when plugin is removed
• Conflicts: Remove this plugin before installing production updates
• Post-merge behavior: This preview stays available after merge until preview storage expires or it is manually cleaned up

📝 Modified Files:

Click to expand file list

emhttp/plugins/dynamix/include/DefaultPageLayout/BodyInlineJS.php
emhttp/plugins/dynamix/styles/default-base.css

🔄 To Remove:

Navigate to Plugins → Installed Plugins and remove webgui-pr-2716, or run:

plugin remove webgui-pr-2716

---

_{🤖 This comment is automatically generated and will be updated with each new push to this PR.}