Skip to content

bug: entire /settings navbar is clickable and redirects to main page in web #1031

@Zazzik1

Description

@Zazzik1

Describe the bug

Summary

On the /settings page (desktop version of browser UI), the top navigation bar contains the AIRI logo in the top-left corner that redirects to the main page /.

However, the issue is that the entire navbar area (a wide invisible box) acts as a link, not just the logo.

This means clicking anywhere within the navbar (not only on the logo/icon) triggers a redirect to the main page.

Steps to Reproduce

  1. Navigate to /settings https://airi.moeru.ai/settings
  2. Click outside of the "Welcome to AIRI!" modal to close it
  3. Click anywhere on the top navbar (outside the icon area)
  4. Observe that it redirects to the main page

Expected Behavior

Only the AIRI text and the icon should redirect to the main page.

(Or is the entire navbar intentionally designed to be clickable?)

Fix

This could be fixed by adding width: max-content to the styles of a element that wraps the logo.

Before

Image

After

Image

Additional Questions

This issue does not affect mobile devices, since the navbar is hidden there. Would it make sense to add a simple “Back” button on mobile for consistency, or are the browser navigation buttons enough to get back to the main page (the subpages on the settings page have similar "Back" buttons, but the main page doesn't have it on mobile)?

System Info

System:
    OS: Windows 11 10.0.26100
    CPU: (12) x64 AMD Ryzen 5 4600H with Radeon Graphics
    Memory: 5.23 GB / 15.37 GB
  Binaries:
    Node: 23.5.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.9.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 144.0.7559.133
    Edge: Chromium (140.0.3485.54)
    Internet Explorer: 11.0.26100.1882

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.

Contributions

  • I am willing to submit a PR to fix this issue
  • I am willing to submit a PR with failing tests (actually just go ahead and do it, thanks!)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions