Note Taking App

Homepage displays a grid of note cards, each with a title, text (clamped to 6 lines), and Edit/Delete buttons in the top-right corner.

Clicking the Add button in the top-right corner opens the Add Note modal.

Add Note modal includes title and description fields, plus Cancel and Save buttons.

Clicking Cancel in the Add Note modal closes the modal.

Clicking Save in the Add Note modal closes the modal and adds the new note to the homepage grid.

Edit button on a note opens the Edit Note modal with pre-filled title and description fields.

Clicking Save in the Edit Note modal closes the modal and updates the note's title and description.

Clicking the Delete button on a note opens the Delete Confirmation dialog with a warning, title, and Cancel/Delete buttons.

Clicking Cancel in the Delete Confirmation dialog closes it without deleting the note.

Clicking Delete in the Delete Confirmation dialog removes the note and closes the dialog.

Clicking on a note opens the Read Note modal showing the title (top-left), description (center), and Edit, Delete, and Close buttons.

Clicking Edit in the Read Note modal opens the Edit modal; Delete opens the Delete Confirmation dialog.

The app is fully responsive for desktop and mobile screens.

Add a dark mode toggle for the application.

Implement a search bar to filter notes by title or text.

Support markdown formatting or include a WYSIWYG editor for note descriptions.

Save notes persistently using local storage or connect the app to a database.

Enable note sharing via a unique URL using the note's ID.

Add validation to the add/edit note forms with error messages