Seekra/frontend
3
2
Fork 0
generated from Seekra/repository-template
Code Issues 4 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Search bar below navbar #98

Closed
johannes.vos wants to merge 1 commits from bugfix/search-bar-below-navbar into main
pull from: bugfix/search-bar-below-navbar
merge into: Seekra:main
Conversation 2 Commits 1 Files Changed 2
+47 -7
johannes.vos commented 2026-06-01 17:11:31 +02:00
Member
Copy Link
Copy Source

Search bar below navbar (Bugfix)

I realize that the commit isn't safe; I'll fix the problem right away.

Goal

Move the Search bar below the navbar. -> when under 1000px.

Changes

Navbar.vue:

  1. Added @media (max-width: 1000px) to hide search bar from navbar on small screens

SearchResultsView.vue:

  1. Imported Searchbar component and added state management for search query
  2. Added .search-bar-container below navbar, hidden by default
  3. Added @media (max-width: 1000px) to show search bar container on small screens only
  4. Styling includes proper spacing, centering, and border separator

Link to Issue:

Place the search bar on the search results view below the navbar (#97)

# Search bar below navbar (Bugfix) **I realize that the commit isn't safe; I'll fix the problem right away.** ## Goal Move the Search bar below the navbar. -> when under 1000px. ## Changes ### Navbar.vue: 1. Added @media (max-width: 1000px) to hide search bar from navbar on small screens ### SearchResultsView.vue: 1. Imported Searchbar component and added state management for search query 2. Added .search-bar-container below navbar, hidden by default 3. Added @media (max-width: 1000px) to show search bar container on small screens only 4. Styling includes proper spacing, centering, and border separator ## Link to Issue: [Place the search bar on the search results view below the navbar (#97)](https://gitea.jcloud-services.ddns.net/Seekra/frontend/issues/97)
viewport-1000px.png
60 KiB
viewport-390px-average-width.png
53 KiB
viewport-1001px.png
60 KiB
viewport-1000px.png viewport-390px-average-width.png viewport-1001px.png
johannes.vos added this to the responsive-design-ready milestone 2026-06-01 17:11:31 +02:00
johannes.vos added the
type
bug
area
search-results
prio
critical
 labels 2026-06-01 17:11:31 +02:00
johannes.vos self-assigned this 2026-06-01 17:11:31 +02:00
johannes.vos added this to the MVP Frontend project 2026-06-01 17:11:31 +02:00
johannes.vos added 1 commit 2026-06-01 17:11:31 +02:00
refactor: update search bar visibility and layout for better responsiveness 65806b2d1b
johannes.vos moved this to Review in MVP Frontend on 2026-06-01 17:14:37 +02:00
jakob.scheid reviewed 2026-06-01 17:34:31 +02:00
src/features/nav/components/Navbar.vue
@@ -93,2 +94,4 @@
width: 70%;
}
@media (max-width: 1000px) {
jakob.scheid commented 2026-06-01 17:34:31 +02:00
Owner
Copy Link
Copy Source

That is not a major device width break.

That is not a major device width break.
johannes.vos commented 2026-06-01 18:17:13 +02:00
Author
Member
Copy Link
Copy Source

It‘s the critical width where it look bad

It‘s the critical width where it look bad
jakob.scheid commented 2026-06-01 18:30:35 +02:00
Owner
Copy Link
Copy Source

Please use 67.5rem (the width where tablets begin)

Please use `67.5rem` (the width where tablets begin)
jakob.scheid moved this to Done in MVP Frontend on 2026-06-01 18:03:49 +02:00
jakob.scheid closed this pull request 2026-06-01 18:03:54 +02:00
johannes.vos reopened this pull request 2026-06-01 18:16:23 +02:00
jakob.scheid reviewed 2026-06-01 18:31:43 +02:00
src/features/search/views/SearchResultsView.vue
@@ -37,0 +60,4 @@
border-bottom: 1px solid var(--border);
}
@media (max-width: 1000px) {
jakob.scheid commented 2026-06-01 18:31:43 +02:00
Owner
Copy Link
Copy Source

Please use 67.5rem (the width where tablets begin)

Please use `67.5rem` (the width where tablets begin)
johannes.vos closed this pull request 2026-06-01 18:44:24 +02:00

Pull request closed

This pull request cannot be reopened because the branch was deleted.
Sign in to join this conversation.
Reviewers
No Reviewers
jakob.scheid
Labels
Clear labels
area/global
area
search-results
area
settings
area
startpage
prio
critical
prio
high
prio
low
prio
medium
type
bug
type
chore
type
docs
type
feature
type
refactor
type
testing
type/urgent
No Label
area
search-results
prio
critical
type
bug
Milestone
No items
No Milestone responsive-design-ready
Projects
Clear projects
No project MVP Frontend
Assignees
Clear assignees
jakob.gregory (Jakob Gregory) jakob.scheid (Jakob Scheid) johannes.vos (Johannes D. Vos)
No Assignees johannes.vos
2 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Seekra/frontend#98
Delete Branch "bugfix/search-bar-below-navbar"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?