indieweb / indieweb/wiki

"Personal tools" dropdown (... button) is invisible on desktop despite toggling correctly

Open Beginner friendly
#54 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
No language data
Stars
30
Forks
8
PR merge metrics
No merged PRs in 30d

Description

## Steps to Reproduce
1. Visit https://indieweb.org on a desktop browser (tested on Chrome, Safari, and macOS)
2. Ensure the viewport is ≥720px wide
3. Click the ⋯ (three-dot) button to the right of the "Log in" button in the top nav

## Observed Behavior
A small visual artifact appears briefly but no dropdown content is visible. Inspecting the DOM confirms:
- `aria-expanded` correctly flips to `true` on click
- `vector-dropdown-content` is present in the DOM and populated (login link, menu items)
- No console errors are thrown

## Expected Behavior
A dropdown menu should appear with personal tools options (e.g. login link).

## Root Cause
A media query in `load.php` unconditionally hides `.user-links-collapsible-item` at ≥720px with no exception for the expanded state:

```css
@media screen and (min-width: 720px) {
.vector-user-menu .user-links-collapsible-item {
display: none;
}
}
```

## Suggested Fix
Since the "Log in" button is already visible in the nav at ≥720px, the ⋯ button is redundant at that breakpoint. The simplest fix is to hide `#vector-user-links-dropdown-label` at ≥720px rather than patching the dropdown visibility logic.

Contributor guide

No contributing guide indexed for this repository

Research direction

Start in load.php by inspecting the desktop media query for .user-links-collapsible-item and the #vector-user-links-dropdown-label element. Verify the navigation at viewports below and above 720px, then confirm that the redundant three-dot control is hidden at desktop widths while the visible Log in button remains available.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
88/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.