## Spec for "Divider Widget" Plugin...

A configurable Divider Widget widget that can be added to any web page

## Table of Contents​

- [Spec for "Divider Widget" Plugin...](#spec-for-%22divider-widget%22-plugin)
- [Table of Contents​](#table-of-contents%e2%80%8b)
- [Workflow](#workflow)
- [User Stories](#user-stories)
- [Screens / States​](#screens--states%e2%80%8b)
- [Sections Used](#sections-used)
- [Test Plan](#test-plan)

## Workflow

(N/A)​

## User Stories

As a user, I can...

- Choose from a selection of different divider styles and add it to a page.

## Screens / States​

![]()

## Sections Used

- Presets
- Width
- Position/Padding

## Test Plan

| √   | Scenario                                           | Expected                                                             |
| --- | -------------------------------------------------- | -------------------------------------------------------------------- |
| √   | When a user opens the [add new] tab                | A [Divider Widget] appears                                           |
| √   | When a user drags the Divider widget to the canvas | A simple Divider Widget appears                                      |
| √   | When a user clicks the [*] button on the widget    | The Divider Widget properties box appears                            |
| √   | When a user changes the layout (align, position)   | Divider settings adjust accordingly (both editor & live mode)        |
| √   | When a user configures the design (color, size)    | Divider settings adjust accordingly (both editor & live mode)        |
| √   | When a user publishes a page with the Divider      | The destination page shows the Divider as specified on the live page |
| x   | When a user chooses a preset                       | Divider settings overwrite to the preset settings                    |