Theme

Story 3.4.2. RJ. Category top line

Written by

in

Content

General info

The Rocken Jobs Publications page includes a top line of categories for vacancies, positioned below the header. This category line remains sticky as the user scrolls down the page, ensuring easy navigation. The categories are scrollable horizontally and can also be navigated using left and right arrow icons for quick access. This functionality helps users quickly filter vacancies by specific categories without losing their place on the page.

Reference: https://www.fiverr.com/categories/video-animation?source=category_tree

User story

As a user
I want to have a visible category navigation line on the Publications page
So that I can easily find vacancies that match specific categories without losing the navigation options during scrolling.

Visual design:

https://www.figma.com/design/I5CXH7H3ICD0vfA1kPbcVf/ROCKEN-jobs-%2F-talent?node-id=54725-60818&t=1TTklKs8AAsmr4KG-4

 

#

Acceptance Criteria

 

01

Scenario: Category top line display
Given: Publications page is open
When: The page is viewed
Then: The category top line is visible below the header.

 image-20240926-152747.png

 

02

Scenario: Sticky category line
Given: Publications page is open
When: Scroll down the page
Then: The category top line remains sticky to the header.

 

 

03

Scenario: Scrollable categories
Given: Publications page with multiple categories
When: Categories exceed the visible area
Then: The user can scroll through the categories horizontally.

 

 

04

Scenario: Navigate using arrows
Given: Publications page with hidden categories
When: User clicks left or right arrow
Then: The hidden categories are revealed by scrolling left or right.

image-20240926-152932.png

05

Scenario: Filter vacancies by category
Given: Publications page is open
When: A category is clicked in the top line
Then: The vacancy list is filtered by the selected category without reloading the page.

 

Comments

Leave a Reply

More posts