## Spec for "Icon widget" Plugin...

A configurable Icon widget widget that can be added to any web page

## Table of Contents​

- [Spec for "Icon widget" Plugin...](#spec-for-icon-widget-plugin)
- [Table of Contents​](#table-of-contents)
- [Workflow](#workflow)
- [User Stories](#user-stories)
- [Screens / States​](#screens--states)
- [Sections Used](#sections-used)
- [Test Plan](#test-plan)

## Workflow

(N/A)​

## User Stories

As a user, I can...

- Have a selection of icons that I can add to a page and select a color to apply to that icon.

## Screens / States​

![](http://ambid-backups.s3.amazonaws.com/screenshots/---.png)

## Sections Used

- Icon Selector (icon source (material / fa) | search | list)
- Position/Padding
- (Font) Size, color
- Alignment

## Test Plan

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