Slats
Default Example
Sample Company Alias consequatur aut perferendis sit
Enabled, 5 Users- Company ID:
- 153011
- Created:
- 03/29/2013
- Domain:
- sample-domain.com Verified
|
|
<div class="adb-container"> <div class="adb-container_header adb-container_header__actionable adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__sq_small"> <img class="adb-id--img" src="../../images/avatars/yarunLuon-72x72.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> Sample Company Voluptatem accusantium doloremque aperiam eaque </h3> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Enabled, 5 Users </span> </div> <menu class="adb-slat--column adb-slat--toolbar adb-toolbar"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Make Purchase </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Join Company </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Verify Email Domain </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Disable Company </a> </li> </ul> </div> </menu> </menu> </div> <div class="adb-slat"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Company ID:</dt> <dd>153011</dd> </div> <div class="adb-description_line"> <dt>Created:</dt> <dd>03/29/2013</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Company Access:</dt> <dd>Marketplace Admin</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Company Access</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="company-option7"> <span class="adb-selector--input"> <input id="company-option7" name="company-access" type="checkbox"> </span> <span class="adb-selector--value"> Vendor on Marketplace </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="company-option8"> <span class="adb-selector--input"> <input checked id="company-option8" name="company-access" type="checkbox"> </span> <span class="adb-selector--value"> Marketplace Admin </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> <div class="adb-description_line"> <dt>Default User Role:</dt> <dd>Vendor</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Default User Role</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-radio" for="company-option5"> <span class="adb-selector--input"> <input id="company-option5" name="company-user-role" type="radio"> </span> <span class="adb-selector--value"> User </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-radio" for="company-option6"> <span class="adb-selector--input"> <input checked id="company-option6" name="company-user-role" type="radio"> </span> <span class="adb-selector--value"> Vendor </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> </td> <td> <div class="adb-description_line"> <dt>Domain:</dt> <dd> <a> sample-domain.com </a> <span class="adb-badge adb-badge__success"> Verified </span> </dd> </div> <div class="adb-description_line"> <dt>Tax Rate:</dt> <dd>10%</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Tax Rate</legend> </div> <div class="adb-tooltip_form--field"> <input max="100" min="0" type="number" value="10"> <span class="adb-affix">%</span> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> </td> </tr> </tbody> </table> </dl> </div> <div class="adb-slat"> <div class="adb-stats adb-stats__horizontal"> <div class="adb-stat"> <span class="adb-stat--value">23</span> <span class="adb-stat--unit">Free Trials</span> </div> <div class="adb-stat"> <span class="adb-stat--value">534</span> <span class="adb-stat--unit">Expired Trials</span> </div> <div class="adb-stat"> <span class="adb-stat--value">500,384</span> <span class="adb-stat--unit">Purchased</span> </div> <div class="adb-stat"> <span class="adb-stat--value">3</span> <span class="adb-stat--unit">Canceled</span> </div> <div class="adb-stat"> <span class="adb-stat--value">1,493</span> <span class="adb-stat--unit">Unpaid Invoices</span> </div> <div class="adb-stat"> <span class="adb-stat--value">$10M</span> <span class="adb-stat--unit">Total Spent</span> </div> </div> </div> </div>
Open Slats
Slats with no outer borders.
Business Operations Bundle
Product 2 of 2
<div class="adb-slats"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column" style="padding-left: 0;"> <div class="adb-id_group adb-id_group__linked"> <span class="adb-id adb-id__logo adb-id__sq_small adb-id_group--item"> <img class="adb-id--img" src="../../images/logos/apps/msoffice-72x72.png?1567620427" /> </span> <span class="adb-id adb-id__logo adb-id__sq_small adb-id_group--item"> <img class="adb-id--img" src="../../images/logos/apps/googleapps-72x72.png?1567620427" /> </span> </div> </div> <div class="adb-slat--content adb-slat--column adb-slat--column--centered adb-summary"> <h1 class="adb-summary--title adb-title--secondary"> Business Operations Bundle </h1> <h6 class="adb-summary--details"> Product 2 of 2 </h6> </div> </div> </div>
2 Reviews
ACME is Great Featured
Ipsa quae ab illo inventore. veritatis et quasi architecto beatae. vitae dicta sunt explicabo aspernatur. aut odit aut fugit sed. quia consequuntur magni dolores eos
Neque dolorem ipsum quia dolor. sit amet consectetur adipisci velit. sed quia non numquam eius. modi tempora incidunt ut labore. et dolore magnam aliquam quaerat
Veniam quis nostrum exercitationem ullam. corporis nemo enim ipsam voluptatem. quia voluptas sit suscipit laboriosam. nisi ut aliquid ex ea. commodi consequatur quis autem vel
Eum iure reprehenderit qui in
<h2>2 Reviews</h2> <section class="adb-container__open"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id__open adb-id__sq_medium"> <i class="adb-id--placeholder adb-icon__user"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> ACME is Great <span class="adb-badge adb-badge__promo"> Featured </span> </h3> <div class="adb-rating adb-rating__xlarge"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> </div> <p> Ea voluptate velit esse quam. nihil molestiae et iusto odio. dignissimos ducimus qui blanditiis praesentium. laudantium totam rem voluptatum deleniti. atque corrupti quos dolores et </p> <p class="adb-caption"> Quas molestias excepturi sint occaecati </p> <p class="adb-caption"> <a data-target="#review-comments" data-toggle="panel">Show 2 Comments</a> · <a data-target="#review-comment" data-toggle="panel">Comment</a> · <a>Edit</a> · <a>Delete</a> </p> <form action="" class="adb-form adb-form__comment adb-js-panel-target" id="review-comment"> <fieldset> <h4> <legend>Comment on Review</legend> </h4> <div class="adb-form--field"> <textarea id="review-comment-content" maxlength="2048" placeholder="Write your comments here."></textarea> </div> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Submit Comment </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="modal" type="button"> Cancel </button> </menu> </fieldset> </form> <div class="adb-js-panel-target adb-slats" id="review-comments"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id__open adb-id__sq_medium"> <img class="adb-id--img" src="../../images/avatars/nathanRomero-120x120.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column"> <p> Cupiditate non provident sed ut. perspiciatis unde omnis iste natus. error similique sunt in culpa. qui officia deserunt mollitia animi. id est laborum et dolorum </p> <p class="adb-caption"> Fuga et harum quidem rerum · <a>Delete</a> </p> </div> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id__open adb-id__sq_medium"> <i class="adb-id--placeholder adb-icon__user"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <p> Facilis est et expedita distinctio. nam libero tempore cum soluta. nobis est eligendi optio cumque. nihil impedit quo porro quisquam. est qui minus id quod </p> <p class="adb-subtitle"> Maxime placeat facere possimus omnis </p> </div> </div> </div> </div> </div> </section>
Profile Card
Simple Style
<div class="adb-container"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__sq_small"> <img class="adb-id--img" src="../../images/avatars/yarunLuon-72x72.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> Kerry Hill </h3> <dl class="adb-summary--details"> <div class="adb-description_line"> <dt>Email:</dt> <dd> <a> lorenzo-song@yahoo.com </a> </dd> </div> <div class="adb-description_line"> <dt>Created:</dt> <dd>8/26/13</dd> </div> <div class="adb-description_line"> <dt>User ID:</dt> <dd>153011</dd> </div> <div class="adb-description_line"> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Active </span> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Enabled </span> </div> </dl> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Make Purchase </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Join Company </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Verify Email Domain </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Disable Company </a> </li> </ul> </div> </menu> </menu> </div> </div>
Header Style
Sample Company Voluptas assumenda est omnis dolor
- Created:
- 8/26/13
- Company ID:
- 153011
<div class="adb-container"> <div class="adb-container_header adb-container_header__actionable adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__logo adb-id__sq_small"> <img class="adb-id--img" src="../../images/logos/appdirect/square/ad-48x48.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> Sample Company Repellendus temporibus autem quibusdam et </h3> <dl class="adb-summary--details"> <div class="adb-description_line"> <dt>Created:</dt> <dd>8/26/13</dd> </div> <div class="adb-description_line"> <dt>Company ID:</dt> <dd>153011</dd> </div> <div class="adb-description_line"> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Verified Email Domain </span> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Enabled </span> </div> </dl> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Make Purchase </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Join Company </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Verify Email Domain </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Disable Company </a> </li> </ul> </div> </menu> </menu> </div> </div>
Simple Style
Justice Hamilton
<div class="adb-container"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__sq_small"> <img class="adb-id--img" src="../../images/avatars/yarunLuon-72x72.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> Doris Bender </h3> <div class="adb-summary--details"> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Active </span> </div> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Make Purchase </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Join Company </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Verify Email Domain </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Disable Company </a> </li> </ul> </div> </menu> </menu> </div> </div>
Header Style
Sample Company Aut consequatur vel illum qui
<div class="adb-container"> <div class="adb-container_header adb-container_header__actionable adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__logo adb-id__sq_small"> <img class="adb-id--img" src="../../images/logos/appdirect/square/ad-48x48.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> Sample Company Dolorem eum fugiat quo voluptas </h3> <div class="adb-summary--details"> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Enabled, 5 Users </span> </div> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Make Purchase </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Join Company </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Verify Email Domain </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="#"> Disable Company </a> </li> </ul> </div> </menu> </menu> </div> </div>
Attributes
- Edition:
- Gold Edition
- Monthly Fee:
- $199.99
- Owner:
- Raul Wagner
- Access Rights:
- View, Manage
- Usage:
- Unlimited
|
|
|
<div class="adb-slat"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Edition:</dt> <dd>Gold Edition</dd> </div> <div class="adb-description_line"> <dt>Monthly Fee:</dt> <dd> <a href="#">$199.99</a> </dd> </div> </td> <td> <div class="adb-description_line"> <dt>Owner:</dt> <dd> <a> Liliana McLaughlin </a> </dd> </div> <div class="adb-description_line"> <dt>Access Rights:</dt> <dd>View, Manage</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Usage:</dt> <dd> Unlimited </dd> </div> </td> </tr> </tbody> </table> </dl> </div>
Editable Attributes
- Company Access
- Default User Role
- Domain:
- sample-domain.com
- Tax Rate:
- %
|
|
|
- Selected Company
-
- Company Roles
- Product Roles
- Marketplace Roles
|
|
|
<div class="adb-container"> <div class="adb-slat"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <dt>Company Access</dt> <dd> <label class="adb-selector adb-js-checkbox" for="company-option1"> <span class="adb-selector--input"> <input id="company-option1" type="checkbox"> </span> <span class="adb-selector--value"> Vendor on Marketplace </span> </label> <label class="adb-selector adb-js-checkbox" for="company-option2"> <span class="adb-selector--input"> <input id="company-option2" type="checkbox"> </span> <span class="adb-selector--value"> Marketplace Admin </span> </label> </dd> </td> <td> <dt>Default User Role</dt> <dd> <label class="adb-selector adb-js-radio" for="company-option3"> <span class="adb-selector--input"> <input id="company-option3" name="company-user-role" type="radio"> </span> <span class="adb-selector--value"> User </span> </label> <label class="adb-selector adb-js-radio" for="company-option4"> <span class="adb-selector--input"> <input checked id="company-option4" name="company-user-role" type="radio"> </span> <span class="adb-selector--value"> Vendor </span> </label> </dd> </td> <td> <div class="adb-description_line"> <dt>Domain:</dt> <dd>sample-domain.com</dd> </div> <div class="adb-description_line"> <dt>Tax Rate:</dt> <dd> <input max="100" min="0" type="number" value="10"> <span class="adb-affix">%</span> </dd> </div> </td> </tr> </tbody> </table> </dl> </div> <div class="adb-slat"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <dt>Selected Company</dt> <dd> <div class="adb-js-dropdown adb-dropdown adb-dropdown__small"> <select id="company" name="company"> <option>Sample Company</option> <option>Another Company</option> </select> </div> <p class="font-small"> <a href="../../prototype/channel/marketplace/company_detail.html">View Sample Company Profile </a> </p> </dd> </td> <td> <dt>Company Roles</dt> <dd> <label class="adb-selector adb-js-checkbox" for="billing-admin"> <span class="adb-selector--input"> <input checked id="billing-admin" type="checkbox"> </span> <span class="adb-selector--value"> Billing Admin </span> </label> <label class="adb-selector adb-js-checkbox" for="system-admin"> <span class="adb-selector--input"> <input checked id="system-admin" type="checkbox"> </span> <span class="adb-selector--value"> System Admin </span> </label> </dd> <dt>Product Roles</dt> <dd> <label class="adb-selector adb-js-checkbox" for="tester"> <span class="adb-selector--input"> <input checked id="tester" type="checkbox"> </span> <span class="adb-selector--value"> Tester </span> </label> </dd> </td> <td> <dt>Marketplace Roles</dt> <dd> <label class="adb-selector adb-js-checkbox" for="product-support"> <span class="adb-selector--input"> <input checked id="product-support" type="checkbox"> </span> <span class="adb-selector--value"> Product Support </span> </label> <label class="adb-selector adb-js-checkbox" for="sales-support"> <span class="adb-selector--input"> <input checked id="sales-support" type="checkbox"> </span> <span class="adb-selector--value"> Sales Support </span> </label> <label class="adb-selector adb-js-checkbox" for="support"> <span class="adb-selector--input"> <input checked id="support" type="checkbox"> </span> <span class="adb-selector--value"> Support </span> </label> <label class="adb-selector adb-js-checkbox" for="admin"> <span class="adb-selector--input"> <input checked id="admin" type="checkbox"> </span> <span class="adb-selector--value"> Admin </span> </label> </dd> </td> </tr> </tbody> </table> </dl> </div> </div>
Editable Attributes
- Company ID:
- 153011
- Created:
- 03/29/2013
- Domain:
- sample-domain.com Verified
|
|
- Email:
- eliseraynor@hotmail.com
- User ID:
- 153011
- Created:
- 08/26/2013
- Company:
- Sample Company
|
|
<div class="adb-container"> <div class="adb-slat"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Company ID:</dt> <dd>153011</dd> </div> <div class="adb-description_line"> <dt>Created:</dt> <dd>03/29/2013</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Company Access:</dt> <dd>Marketplace Admin</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Company Access</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="company-option17"> <span class="adb-selector--input"> <input id="company-option17" name="company-access" type="checkbox"> </span> <span class="adb-selector--value"> Vendor on Marketplace </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="company-option18"> <span class="adb-selector--input"> <input checked id="company-option18" name="company-access" type="checkbox"> </span> <span class="adb-selector--value"> Marketplace Admin </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> <div class="adb-description_line"> <dt>Default User Role:</dt> <dd>Vendor</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Default User Role</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-radio" for="company-option15"> <span class="adb-selector--input"> <input id="company-option15" name="company-user-role" type="radio"> </span> <span class="adb-selector--value"> User </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-radio" for="company-option16"> <span class="adb-selector--input"> <input checked id="company-option16" name="company-user-role" type="radio"> </span> <span class="adb-selector--value"> Vendor </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> </td> <td> <div class="adb-description_line"> <dt>Domain:</dt> <dd> <a> sample-domain.com </a> <span class="adb-badge adb-badge__success"> Verified </span> </dd> </div> <div class="adb-description_line"> <dt>Tax Rate:</dt> <dd>10%</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Tax Rate</legend> </div> <div class="adb-tooltip_form--field"> <input max="100" min="0" type="number" value="10"> <span class="adb-affix">%</span> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> </td> </tr> </tbody> </table> </dl> </div> <div class="adb-slat"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Email:</dt> <dd> <a href="#">johnnywoodard@email.com</a> </dd> </div> <div class="adb-description_line"> <dt>User ID:</dt> <dd>153011</dd> </div> <div class="adb-description_line"> <dt>Created:</dt> <dd>08/26/2013</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Company:</dt> <dd> <a href="../../prototype/channel/marketplace/company_detail.html">Sample Company</a> </dd> </div> <div class="adb-description_line"> <dt>Company Roles:</dt> <dd>System Admin</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Company Roles</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option7"> <span class="adb-selector--input"> <input id="user-option7" name="user-company-roles" type="checkbox"> </span> <span class="adb-selector--value"> Billing </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option8"> <span class="adb-selector--input"> <input checked id="user-option8" name="user-company-roles" type="checkbox"> </span> <span class="adb-selector--value"> System Admin </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> </td> <td> <div class="adb-description_line"> <dt>Product Roles:</dt> <dd>Tester</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Product Roles</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option9"> <span class="adb-selector--input"> <input checked id="user-option9" name="user-product-roles" type="checkbox"> </span> <span class="adb-selector--value"> Tester </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> <div class="adb-description_line"> <dt>Marketplace Roles:</dt> <dd>Product Support, Sales Support</dd> <a class="adb-link adb-link__action" data-event="click" data-toggle="dialog" href="#"> Edit </a> <form action="" class="adb-tooltip_form adb-js-dialog"> <fieldset class="adb-tooltip_form--fieldset"> <div class="adb-tooltip_form--legend"> <legend>Company Roles</legend> </div> <div class="adb-tooltip_form--field"> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option10"> <span class="adb-selector--input"> <input checked id="user-option10" name="user-channel-roles" type="checkbox"> </span> <span class="adb-selector--value"> Product Support </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option11"> <span class="adb-selector--input"> <input checked id="user-option11" name="user-channel-roles" type="checkbox"> </span> <span class="adb-selector--value"> Sales Support </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option12"> <span class="adb-selector--input"> <input id="user-option12" name="user-channel-roles" type="checkbox"> </span> <span class="adb-selector--value"> Support </span> </label> <label class="adb-selector adb-selector__button adb-button adb-button__neutral adb-button__medium adb-js-checkbox" for="user-option13"> <span class="adb-selector--input"> <input id="user-option13" name="user-channel-roles" type="checkbox"> </span> <span class="adb-selector--value"> Admin </span> </label> </div> </fieldset> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Save </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="dialog" type="button"> Cancel </button> </menu> </form> </div> </td> </tr> </tbody> </table> </dl> </div> </div>
Nested Slats
- Edition:
- Gold Edition
- Monthly Fee:
- $199.99
- Owner:
- Moses Desai
- Access Rights:
- View, Manage
- Usage:
- Unlimited
|
|
|
- Edition:
- Free Trial Edition
- Monthly Fee:
- $199.99
- Owner:
- Davion Wallace
- Access Rights:
- View
- Usage:
- 20 out of 25 users
|
|
80%
|
<div class="adb-container"> <div class="adb-slat"> <div class="adb-slat--row"> <div class="adb-slat--image adb-slat--column"> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_small" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/sendgrid-72x72.png?1567620427" /> </a> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> <a data-truncate="line" href="../../prototype/account/product.html">SendGrid </a> </h3> <div class="adb-summary--details"> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Active </span> </div> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Upgrade Edition </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/assign.html">Assign Users </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/product.html">View Payment History </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="/">Request Access </a> </li> </ul> </div> </menu> </menu> </div> <div class="adb-slat--row"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Edition:</dt> <dd>Gold Edition</dd> </div> <div class="adb-description_line"> <dt>Monthly Fee:</dt> <dd> <a href="#">$199.99</a> </dd> </div> </td> <td> <div class="adb-description_line"> <dt>Owner:</dt> <dd> <a> Penny Lawrence </a> </dd> </div> <div class="adb-description_line"> <dt>Access Rights:</dt> <dd>View, Manage</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Usage:</dt> <dd>Unlimited</dd> </div> </td> </tr> </tbody> </table> </dl> </div> </div> <div class="adb-slat"> <div class="adb-slat--row"> <div class="adb-slat--image adb-slat--column"> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_small" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/wordpress-72x72.png?1567620427" /> </a> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> <a data-truncate="line" href="../../prototype/account/product.html">Wordpress </a> </h3> <div class="adb-summary--details"> <span class="adb-status adb-status__active"> <span class="adb-status--gem"></span> Free Trial </span> </div> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Upgrade Edition </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/assign.html">Assign Users </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/product.html">View Payment History </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="/">Request Access </a> </li> </ul> </div> </menu> </menu> </div> <div class="adb-slat--row"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Edition:</dt> <dd>Free Trial Edition</dd> </div> <div class="adb-description_line"> <dt>Monthly Fee:</dt> <dd> <a href="#">$199.99</a> </dd> </div> </td> <td> <div class="adb-description_line"> <dt>Owner:</dt> <dd> <a> Mohammed Griffin </a> </dd> </div> <div class="adb-description_line"> <dt>Access Rights:</dt> <dd>View</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Usage:</dt> <dd>20 out of 25 users</dd> <br> <div class="adb-js-meter adb-meter" data-percent="80" data-toggle="tooltip" title="You can assign 5 more users"> <span class="adb-meter--percent">80%</span> </div> </div> </td> </tr> </tbody> </table> </dl> </div> </div> </div>
- Edition:
- Gold Edition
- Monthly Fee:
- $199.99
- Owner:
- Harvey Dougherty
- Access Rights:
- View, Manage
- Usage:
- Unlimited
|
|
|
Your subscription to this product has expired. Renew your subscription.
- Edition:
- Free Trial Edition
- Monthly Fee:
- $199.99
- Owner:
- Sheryl Powers
- Access Rights:
- View
- Usage:
- 20 out of 25 users
|
|
80%
|
Your cancel request for this product is in process. Once the process is complete, this product will be removed.
<div class="adb-container"> <div class="adb-slat adb-is-disabled"> <div class="adb-slat--row"> <div class="adb-slat--image adb-slat--column"> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_small" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/sendgrid-72x72.png?1567620427" /> </a> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> <a data-truncate="line" href="../../prototype/account/product.html">SendGrid </a> </h3> <div class="adb-summary--details"> <span class="adb-status adb-status__error"> <span class="adb-status--gem"></span> Expired </span> </div> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Upgrade Edition </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/assign.html">Assign Users </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/product.html">View Payment History </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="/">Request Access </a> </li> </ul> </div> </menu> </menu> </div> <div class="adb-slat--row"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Edition:</dt> <dd>Gold Edition</dd> </div> <div class="adb-description_line"> <dt>Monthly Fee:</dt> <dd> <a href="#">$199.99</a> </dd> </div> </td> <td> <div class="adb-description_line"> <dt>Owner:</dt> <dd> <a> Hudson May </a> </dd> </div> <div class="adb-description_line"> <dt>Access Rights:</dt> <dd>View, Manage</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Usage:</dt> <dd>Unlimited</dd> </div> </td> </tr> </tbody> </table> </dl> </div> <div class="adb-local_alert adb-local_alert__error adb-slat--alert"> <div class="adb-local_alert--content"> <p> Your subscription to this product has expired. <a class="adb-local_alert--link">Renew your subscription.</a> </p> </div> </div> </div> <div class="adb-slat adb-is-disabled"> <div class="adb-slat--row"> <div class="adb-slat--image adb-slat--column"> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_small" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/wordpress-72x72.png?1567620427" /> </a> </div> <div class="adb-slat--content adb-slat--column adb-summary"> <h3 class="adb-summary--title"> <a data-truncate="line" href="../../prototype/account/product.html">Wordpress </a> </h3> <div class="adb-summary--details"> <span class="adb-status adb-status__pending"> <span class="adb-status--gem"></span> Pending </span> </div> </div> <menu class="adb-slat--toolbar adb-toolbar adb-slat--column"> <button class="adb-button__emphasis adb-toolbar--item" type="button"> Upgrade Edition </button> <menu class="adb-js-context_menu adb-context_menu adb-toolbar--item" data-placement="right"> <button class="adb-js-context_menu--trigger adb-context_menu--trigger" type="button"> Manage </button> <div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu"> <ul class="adb-stack"> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/assign.html">Assign Users </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="../../prototype/account/product.html">View Payment History </a> </li> <li class="adb-stack--item"> <a class="adb-link__option adb-stack--item_content" href="/">Request Access </a> </li> </ul> </div> </menu> </menu> </div> <div class="adb-slat--row"> <dl class="adb-description_table"> <table> <colgroup> <col width="33.33%"> <col width="33.33%"> <col width="33.33%"> </colgroup> <tbody> <tr> <td> <div class="adb-description_line"> <dt>Edition:</dt> <dd>Free Trial Edition</dd> </div> <div class="adb-description_line"> <dt>Monthly Fee:</dt> <dd> <a href="#">$199.99</a> </dd> </div> </td> <td> <div class="adb-description_line"> <dt>Owner:</dt> <dd> <a> Brendan Steele </a> </dd> </div> <div class="adb-description_line"> <dt>Access Rights:</dt> <dd>View</dd> </div> </td> <td> <div class="adb-description_line"> <dt>Usage:</dt> <dd>20 out of 25 users</dd> <br> <div class="adb-js-meter adb-meter" data-percent="80" data-toggle="tooltip" title="You can assign 5 more users"> <span class="adb-meter--percent">80%</span> </div> </div> </td> </tr> </tbody> </table> </dl> </div> <div class="adb-local_alert adb-local_alert__pending adb-slat--alert"> <div class="adb-local_alert--content"> <p> Your cancel request for this product is in process. Once the process is complete, this product will be removed. </p> </div> </div> </div> </div>
Complex Slats
3 Reviews
ACME is Great Featured
Nulla pariatur at vero eos. et accusamus officiis debitis aut. rerum necessitatibus saepe eveniet ut. et voluptates repudiandae sint et. molestiae non recusandae itaque earum
Rerum hic tenetur a sapiente. delectus ut aut reiciendis voluptatibus. maiores doloribus asperiores repellat repellat. alias consequatur aut perferendis sit. voluptatem accusantium doloremque aperiam eaque
Ipsa quae ab illo inventore. veritatis et quasi architecto beatae. vitae dicta sunt explicabo aspernatur. aut odit aut fugit sed. quia consequuntur magni dolores eos
by Nathan Romero on June 24, 2013
ACME is Not Great
Qui ratione voluptatem sequi nesciunt. neque dolorem ipsum quia dolor. sit amet consectetur adipisci velit. sed quia non numquam eius. modi tempora incidunt ut labore
ACME is Okay
Et dolore magnam aliquam quaerat. voluptatem ut enim ad minima. veniam quis nostrum exercitationem ullam. corporis nemo enim ipsam voluptatem. quia voluptas sit suscipit laboriosam
<h2>3 Reviews</h2> <section class="adb-container"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__linked adb-id__sq_medium"> <i class="adb-id--placeholder adb-icon__user"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> ACME is Great <span class="adb-badge adb-badge__promo"> Featured </span> </h3> <div class="adb-hide-medium-up"> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> </div> </div> <div class="adb-show-medium-up"> <div class="adb-rating adb-rating__xlarge"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> </div> </div> <p> Nisi ut aliquid ex ea. commodi consequatur quis autem vel. eum iure reprehenderit qui in. ea voluptate velit esse quam. nihil molestiae et iusto odio </p> <p class="adb-caption"> by Nathan Romero on June 24, 2013 </p> <p class="adb-caption"> <a data-target="#review-comments" data-toggle="panel">Show 2 Comments</a> · <a data-target="#review-comment" data-toggle="panel">Comment</a> · <a>Edit</a> · <a>Delete</a> </p> <form action="" class="adb-form adb-form__comment adb-js-panel-target" id="review-comment"> <fieldset> <h4> <legend>Comment on Review</legend> </h4> <div class="adb-form--field"> <textarea id="review-comment-content" maxlength="2048" placeholder="Write your comments here."></textarea> </div> <menu class="adb-toolbar"> <button class="adb-button__primary adb-toolbar--item" type="submit"> Submit Comment </button> <button class="adb-button__secret adb-toolbar--item" data-dismiss="modal" type="button"> Cancel </button> </menu> </fieldset> </form> <div class="adb-js-panel-target adb-slats" id="review-comments"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__sq_medium"> <img class="adb-id--img" src="../../images/avatars/nathanRomero-120x120.png?1567620427" /> </div> </div> <div class="adb-slat--content adb-slat--column"> <p> Dignissimos ducimus qui blanditiis praesentium. laudantium totam rem voluptatum deleniti. atque corrupti quos dolores et. quas molestias excepturi sint occaecati. cupiditate non provident sed ut </p> <p class="adb-caption"> by Nathan Romero on June 24, 2013 · <a>Delete</a> </p> </div> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__sq_medium"> <i class="adb-id--placeholder adb-icon__user"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <p> Perspiciatis unde omnis iste natus. error similique sunt in culpa. qui officia deserunt mollitia animi. id est laborum et dolorum. fuga et harum quidem rerum </p> <p class="adb-subtitle"> by Nathan Romero on June 24, 2013 </p> </div> </div> </div> </div> <menu class="adb-slat--toolbar adb-slat--column adb-hide-medium-up"> <p> </p> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__linked adb-id__sq_medium"> <i class="adb-id--placeholder adb-icon__user"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> ACME is Not Great </h3> <div class="adb-hide-medium-up"> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-show-medium-up"> <div class="adb-rating adb-rating__xlarge"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <p> Facilis est et expedita distinctio. nam libero tempore cum soluta. nobis est eligendi optio cumque. nihil impedit quo porro quisquam. est qui minus id quod </p> <p class="adb-caption"> by Ryan Boye on July 20, 2012 </p> <p class="adb-caption"> <a>Show 1 Comment</a> · <a>Comment</a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column adb-hide-medium-up"> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <div class="adb-id adb-id__linked adb-id__sq_medium"> <i class="adb-id--placeholder adb-icon__user"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> ACME is Okay </h3> <div class="adb-hide-medium-up"> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-show-medium-up"> <div class="adb-rating adb-rating__xlarge"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <p> Maxime placeat facere possimus omnis. voluptas assumenda est omnis dolor. repellendus temporibus autem quibusdam et. aut consequatur vel illum qui. dolorem eum fugiat quo voluptas </p> <p class="adb-caption"> by Bernhard Schmidt on July 20, 2012 </p> <p class="adb-caption"> <a>Comment</a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column adb-hide-medium-up"> <p> </p> </menu> </div> </section>
Complex Slats with Pricing
Mailchimp
Send Better Email
More than 4 million people use MailChimp to create, send, and track email newsletters. Whether you're self-employed, you manage projects for clients, or you work for a Fortune 500 company, MailChimp has features and integrations that will suit your email-marketing needs. … Learn More
Free
Yendo
Accounting & CRM for small business
CRM and Accounting software for small/medium sized businesses. Smartphone compatible, works on iPhone, Blackberry etc. Branded Sales Invoices, Purchase Orders, Custom Invoice Design Templates, Send … Learn More
Cakemail Discounted
Email Marketing Made Simple.
CakeMail makes it easy for business owners to keep in touch with existing customers or market to prospective clients. … Learn More
$9.99
Wordpress Free Trial
Software for blogs and websites
WordPress started as just a blogging system, but has evolved to be used as full content management system and so much more through the thousands of plugins and widgets and themes … Learn More
$99.99
/ mo
Chownow Coming Soon
The online ordering system for restaurants
Custom Mobile Apps | Facebook Ordering | Website Ordering Widgets Learn More
$999.99
/ User / yr
Urban Airship
Global Leader in Push Messaging
Use unparalleled customer insight—preferences, behaviors, current location and location history—to target mobile messaging that quadruples engagement, doubles retention and drives double-digit … Learn More
$9.99
Formstack
Customize, brand & launch an online form in seconds.
Formstack helps you create powerful online forms within minutes, allowing you to collect information, payments, registrations, etc., in one centralized location. All form submissions are … Learn More
$99.99
/ mo
Symantec Endpoint Protection Small Business Edition 2013 Free Trial
Simple, fast cloud-managed protection against viruses and malware.
The new and simpler way to deliver critical protection to laptops, desktops and file servers for your small business. Includes automatic updates that protect against the latest batch of viruses or … Learn More
$999.99
/ yr
FreeAgent Free Trial
Small Business Accounting Software. Simplified.
FreeAgent is an online accounting application used by thousands of freelancers and small businesses. It was recently voted Best Small Business Accounting Application in the 2010 Software … Learn More
Sendgrid Discounted
Email Delivery. Simplified.
Sendgrid's cloud-based email infrastructure relieves businesses of the cost and complexity of maintaining email systems. Learn More
<div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/mailchimp-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a href="../../prototype/marketplace/product.html">Mailchimp </a> </h3> <h4 class="adb-title__small">Send Better Email</h4> <p> More than 4 million people use MailChimp to create, send, and track email newsletters. Whether you're self-employed, you manage projects for clients, or you work for a Fortune 500 company, MailChimp has features and integrations that will suit your email-marketing needs. … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-price--value">Free</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/yendo-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a href="../../prototype/marketplace/product.html">Yendo </a> </h3> <h4 class="adb-title__small">Accounting & CRM for small business</h4> <p> CRM and Accounting software for small/medium sized businesses. Smartphone compatible, works on iPhone, Blackberry etc. Branded Sales Invoices, Purchase Orders, Custom Invoice Design Templates, Send … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-price--value">Free</span> <br> <a>+ Premium Plans</a> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/cakemail-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a class="adb-title--link" href="../../prototype/marketplace/product.html">Cakemail </a> <span class="adb-badge adb-badge__promo">Discounted</span> </h3> <h4 class="adb-title__small">Email Marketing Made Simple.</h4> <p> CakeMail makes it easy for business owners to keep in touch with existing customers or market to prospective clients. … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-price--value">$9.99</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/wordpress-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small" style="display: none; visibility: hidden;"> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a class="adb-title--link" href="../../prototype/marketplace/product.html">Wordpress </a> <span class="adb-badge adb-badge__free">Free Trial</span> </h3> <h4 class="adb-title__small">Software for blogs and websites</h4> <p> WordPress started as just a blogging system, but has evolved to be used as full content management system and so much more through the thousands of plugins and widgets and themes … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-price--value">$99.99</span> <br> <span class="adb-price--unit">/ mo</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/chownow-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a class="adb-title--link" href="../../prototype/marketplace/product.html">Chownow </a> <span class="adb-badge adb-badge__soon">Coming Soon</span> </h3> <h4 class="adb-title__small">The online ordering system for restaurants</h4> <p> Custom Mobile Apps | Facebook Ordering | Website Ordering Widgets <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-price--value">$999.99</span> <br> <span class="adb-price--unit">/ User / yr</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/urbanairship-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a href="../../prototype/marketplace/product.html">Urban Airship </a> </h3> <h4 class="adb-title__small">Global Leader in Push Messaging</h4> <p> Use unparalleled customer insight—preferences, behaviors, current location and location history—to target mobile messaging that quadruples engagement, doubles retention and drives double-digit … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-caption">Starts at</span> <br> <span class="adb-price--value">$9.99</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/formstack-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a href="../../prototype/marketplace/product.html">Formstack </a> </h3> <h4 class="adb-title__small">Customize, brand & launch an online form in seconds.</h4> <p> Formstack helps you create powerful online forms within minutes, allowing you to collect information, payments, registrations, etc., in one centralized location. All form submissions are … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-caption">Starts at</span> <br> <span class="adb-price--value">$99.99</span> <br> <span class="adb-price--unit">/ mo</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/symantec-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a class="adb-title--link" href="../../prototype/marketplace/product.html">Symantec Endpoint Protection Small Business Edition 2013 </a> <span class="adb-badge adb-badge__free">Free Trial</span> </h3> <h4 class="adb-title__small">Simple, fast cloud-managed protection against viruses and malware.</h4> <p> The new and simpler way to deliver critical protection to laptops, desktops and file servers for your small business. Includes automatic updates that protect against the latest batch of viruses or … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-price"> <span class="adb-caption">Starts at</span> <br> <span class="adb-price--value">$999.99</span> <br> <span class="adb-price--unit">/ yr</span> </p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/freeagent-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small"> <i class="adb-rating--icon adb-rating--icon__positive"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a class="adb-title--link" href="../../prototype/marketplace/product.html">FreeAgent </a> <span class="adb-badge adb-badge__free">Free Trial</span> </h3> <h4 class="adb-title__small">Small Business Accounting Software. Simplified.</h4> <p> FreeAgent is an online accounting application used by thousands of freelancers and small businesses. It was recently voted Best Small Business Accounting Application in the 2010 Software … <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-caption">Available via Partner</p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column"> <p> <a class="adb-id adb-id__linked adb-id__logo adb-id__sq_xlarge" href="../../prototype/marketplace/product.html"><img class="adb-id--img" src="../../images/logos/apps/sendgrid-120x120.png?1567620427" /> </a> </p> <div class="adb-rating adb-rating__small" style="display: none; visibility: hidden;"> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> <i class="adb-rating--icon adb-rating--icon__unrated"></i> </div> </div> <div class="adb-slat--content adb-slat--column"> <h3> <a class="adb-title--link" href="../../prototype/marketplace/product.html">Sendgrid </a> <span class="adb-badge adb-badge__promo">Discounted</span> </h3> <h4 class="adb-title__small">Email Delivery. Simplified.</h4> <p> Sendgrid's cloud-based email infrastructure relieves businesses of the cost and complexity of maintaining email systems. <a class="more" href="../../prototype/marketplace/product.html">Learn More </a> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-label adb-price--container"> <p class="adb-caption">Available via Partner</p> <div class="adb-show-small-up"> <a class="adb-button adb-button__medium adb-button__full_width adb-button__primary" href="../../prototype/marketplace/product.html">View Profile </a> </div> </div> <div class="adb-show-medium-up"> <label class="adb-selector adb-selector__button adb-button__neutral adb-button adb-button__small adb-js-checkbox adb-js-compare" data-placement="bottom" data-title="Select to compare" data-toggle="tooltip"> <span class="adb-selector--input"> <input type="checkbox"> </span> <span class="adb-selector--value">Compare</span> </label> </div> </menu> </div>
Numbered Slats
Create Marketing Profile
Add images, marketing copy, and resources. A thorough profile sells.
65%Create Editions and Pricing
At least one edition is required for users to buy your product.
100%Create your Integration Report
Healthy endpoints make it possible for users to buy, cancel and upgrade.
45%Add to Marketplaces
Select the marketplace where you'd like to sell your product.
<div class="adb-container"> <div class="adb-slat adb-slat__actionable" data-url="/prototype/developer/editor/profile.html"> <div class="adb-slat--column adb-slat--number">1</div> <div class="adb-slat--column adb-slat--content"> <h3>Create Marketing Profile</h3> <p>Add images, marketing copy, and resources. A thorough profile sells.</p> <span class="adb-js-meter adb-meter" data-percent="65" data-title="65%" data-toggle="tooltip"> <span class="adb-meter--percent"></span> </span> <span class="adb-affix">65%</span> </div> <div class="adb-slat--column adb-slat--actions"> <a class="adb-button__neutral adb-button adb-button__medium" href="../../prototype/developer/editor/integration_report.html">Edit </a> </div> </div> <div class="adb-slat adb-slat__actionable" data-url="/prototype/developer/editor/add_edition.html"> <div class="adb-slat--column adb-slat--number">2</div> <div class="adb-slat--column adb-slat--content"> <h3>Create Editions and Pricing</h3> <p>At least one edition is required for users to buy your product.</p> <span class="adb-js-meter adb-meter" data-percent="100" data-placement="top" data-state="completed" data-title="Complete" data-toggle="tooltip"> <span class="adb-meter--percent"></span> </span> <span class="adb-affix">100%</span> </div> <div class="adb-slat--column adb-slat--actions"> <a class="adb-button__neutral adb-button adb-button__medium" href="../../prototype/developer/editor/integration_report.html">Edit </a> </div> </div> <div class="adb-slat adb-slat__actionable" data-url="/prototype/developer/editor/integration_report.html"> <div class="adb-slat--column adb-slat--number">3</div> <div class="adb-slat--column adb-slat--content"> <h3>Create your Integration Report</h3> <p>Healthy endpoints make it possible for users to buy, cancel and upgrade.</p> <span class="adb-js-meter adb-meter" data-percent="45" data-title="45%" data-toggle="tooltip"> <span class="adb-meter--percent"></span> </span> <span class="adb-affix">45%</span> </div> <div class="adb-slat--column adb-slat--actions"> <a class="adb-button__neutral adb-button adb-button__medium" href="../../prototype/developer/editor/integration_report.html">Edit </a> </div> </div> <div class="adb-slat adb-slat__actionable" data-url="/prototype/developer/editor/marketplaces.html"> <div class="adb-slat--column adb-slat--number">4</div> <div class="adb-slat--column adb-slat--content"> <h3>Add to Marketplaces</h3> <p>Select the marketplace where you'd like to sell your product.</p> </div> <div class="adb-slat--column adb-slat--actions"> <a class="adb-button__secondary adb-button adb-button__medium" href="../../prototype/developer/editor/marketplaces.html">Add to Marketplaces </a> </div> </div> </div>
Order Configuration Slats
Product Slats above an Order Configuration card.
Microsoft Office 365
Microsoft
Search everything, in one shot. Easily find youir emails, documents, meeting invites all in one place.
<div class="adb-container__open"> <div class=""> <div class="adb-slat"> <div class="adb-slat-container"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column" style="padding-left: 0px;"> <div class="adb-hide-medium-up"> <span class="adb-id adb-id__logo adb-id__sq_xsmall adb-id_group--item"> <img class="adb-id--img" src="../../images/logos/apps/msoffice-72x72.png?1567620427" /> </span> </div> <div class="adb-show-medium-up"> <span class="adb-id adb-id__logo adb-id__sq_medium adb-id_group--item"> <img class="adb-id--img" src="../../images/logos/apps/msoffice-72x72.png?1567620427" /> </span> </div> </div> <div class="adb-slat--content adb-slat--column adb-slat--column--centered adb-summary"> <div class="adb-hide-medium-up"> <h4 class="adb-summary--title adb-title--secondary"> Microsoft Office 365 </h4> </div> <div class="adb-show-medium-up"> <h1 class="adb-summary--title adb-title--secondary"> Microsoft Office 365 </h1> </div> <h6 class="adb-summary--details"> Microsoft </h6> </div> </div> </div> <!-- // Remove Button or LInk --> <menu class="adb-slat--toolbar adb-slat--column adb-slat--column--centered"> <div class="adb-price--container"> <a data-price="0" class="" href="">Remove </a> </div> </menu> </div> <div class="adb-slat adb-is-hidden"> <div class="adb-slat--content adb-slat--column"> <p> Search everything, in one shot. Easily find youir emails, documents, meeting invites all in one place. </p> <p> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-title__medium" style="font-weight: normal;"> $12 / users / month </div> </menu> </div> </div> <div class=" adb-container adb-container__elevated "> <div class="adb-container_content adb-is-active " id="microsoft-pricing"> <form class="adb-form"> <div class="adb-form--field"> <label class="adb-label__inline" for="plan"> <span class="adb-label__large">Plan </span> <a class="adb-button adb-button__medium adb-button__link" href="/prototype/marketplace/product.html">Show and compare plans</a> </label> <div class="adb-receipt--line"> <div class="adb-receipt--item adb-receipt-dropdown"> <div class="adb-js-dropdown adb-dropdown adb-dropdown__sized_xlarge adb-dropdown__full_width"> <select id="microsoft-pricing--option-select"> <option data-url=""> Office 365 Enterprise E3 </option> <option data-url="" selected> Office 365 Enterprise E5 </option> <option data-url=""> Office 365 Enterprise E8 </option> </select> </div> </div> </div> </div> <div class="adb-form--field adb-form-field--section adb-receipt--section__open"> <div class="adb-form--field adb-receipt--section__open"> <div class="adb-receipt--line"> <div class="adb-receipt--item"> <label class="adb-label__large" for="total_rooms"> Total Users </label> <input class="total_rooms adb-text__sized_xlarge" min="1" placeholder="1" type="number" value="1"> <div class="adb-caption adb-form--caption"> A minimum of 1 user license must be purchased </div> </div> <div class="adb-receipt--item"> <div class="adb-receipt--line"> <div class="adb-receipt--item adb-receipt--item__label adb-receipt--item__subheading"> <label class="adb-subtitle"> </label> </div> <div class="adb-receipt--item"> $10 / user / month </div> </div> <div class="adb-receipt--line"> <div class="adb-receipt--item"></div> <div class="adb-receipt--item--inline"> <span class="adb-subtitle"> Setup fee </span> $20 </div> </div> </div> </div> </div> </div> </form> </div> </div> </div>
G Suite
Search everything, in one shot. Easily find youir emails, documents, meeting invites all in one place.
30 Day Free Trial
<div class="adb-container__open"> <div class=""> <div class="adb-slat"> <div class="adb-slat-container"> <div class="adb-slat"> <div class="adb-slat--image adb-slat--column" style="padding-left: 0px;"> <div class="adb-hide-medium-up"> <span class="adb-id adb-id__logo adb-id__sq_xsmall adb-id_group--item"> <img class="adb-id--img" src="../../images/logos/apps/googleapps-72x72.png?1567620427" /> </span> </div> <div class="adb-show-medium-up"> <span class="adb-id adb-id__logo adb-id__sq_medium adb-id_group--item"> <img class="adb-id--img" src="../../images/logos/apps/googleapps-72x72.png?1567620427" /> </span> </div> </div> <div class="adb-slat--content adb-slat--column adb-slat--column--centered adb-summary"> <div class="adb-hide-medium-up"> <h4 class="adb-summary--title adb-title--secondary"> G Suite </h4> </div> <div class="adb-show-medium-up"> <h1 class="adb-summary--title adb-title--secondary"> G Suite </h1> </div> <h6 class="adb-summary--details"> Google </h6> </div> </div> </div> <!-- // Remove Button or LInk --> <menu class="adb-slat--toolbar adb-slat--column adb-slat--column--centered"> <div class="adb-price--container"> <a data-price="0" class="" href="">Remove </a> </div> </menu> </div> <div class="adb-slat adb-is-hidden"> <div class="adb-slat--content adb-slat--column"> <p> Search everything, in one shot. Easily find youir emails, documents, meeting invites all in one place. </p> <p> </p> </div> <menu class="adb-slat--toolbar adb-slat--column"> <div class="adb-title__medium" style="font-weight: normal;"> $12 / users / month </div> </menu> </div> </div> <div class=" adb-container adb-container__elevated "> <div class="adb-container_content adb-is-active " id="microsoft-pricing"> <form class="adb-form"> <div class="adb-form--field"> <label class="adb-label__inline" for="plan"> <span class="adb-label__large">Plan </span> <a class="adb-button adb-button__medium adb-button__link" href="/prototype/marketplace/product.html">Show and compare plans</a> </label> <div class="adb-receipt--line"> <div class="adb-receipt--item adb-receipt-dropdown"> <div class="adb-js-dropdown adb-dropdown adb-dropdown__sized_xlarge adb-dropdown__full_width"> <select id="microsoft-pricing--option-select"> <option data-url=""> Google Tier 1 </option> <option data-url="" selected> Google Tier 2 </option> <option data-url=""> Google Tier 3 </option> </select> </div> </div> <div class="adb-receipt--item"> <div class="adb-receipt--item__total"> $150.00 </div> <div class="adb-receipt--item__label"> / month </div> <div class="adb-receipt--line"> <div class="adb-receipt--item adb-receipt--item__label adb-subtitle"> Setup Fee </div> <div class="adb-receipt--item"> $10 </div> </div> </div> </div> </div> <div class="adb-form--field adb-form-field--section adb-receipt--section__open"> <div class="adb-form--field adb-receipt--section__open"> <div class="adb-receipt--line"> <div class="adb-receipt--item"> <label class="adb-label__large" for="total_rooms"> Total Users </label> <input class="total_rooms adb-text__sized_xlarge" min="1" placeholder="1" type="number" value="1"> <div class="adb-caption adb-form--caption"> A minimum of 1 user license must be purchased </div> </div> <div class="adb-receipt--item"> <div class="adb-receipt--line"> <div class="adb-receipt--item adb-receipt--item__label adb-receipt--item__subheading"> <label class="adb-subtitle"> </label> </div> <div class="adb-receipt--item"> $10 / user / month </div> </div> <div class="adb-receipt--line"> <div class="adb-receipt--item"></div> <div class="adb-receipt--item--inline"> <span class="adb-subtitle"> Setup fee </span> $20 </div> </div> </div> </div> </div> </div> </form> </div> <div class="adb-container_backgrounded__info"> <div class="adb-container_content"> <p> <i class="adb-icon__info"></i> <strong> 30 Day Free Trial </strong> </p> </div> </div> </div> </div>