sendgrid-gists’s gists

sendgrid-gists / center-confirmation.html

Last active July 24, 2018 21:58

Sendgrid style-guide center confirmation modal

	<div class="center-modal is-confirmation">
	<i class="sg-icon sg-icon-x"></i>
	<h2>Are you sure you want to delete these workflows?</h2>
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In nec augue eu lacus aliquam lobortis</p>
	<div class="conf-alert-actions">
	<div class="btn-list">
	<button class="btn btn-secondary">No</button>
	<button class="btn btn-primary">Yes</button>
	</div>
	</div>

sendgrid-gists / standard-list.html

Last active July 23, 2018 20:47

SendGrid style-guide standard list

	<ul class="standard-list">
	<li>Unordered Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
	<li>Vestibulum vehicula semper eleifend.</li>
	<li>Integer at tortor luctus dui egestas consequat.</li>
	</ul>

	<ol class="standard-list">
	<li>Ordered Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
	<li>Vestibulum vehicula semper eleifend.</li>
	<li>Integer at tortor luctus dui egestas consequat.</li>

sendgrid-gists / card-plan.html

Last active July 12, 2018 23:06

SendGrid style-guide plan card

	<div class="card is-plan">
	<div class="plan-details-wrap">
	<h3 class="plan-title">Pro 300K</h3>
	<p class="plan-subtitle">300,000 emails/mo + $0.00050 per additional email</p>
	</div>
	<div class="plan-selection-wrap">
	<p class="plan-price">$199.95/mo*</p>
	<a class="btn btn-small btn-secondary" href="#">Select</a>
	</div>
	</div>

sendgrid-gists / contact-count.html

Created July 10, 2018 17:42

SendGrid style-guide contact count

	<div class="contact-count">
	<span data-tooltip="Contact Count" data-tooltip-pos="up"><abbr>1,234</abbr></span>
	<i class="sg-icon sg-icon-people is-size-20"></i>
	</div>

sendgrid-gists / feature-list.html

Created July 5, 2018 19:38

SendGrid style-guide feature list

	<ul class="feature-list">
	<li class="is-checked">Core Email API Features</li>
	<li class="is-checked">Core Marketing Campaigns Features</li>
	<li class="is-checked">Data-rich email activity feed </li>
	<li>Dedicated IP</li>
	<li>Subuser management</li>
	<li>Customer success manager</li>
	<li>Prioritized support</li>
	</ul>
	<p class="feature-list-full"><a href="#">See Full Plan Comparison</a></p>

sendgrid-gists / card-metric.html

Created June 28, 2018 15:11

SendGrid style-guide metric card

sendgrid-gists / segment-query.html

Created June 13, 2018 22:28

SendGrid style-guide query segment terms

	<div class="segment-term-wrap is-query">
	<div class="segment-term has-separator">
	<p>Recent order total is greater than <strong>$100</strong></p>
	<i class="sg-icon sg-icon-pencil segment-term-edit"></i>
	</div>
	</div>
	<div class="segment-term-wrap is-query">
	<div class="segment-term-switch">
	<div class="switch is-and-or">
	<input class="switch-checkbox" id="segment-term-and-or-switch-2" type="checkbox">

sendgrid-gists / tables-loading.html

Created May 3, 2018 20:46

SendGrid style-guide loading tables

	<table class="table-wrap has-checkboxes">
	<thead>
	<tr>
	<th class="table-checkbox">
	<div class="input-checkbox-wrap">
	<input class="table-select-all" id="table-loading-select-all" type="checkbox" value="Select All">
	<label class="input-checkbox-label" for="table-loading-select-all"></label>
	</div>
	</th>
	<th class="sort">Contacts</th>

sendgrid-gists / browser-chrome.html

Created May 3, 2018 19:48

SendGrid style-guide browser chrome

	<div class="browser-chrome-wrap">
	<div class="chrome-header">
	<div class="chrome-control"></div>
	<div class="chrome-address"></div>
	</div>
	<div class="chrome-content">
	...
	</div>
	</div>

sendgrid-gists / signup-summary.html

Last active April 30, 2018 22:33

SendGrid style-guide signup summary

	<div class="signup-summary-wrap">
	<h2>Summary <span data-tooltip="The exact amount you pay will vary month-to-month based on your sending volume and contact list size." data-tooltip-length="large" data-tooltip-pos="up"><i class="sg-icon sg-icon-info-circle"></i></span></h2>
	<table>
	<tr>
	<th>
	<div class="btn-list">
	<div class="btn btn-dropdown dropdown">
	...
	</div>
	</div>

SendGrid DX sendgrid-gists