Foreign Affairs Style Guide

Foreign Affairs

Article -- Paywall - 2019 - Hard C version


The body component of an article including the article paywall.

Redmine Prototyping Ticket(s)
Data Sources:

Register to keep reading or subscribe for unlimited access

Missing out? Subscribe today and you'll receive unlimited access to all Foreign Affairs content, the print magazine, app access, exclusive newsletters from Foreign Affairs editors, special subscriber-only extras, and much more.

Subscribe for Full Access
      <div class="paywall c-hard-2019-v">
  <div class="paywall-prompt purchasable-pdf--no">
    <div class="container-bs">
      <div class="row c-hard-2019-v-img">
        <div class="col-12">
          <img src="/fa_prototype/assets/images/subscribe-thumb.png" alt="" class="b-lazy">
        </div>
      </div>
      <div class="row">
        <div class="col-12 c-hard-2019-v-cont">
          <h3 class="d-2019-v-prim-header">Register to keep reading or subscribe for unlimited access</h3>

          <p>Missing out? Subscribe today and you'll receive unlimited access to all <em>Foreign Affairs</em> content, the print magazine, app access, exclusive newsletters from <em>Foreign Affairs</em> editors, special subscriber-only extras, and much more.</p>
          
          <a href="#" class="button__red-reversed c-2019-v-ctabtn">Subscribe for Full Access</a>
          <p class="sign-in"><em>Already have an account? <a href="#">Sign in.</a></em></p>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- The below code is used to simulate the action of clicking the "Already a subscriber" link -->
<form class="user-login-form" action="/ajax_forms/ajax/login" method="post" id="user-login" accept-charset="UTF-8" style="display:none;"><div><div class="user-login__header form-mice-type">Don't have an account? <a href="/ajax_forms/nojs/register-form" class="use-ajax ajax-processed">Register</a> today for free.</div><div class="form-item form-type-textfield form-item-name">
 <input placeholder="Your Email" type="text" id="edit-name" name="name" value="" size="60" maxlength="60" class="form-text required">
</div>
<div class="form-item form-type-password form-item-pass">
 <input placeholder="Your Password" type="password" id="edit-pass" name="pass" size="60" maxlength="128" class="form-text required">
</div>
<input type="hidden" name="form_build_id" value="form-bhbt2KjqO3rMHkKACXaIRRlkDr0ioDrtTwgLqbGz24c">
<input type="hidden" name="form_id" value="user_login">
<div class="form-actions form-wrapper" id="edit-actions"><input class="button__blue button-login form-submit ajax-processed" type="submit" id="edit-submit--4" name="op" value="Sign In"></div><div class="user-login__footer form-mice-type"><a href="/modal_forms/nojs/password" class="ctools-use-modal ctools-modal-modal-popup-small ctools-use-modal-processed" title="Forgot your username or password?">Forgot your username or password?</a><br><a class="use-ajax ajax-processed" href="/ajax_forms/nojs/register-form?status=1">Already a subscriber but don't have a login?</a><br><a href="/myaccount">Customer Service</a></div></div></form>