redmineOH

Codex task: Make the Description editor header match the full editor width¶

Fix the Description field formatting on the New Issue and Edit Issue forms.

Problem¶

The visible header or toolbar area above the Description input does not span the full width of the editor/input container. This creates an uneven right edge and makes the editor look partially detached from its surrounding field.

Use the screenshot attached to this issue as the visual reference.

Required work¶

1. Inspect the actual HTML structure produced for the Description field, including:

   • the label;
   • formatting toolbar;
   • editor wrapper;
   • textarea;
   • preview area;
   • any plugin-generated containers.

2. Identify which RedmineOH CSS rule limits the width of the header or toolbar.

3. Adjust the theme so that:

   • the Description editor wrapper uses the available form width;
   • the toolbar/header and textarea share the same left and right edges;
   • padding, borders and box-sizing are consistent;
   • the editor does not overflow its parent;
   • preview mode and toolbar buttons remain functional;
   • the layout adapts cleanly at narrower viewport widths.

4. Apply the correction to both:

   • New Issue;
   • Edit Issue.

5. Verify whether the same editor component appears in comments, wiki pages or other forms. Reuse a shared fix only when it is safe; otherwise scope it to the issue form.

6. Avoid hard-coded pixel widths that depend on the current viewport. Prefer width: 100%, appropriate flex/grid behaviour and box-sizing: border-box.

7. Do not modify Redmine core files. Keep the implementation inside the RedmineOH theme unless a theme-owned template override is already responsible.

Areas to verify¶

Test:

• new issue form;
• edit issue form;
• description edit and preview modes;
• toolbar buttons and dropdowns;
• textarea resizing;
• forms with and without attachments;
• desktop and narrow/mobile widths;
• browsers supported by the project.

Acceptance criteria¶

• The Description toolbar/header spans exactly the same usable width as the textarea/editor body.
• The editor’s left and right borders align.
• No horizontal overflow or clipped toolbar controls are introduced.
• Preview mode uses the same correctly aligned width.
• The attached screenshot’s visible defect is resolved.
• Other issue fields and unrelated text editors remain unchanged.
• No regression appears on the issue details or issue list pages.

Deliverable¶

Report:

• files changed;
• selectors added, removed or narrowed;
• the root cause of the width mismatch;
• pages and viewport sizes tested;
• whether the solution affects any other Redmine editor instances.