page title (DSP)
The title displays center aligned on all breakpoints and pages, with the exception of the purchase flow, where it is only displayed over the left half of the grid on larger breakpoints. For the purchase flow, make sure add the class of purchase-flow to the title section, and remove the classes package small from the interior div. For the Review Order page, you don’t need to use anything for the title but a section with <h1 class='sans bold h3'> in it.
Example
Local news wherever you go
Thanks for reading! You’ve read all your free articles this month. You must have an account to continue.
Subscribe or Sign up
Purchase flow example
Sign up
Use your email address or a social account. Already have an account? Sign in
HTML
<section class="title">
<div class="package small">
<h2 class="sans bold">Sign up</h2>
<p class="summary">Use your email address or a social account.<br>
Already have an account? <a href="#" class="more-link inline">Sign in</a></p>
</div>
</section>Purchase Flow HTML
<section class="title purchase-flow">
<div>
<h1 class="sans bold h3">Sign up</h1>
<p class="summary">Use your email address or a social account.
Already have an account? <a href="/saratoga/decks/purchase-flow/sign-in/" class="more-link inline">Sign in</a></p>
</div>
</section>