Skip to content

Conversation

@AKASHDHARDUBEY
Copy link

Summary

This PR implements a Dark/Light theme toggle for the Landing Page to improve accessibility and user experience, addressing issue #675.

Changes

  • Configuration: Enabled darkMode: 'class' in tailwind.config.js.
  • State Management: Created ThemeContext to manage theme state and persist user preference in localStorage.
  • Components:
    • Added ThemeToggle component with Sun/Moon icons.
    • Integrated the toggle into the Navbar (responsive for both desktop and mobile).
  • Styling: Applied dark: variant classes to the LandingPage to ensure proper contrast and aesthetics in dark mode.

Verification

  • The theme toggle works instantly when clicked.
  • User preference is saved to localStorage and persists on reload.
  • Defaults to system preference if no user setting is found.
  • Verified UI consistency in both Light and Dark modes.

Issues

Fixes #675

@vercel
Copy link

vercel bot commented Dec 4, 2025

@AKASHDHARDUBEY is attempting to deploy a commit to the dottle's projects Team on Vercel.

A member of the Team first needs to authorize it.

@1ilit 1ilit closed this Dec 5, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[FEATURE] Implement Dark/Light Theme Toggle on Landing Page

2 participants