Bug: Invisible leaderboard toast overlay blocks navbar search after auto-dismiss

[Abhash-Chakraborty]

Description

After reloading the page, a toast notification appears saying:

Check out our latest leaderboard!

If the toast is closed manually using the x button, everything works normally.
But if the toast is not closed manually and is allowed to disappear automatically, the navbar search bar becomes unclickable.

From the screen recording, the toast visually disappears, but an invisible overlay/hitbox appears to remain on top of the navbar search area and blocks mouse clicks.

Reproduction Steps

1. Open or reload the website.
2. Wait for the toast saying Check out our latest leaderboard! to appear.
3. Do not close it manually.
4. Wait until the toast disappears by itself.
5. Try clicking the navbar search bar.

Expected Behavior

After the toast disappears, it should no longer block the page.
The navbar search bar should be clickable and should open/focus the search modal normally.

Actual Behavior

The toast disappears visually, but the search bar becomes unclickable.
It looks like an invisible overlay remains on top of the search bar.

Screen.Recording.2026-05-12.225506.mp4

Root Cause / Investigation

The issue seems to be in src/theme/Root.tsx and src/theme/Root.module.css.

In Root.tsx, the initial-load toast effect does this:

if (isInitialLoad) {
  setShowToast(true);
  timerRef.current = setTimeout(() => setShowToast(false), 10000);
  setIsInitialLoad(false);
}

[github-actions]

👤 Issue assigned to @Abhash-Chakraborty.

[sanjay-kv]

Good find @Abhash-Chakraborty

[github-actions]

✅ This issue has been closed. Thank you for your contribution!