|
Purpose: To make the first pane of Settings collapsible/expandable, similar to the search/filter pane in most apps
As a staff person working with Settings
I want to be able to collapse and expand the first pane that lists all of the Settings categories
So that I can have more screen-space for the other Settings panes
Scenarios
- Scenario 1
- Given the FOLIO Settings landing page
- When viewing the first pane that lists all of the Settings categories
- Then add a caret at the top of the pane, with tooltip text of Collapse pane
- Scenario 2
- Given the FOLIO Settings landing page
- When a user clicks the caret at the top of the first pane
- Then collapse the first pane
- And add a caret facing the opposite direction, with tooltip text of Expand pane
- Scenario 3
- Given the FOLIO Settings landing page
- When the first pane is collapsed
- And the user clicks the caret at the top of the pane
- Then expand the first pane
- And display the caret at the top of the pane, with tooltip text of Collapse pane
- Scenario 4
- Given the FOLIO Settings
- When viewing any of the Settings pages
- Then ensure that the collapse/expand caret and tooltip is displayed
See attached Invoice app screenshots as examples, plus mockups of the Settings landing page
Tooltip component: https://ux.folio.org/storybook/?selectedKind=Tooltip&selectedStory=Basic%20Usage&full=0&addons=1&stories=1&panelRight=0&addonPanel=REACT_STORYBOOK%2Freadme%2Fpanel
|