Enhance Notifications UI

[AyaNady17]

Description

This PR enhances the Notifications UI to make it more visually appealing and intuitive. The update includes improved spacing, rounded borders, background colors, and icons for each notification type to create a more modern look similar to real app notifications. Mock data has been added to populate the list with diverse examples.

Changes:

• Added card-like styling for each notification tile with rounded borders, padding, and shadow effects.
• Adjusted spacing for better readability, especially between avatar and text.
• Added icons for each notification type using a switch case, with color coding for quick identification.
• Updated background color of notification tiles to enhance visibility.
• Enhanced mock data to provide more variety in the notification list.

Type of Change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Refactor (does not change functionality, e.g., code style improvements, linting)
• Documentation update

How Has This Been Tested?

UI was tested by manually running the application and checking that the notification tiles render correctly with the updated styles, icons, and spacing. Adjusted mock data was used to confirm visual consistency across different notification types.

Screenshots:

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules
• I have checked my code and corrected any misspellings

Maintainer Checklist

• closes #xxxx (Replace xxxx with the GitHub issue number)
• Tag the PR with the appropriate labels