Refine Add Task dialog layout and advanced fields

[Rustix69]

Description

Improve the Add Task dialog UX in the Tasks view by widening the dialog, grouping related fields into clearly labeled sections, and refreshing the styling of advanced fields. The new layout keeps all fields visible in a single scrollable panel (no accordion), uses Cards for “Essential Fields”, “Dates”, and “Advanced Fields”, and enhances tags/annotations/dependencies/recurrence with clearer visuals and counts.

• Fixes: Improve Add Task Dialog UI/UX #391

Checklist

• Ran npx prettier --write . (for formatting)
• Ran gofmt -w . (for Go backend)
• Ran npm test (for JS/TS testing)
• Added unit tests, if applicable
• Verified all tests pass
• Updated documentation, if needed

Screenshot

Light Mode

Dark Mode

Mobile View

Additional Notes

• Due date now uses a DateTime picker with a clock indicator (“with time”) for clarity.
• Dialog uses a fixed header/footer with a scrollable middle section to keep actions always visible.
• Tags, annotations, dependencies, and recurrence are visually grouped in an “Advanced Fields” card with icons, color accents, and minimum heights to avoid cramped layouts.

[github-actions]

Thank you for opening this PR!

Before a maintainer takes a look, it would be really helpful if you could walk through your changes using GitHub's review tools.

Please take a moment to:

• Check the "Files changed" tab
• Leave comments on any lines for functions, comments, etc. that are important, non-obvious, or may need attention
• Clarify decisions you made or areas you might be unsure about and/or any future updates being considered.
• Finally, submit all the comments!

More information on how to conduct a self review:
https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/reviewing-changes-in-pull-requests/reviewing-proposed-changes-in-a-pull-request

This helps make the review process smoother and gives us a clearer understanding of your thought process.

Once you've added your self-review, we'll continue from our side. Thank you!

[Rustix69]

Redesigned the AddTaskDialog into a wider, scrollable layout that groups fields into clear sections: Essential Fields, Dates, and Advanced Fields, while keeping all existing behavior intact. The Due Date now clearly supports time, and advanced fields (tags, annotations, dependencies, recurrence) have more structured, visually distinct UIs with icons, counts, and better spacing. Tests were updated to match the new DOM structure so they still validate the same behaviors against the refreshed UI.

[Rustix69]

@its-me-abhishek Hey I had added the self review and all comments.

[its-me-abhishek]

@Rustix69 this looks great! The value cards for Annotations looks great, could you please do the same for tags? Also, I think we should stick to the tags-like view to show cards, instead of new headings like "Selected Annotations", "Selected Headings", etc. so as to save space.

[Rustix69]

@its-me-abhishek Now it looks more sleek thnks for the suggestion.

[its-me-abhishek]

Please fix these, moreover do add the latest desktop/mobile view screenshots for both Dark/Light Mode to the PR description!

[Rustix69]

@its-me-abhishek I had removed the comments also added the Dark/Light View in the Description of the PR.