Fix clipped comment-report modal #940

New issue

Closed

opened 2026-08-30 12:26:11 -05:00 by Veilor · 1 comment

Veilor commented

2026-08-30 12:26:11 -05:00

Member

The comment-report dialog is visually clipped, preventing users from reliably viewing or submitting the report form.

The issue is isolated to the presentation and responsive layout of the existing comment-report UI.

Scope

Inspect the existing comment-report view and its associated CSS classes.
Adjust modal sizing, overflow, stacking, and responsive behavior so the complete dialog remains visible within the viewport.
Preserve the existing report submission and validation behavior.

Acceptance Criteria

The complete comment-report dialog, including its fields, actions, and close control, is visible without being obscured by the backdrop or surrounding content.
The dialog remains usable on narrow and wide viewports without horizontal clipping.
The backdrop and dialog stacking order do not hide dialog content.
Existing report submission, cancellation, and validation behavior remains unchanged.

Test Coverage Required

Add or update a feature test covering that the comment-report UI is rendered for the applicable comment action.
Add browser or view-level coverage for the dialog at a narrow viewport if the repository's existing test conventions support it.
Run the existing focused comment-related test coverage after implementation.

Progress Checklist

Locate the comment-report view and associated styling in resources/views and resources/css.
Reproduce the clipping behavior and identify the responsible size, overflow, or stacking rule.
Implement the smallest responsive layout correction in the existing UI surface.
Add focused regression coverage using the repository's established test patterns.
Review the resulting dialog at narrow and wide viewport sizes.

The comment-report dialog is visually clipped, preventing users from reliably viewing or submitting the report form. The issue is isolated to the presentation and responsive layout of the existing comment-report UI. ## Scope - Inspect the existing comment-report view and its associated CSS classes. - Adjust modal sizing, overflow, stacking, and responsive behavior so the complete dialog remains visible within the viewport. - Preserve the existing report submission and validation behavior. ## Acceptance Criteria - The complete comment-report dialog, including its fields, actions, and close control, is visible without being obscured by the backdrop or surrounding content. - The dialog remains usable on narrow and wide viewports without horizontal clipping. - The backdrop and dialog stacking order do not hide dialog content. - Existing report submission, cancellation, and validation behavior remains unchanged. ## Test Coverage Required - Add or update a feature test covering that the comment-report UI is rendered for the applicable comment action. - Add browser or view-level coverage for the dialog at a narrow viewport if the repository's existing test conventions support it. - Run the existing focused comment-related test coverage after implementation. ## Progress Checklist - [x] Locate the comment-report view and associated styling in resources/views and resources/css. - [x] Reproduce the clipping behavior and identify the responsible size, overflow, or stacking rule. - [x] Implement the smallest responsive layout correction in the existing UI surface. - [x] Add focused regression coverage using the repository's established test patterns. - [x] Review the resulting dialog at narrow and wide viewport sizes.

brave_2qXMjBLSPw.png

7.7 KiB

Veilor added the

Rows
Columns