fix(i18n): resolve Google Translate language persistence and navbar theme consistency

[kowshikramtg]

Summary

This PR resolves multiple issues in the Google Translate integration by introducing a single, reliable source of truth for language state, preventing unwanted language resets during page refreshes and route navigation, and improving the navigation bar's responsiveness and dark mode appearance.

---

Problems Addressed

Google Translate

• Fixed automatic language reset to English on page refresh.
• Fixed language selector becoming out of sync with the translated page.
• Removed duplicate translation triggers that caused race conditions and UI flickering.
• Preserved language selection across refreshes and route navigation.
• Prevented unnecessary localStorage writes.
• Ensured Google Translate initializes using the previously selected language.

Navigation UI

• Removed the floating language FAB.
• Introduced a shared language state for desktop and mobile navigation.
• Fixed dark mode navbar background rendering.
• Updated active navigation colors to match the application's teal theme.
• Improved navbar responsiveness to prevent overflow at normal browser zoom levels.

---

Technical Changes

Language Management

• Refactored LanguageSelector to eliminate duplicate applyLanguage() calls.
• Added an initial mount guard to prevent unnecessary translations during component initialization.
• Introduced helper methods for:
  • retrieving stored language
  • persisting language
  • managing Google Translate cookies
• Updated the early initialization script in index.html to correctly restore translation state before React loads.
• Consolidated translation updates into a single controlled effect.

Shared State

Introduced a centralized language context:

frontend/src/context/LanguageContext.jsx

This keeps both desktop and mobile language selectors synchronized with a single source of truth.

UI Improvements

• Removed the floating language selector.
• Improved navbar responsiveness.
• Fixed dark mode navbar background.
• Updated active navigation colors for better visual consistency.

---

Screenshots

---

Supported Languages

The language selector now supports 21 languages:

• English
• Hindi
• Kannada
• Tamil
• Telugu
• Malayalam
• Marathi
• Bengali
• Gujarati
• Punjabi
• Urdu
• French
• German
• Spanish
• Portuguese
• Italian
• Japanese
• Korean
• Chinese (Simplified)
• Arabic
• Russian

---

Validation

• English loads by default.
• Selected language persists after refresh.
• No automatic translation during page load.
• No automatic translation during route navigation.
• Desktop and mobile language selectors remain synchronized.
• Google Translate state restores correctly.
• Switching back to English restores the original content.
• Navbar remains responsive without overflow.
• Dark mode navbar styling is consistent.

---

Files Modified

• frontend/index.html
• frontend/src/App.jsx
• frontend/src/components/LanguageSelector.jsx
• frontend/src/components/Navigation.jsx
• frontend/src/context/LanguageContext.jsx
• frontend/src/index.css
• frontend/src/pages/Auth.jsx

---

Notes

This PR focuses on improving the reliability of the Google Translate integration while preserving the existing translation workflow. It also includes UI refinements to the navigation bar for improved responsiveness and a more consistent dark mode experience.

---

Closes #596

[vercel]

@kowshikramtg is attempting to deploy a commit to the Zuhani's projects Team on Vercel.

A member of the Team first needs to authorize it.

[kowshikramtg]

HI @Suhani1234-5

I'm happy to contribute to this repo once again. If this finds you right, i'd be glad. Please attach GSSOC'26 tags to this pr.

thank you.

[kowshikramtg]

Hi @Suhani1234-5

I'ld like to remind about the project update, and want to know reviews from your side.

Thankyou

[Suhani1234-5]

@kowshikramtg solve conflicts

[kowshikramtg]

hi @Suhani1234-5

I've resolved the conflicts, please verify and merge.

Thank you