Skip to content

Reports Search page: DateTime inputs overflow causing UI layout issues #3096

@srijan2607

Description

@srijan2607

What happened

On the Reports Search page (/search), the "End time" and "Errors" form fields are overlapping/overflowing horizontally. The datetime-local input fields are too wide for their container columns, causing them to extend beyond their boundaries and overlap with adjacent form elements.

Environment

  1. OS: macOS (also reproducible on other platforms)
  2. IntelOwl version: Latest develop branch (commit 2ef233e)

What did you expect to happen

The form fields in the Reports Search page should be properly contained within their respective columns without any overflow or overlapping. All datetime inputs should have consistent styling and fit within the responsive grid layout.

How to reproduce your issue

  1. Navigate to the IntelOwl web interface
  2. Go to ReportsSearch (or directly to /search)
  3. Observe the second row of form fields containing "Start time", "End time", and "Errors"
  4. Notice that the "End time" datetime inputs overflow into the "Errors" column area

Error messages and logs

No JavaScript errors in console. This is a CSS/layout issue only.

Screenshots

Image

Suggested Fix

  • Add maxWidth constraint to datetime-local inputs
  • Add overflow-hidden to the containing columns
  • Add flex-wrap to the row for better responsive behavior

Metadata

Metadata

Assignees

Labels

bugSomething isn't working

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions