Skip to content

Quiz creation: Create jump-to-question button #11550

@nucleogenesis

Description

@nucleogenesis

Overview

In order to simplify the user's navigation of long lists of questions, the design calls for a "Jump to question" button that opens a scrollable KDropdownMenu that lists the questions and when the user clicks it, they see the question scrolled into focus before their very eyes.

Acceptance criteria

The scroll should be smooth but relatively quick. Be sure to use an easing function to soften the transition.

You may need to add refs to the accordion items so that you know where to scroll to -- or to have an element to which you can call focus(). Ideally, we will utilize anchor tags to stick with semantic HTML but so long as keyboard navigation works properly, should be good.

Note, then, that when keyboard navigating and selecting a question then your focus should immediately be placed on that accordion item's header (and the user only a spacebar/enter away from toggling it open)

Screen reader considerations

@radinamatic should be consulted on this insofar as we should decide if this is necessary at all for non-sighted users to have read out to them when the "scroll-to" is a particularly visual effect. Should this just be aria-hidden?

Metadata

Metadata

Assignees

No one assigned

    Labels

    APP: CoachRe: Coach App (lessons, quizzes, groups, reports, etc.)DEV: frontendP2 - normalPriority: Nice to have

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions