github-starred/vikunja
2
0
Fork 0
mirror of https://github.com/go-vikunja/vikunja.git synced 2026-08-24 19:50:09 -05:00
Code Issues 690 Packages Projects Releases 13 Wiki Activity

[PR #2306] [MERGED] fix: collapse view buttons into dropdown when overflowing #4055

New Issue
Closed
opened 2026-03-22 15:00:21 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-03-22 15:00:21 -05:00
Owner
Copy Link
Copy Source

📋 Pull Request Information

Original PR: https://github.com/go-vikunja/vikunja/pull/2306
Author: @maggch97
Created: 2/26/2026
Status: ✅ Merged
Merged: 3/18/2026
Merged by: @kolaente

Base: main ← Head: user/weijiezhao/viewdropdown

📝 Commits (8)

  • 1818b68 fix: collapse view buttons into dropdown when overflowing
  • 0b2622e refactor: reuse inline buttons for overflow measurement
  • 17df066 fix: close view dropdown menu on item click
  • 059e948 fix: prevent inline buttons flash before dropdown appears
  • 7b429a2 fix: only hide view buttons during overflow check, not header slot
  • 008dc30 fix: prevent hidden view buttons from causing mobile scrollbar
  • d03bf38 Merge branch 'main' into user/weijiezhao/viewdropdown
  • d88a293 fix: prevent view button text from wrapping

📊 Changes

1 file changed (+101 additions, -1 deletions)

View changed files

📝 frontend/src/components/project/ProjectWrapper.vue (+101 -1)

📄 Description

Problem

When a project has many views, the view switcher buttons overflow the screen horizontally, making some views inaccessible.

Solution

Automatically detect when the view buttons would overflow the container and collapse them into a dropdown menu.

  • When buttons fit within the container → show inline buttons as before (no change in UX)
  • When buttons overflow → show a dropdown displaying the current view name with a chevron, clicking it reveals all views in a dropdown menu

Recording 2026-02-26 at 15 47 39

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/go-vikunja/vikunja/pull/2306 **Author:** [@maggch97](https://github.com/maggch97) **Created:** 2/26/2026 **Status:** ✅ Merged **Merged:** 3/18/2026 **Merged by:** [@kolaente](https://github.com/kolaente) **Base:** `main` ← **Head:** `user/weijiezhao/viewdropdown` --- ### 📝 Commits (8) - [`1818b68`](https://github.com/go-vikunja/vikunja/commit/1818b6831bd8abfbbcfd88eda7c7e2e28b9c3a34) fix: collapse view buttons into dropdown when overflowing - [`0b2622e`](https://github.com/go-vikunja/vikunja/commit/0b2622e97eea6861d5acf2e7debfb1b86e70bdd6) refactor: reuse inline buttons for overflow measurement - [`17df066`](https://github.com/go-vikunja/vikunja/commit/17df066b59e59871dd95556734162eb16b4a00ab) fix: close view dropdown menu on item click - [`059e948`](https://github.com/go-vikunja/vikunja/commit/059e9486d51e7b71c52df648381944a4c0067021) fix: prevent inline buttons flash before dropdown appears - [`7b429a2`](https://github.com/go-vikunja/vikunja/commit/7b429a2b8b6d72a24d77bb98c7ae93c2f7592944) fix: only hide view buttons during overflow check, not header slot - [`008dc30`](https://github.com/go-vikunja/vikunja/commit/008dc302d5c0a475999e69e130429f322d6c0d0d) fix: prevent hidden view buttons from causing mobile scrollbar - [`d03bf38`](https://github.com/go-vikunja/vikunja/commit/d03bf3868eae81e201eebf01dff62f2982a5f830) Merge branch 'main' into user/weijiezhao/viewdropdown - [`d88a293`](https://github.com/go-vikunja/vikunja/commit/d88a293419a3d418a73847eaddaab5688354d52f) fix: prevent view button text from wrapping ### 📊 Changes **1 file changed** (+101 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/components/project/ProjectWrapper.vue` (+101 -1) </details> ### 📄 Description **Problem** When a project has many views, the view switcher buttons overflow the screen horizontally, making some views inaccessible. **Solution** Automatically detect when the view buttons would overflow the container and collapse them into a dropdown menu. - When buttons fit within the container → show inline buttons as before (no change in UX) - When buttons overflow → show a dropdown displaying the current view name with a chevron, clicking it reveals all views in a dropdown menu ![Recording 2026-02-26 at 15 47 39](https://github.com/user-attachments/assets/4a6b74d8-6133-4f85-9bde-3ffc4f3e8756) --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-03-22 15:00:21 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
area/api
area/attachments
area/auth
area/avatars
area/backup-restore
area/caldav
area/calendar-view
area/comments
area/config
area/database
area/desktop
area/docker
area/email
area/favorites
area/filters
area/frontend
area/gantt
area/i18n
area/import-export
area/internal-code
area/kanban
area/labels
area/list-view
area/mobile
area/notifications
area/permissions
area/projects
area/pwa
area/recurring-tasks
area/reminders
area/search
area/shortcuts
area/subtasks
area/sync
area/table-view
area/task-editor
area/task-metadata
area/task-relations
area/teams
area/theming
area/time-tracking
area/typesense
area/views
area/webhooks
bug
changes requested
concern/accessibility
concern/performance
concern/regression
concern/ux
confirmed
db/mysql
dependencies
enhancement
good first issue
help wanted
integration/inbound
integration/outbound
kind/bug
kind/feature
needs reproduction
pull-request
Mirrored from GitHub Pull Request
 pull-request
Mirrored from GitHub Pull Request
 pull-request
Mirrored from GitHub Pull Request
 question
security
support
upstream issue
waiting for reply
wontfix
No labels pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
GiteaMirror ninjasurge (Kaehlen Rog)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/vikunja#4055