feat(bank-project): Add Dark Mode, Custom Scrollbar, and Fix Transaction Rendering

[hitheswar77]

Description

Hello! I'm submitting a pull request to improve the user experience and accessibility of the Bank Project solution.

This PR introduces three key changes: two new UI features and one critical bug fix.

✨ Features & Enhancements
Dedicated Dark Mode Toggle:

Adds a theme toggle button to the Dashboard header, allowing users to switch between light and dark modes.

The preference is persisted using localStorage.

Implements the dark mode look using a new :root.dark-mode CSS color scheme, improving user comfort.

Custom Scrollbar Styling (UX):

Implements a custom style for the primary window scrollbar, making it more visually subtle and integrated with the app's color scheme.

🐛 Bug Fix
Fix Transaction History Rendering:

Fixes a bug where transactions were not appearing in the Dashboard table (due to how the DocumentFragment was handled).

The updateElement utility function in app.js has been refactored to correctly append complex DOM nodes (like the transaction rows) while still handling simple text updates (like the balance).

Includes basic date formatting in createTransactionRow for a cleaner display (YYYY-MM-DD to MM/DD/YYYY).

I have ensured all changes adhere to the project's original vanilla JavaScript, HTML, and CSS structure. Please let me know if any adjustments are required!
Please include a summary of the changes and the related issue. Please also include relevant motivation and context.

---------------------------------------------------------Hope this contribution is valid--------------------------------------------------

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)
• This change requires a documentation update

[hitheswar77]

@microsoft-github-policy-service agree