Implement Dark Mode Feature #3

[rishyym0927]

Hello @AkhileshJyotishi , This is the pr for issues #3 Implement Dark Mode Feature #3 and these are the changes I have made index.html:

Added a dark mode toggle button outside the .notes div to enable users to switch between light and dark modes. Placed the button at the top right corner of the page for better accessibility. main.css:

Added styles for dark mode, defining the background color and text color for elements within the .dark-mode class. Styled the dark mode toggle button with appropriate padding, border radius, and hover effect. main.js:

Implemented functionality to toggle between light and dark modes when the dark mode toggle button is clicked. Defined a toggleDarkMode() function that toggles the dark-mode class on the body element to switch between light and dark mode. Added an event listener to the dark mode toggle button to trigger the toggleDarkMode() function on click. App.js:

No changes made in this file as the existing implementation manages the notes application's functionality and interactions. Testing:

Tested the dark mode toggle button functionality by clicking it to switch between light and dark modes. Verified that the styles update accordingly, ensuring a smooth transition between light and dark modes. Ensured that the dark mode toggle button is displayed correctly and functions as expected across different browsers and devices.

[AkhileshJyotishi]

@rishyym0927 The dark mode should also invert the notes writing section of app. Also the toggle button is incorrectly placed. Try to add screenshots or video of the changes you have made .

Thanks!