.svg?width=180&height=50)
WidgetTestPage
Content!
Colors
Icons
Typography
Buttons
Form
Stepper
Table
Tabs
Tooltip
Accordions
Toast
Notify
Breadcrumbs
Common
Modal
Pagination
Colors
Click on the color item to copy color path
Werner Icons
Mobius Icons
Typography
H1 – Roboto ; 700 ; Font-Size: 28px ; Line-Height: 36px ; Margin-Bottom: 20px
H2 – Roboto ; 700 ; Font-Size: 24px ; Line-Height: 32px ; Margin-Bottom: 16px
H3 – Roboto ; 700 ; Font-Size: 20px ; Line-Height: 28px ; Margin-Bottom: 12px
H4 – Roboto ; 700 ; Font-Size: 18px ; Line-Height: 26px ; Margin-Bottom: 8px
H5 – Roboto ; 700 ; Font-Size: 16px ; Line-Height: 22px ; Margin-Bottom: 8px
H6 – Roboto ; 500 ; Font-Size: 14px ; Line-Height: 16px ; Margin-Bottom: 8px
H2 : Special – Roboto ; 700 ; Font-Size: 24px ; Line-Height: 32px ; Margin-Bottom: 16px
Body Copy : Regular
Roboto : 400 : Font-Size 16px : Line-Height: 26px ; Margin-Bottom: 16px Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Bulleted Lists
- Unordered List Item
- Unordered List Item w/ Sub-List
- Unordered Sub-List Item
- Unordered Sub-List Item
- Unordered List Item
- Unordered List Item
Numbered Lists
- Numbered List Item
- Numbered List Item w/ Sub-List
- Numbered Sub-List Item
- Numbered Sub-List Item
- Numbered List Item
- Numbered List Item
Primary Button
Secondary Button
Tertiary Button
Upload File Button
Upload a File
TextField
Error
TextArea
Select
DatePicker
//
//
0//
Checkbox
Radio
Dynamic Dropdown
show options
Qty Field
Stepper
1Customer & Shipping Address
2Shippings & Carriers
3Payment Information
4Review & Confirm Order
Step 1
Table
| Ship To | Order Total | reorder | ||||
|---|---|---|---|---|---|---|
| 1/5/2018 | 1234504 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Submitted | 10000 | $805.92 | |
| 1/4/2018 | 1234503 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Shipped | 10000 | $44.01 | |
| 1/3/2018 | 1234502 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | RMA | 10000 | $123.45 | |
| 1/2/2018 | 1234501 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Complete | 10000 | $44.01 | |
| 1/1/2018 | 1234500 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Complete | 10000 | $123.45 |
Tabs
Selected
Tab 2
Tab3
Selected
Tab 2
Tab3
Tooltip
Tooltip with long text and default icon
Tooltip with custom icon
Tooltip with trigger component -
Accordions
Small Like in PLP
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
Large Like in PDP
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
Toast
Notify
Success Notification:Additional Copy Goes Here
Danger Notification:Additional Copy Goes Here
Info Notification:Additional Copy Goes Here
Warning Notification:Additional Copy Goes Here
Short Breadcrumbs
Long Breadcrumbs
Spinner
Tags
Test Tag
Test Tag - deletable
To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
Overflow menu
Modal
Pagination
| Invoice Number | Invoice Date | Terms | Due Date | Ship To / Pick Up | Status | Invoice Total | Current Balance |
|---|---|---|---|---|---|---|---|
| 0001066 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $66.00 | $0.00 |
| 0102082 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $164.00 | $0.00 |
| 0201080 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $80.00 | $0.00 |
| 0301095 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $95.00 | $0.00 |
| 0401047 | 7/20/2020 | Net 30 | 8/20/2020 | Edina Warehouse 1 | open | $47.00 | $47.00 |
| 0502011 | 8/14/2019 | Net 30 | 8/20/2020 | Edina Warehouse 1 | overdue | $22.00 | $11.00 |
| 0601033 | 7/20/2020 | Net 30 | 8/20/2020 | Edina Warehouse 1 | overdue | $33.00 | $33.00 |
| 0701024 | 7/20/2020 | Net 30 | 8/20/2020 | Edina Warehouse 1 | overdue | $24.00 | $24.00 |
| 0801062 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $62.00 | $0.00 |
| 0902079 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $158.00 | $0.00 |
Subscribe
Keep up-to-date on product news and the latest offers.