Skip to content

Instantly share code, notes, and snippets.

@mkeplinger
Created April 26, 2012 05:05
Show Gist options
  • Save mkeplinger/2496101 to your computer and use it in GitHub Desktop.
Save mkeplinger/2496101 to your computer and use it in GitHub Desktop.
<div class="container">
<section id="content">
<div class="node_join">
<div id="wizard_breadcrumb" class="span-20 last append-bottom">
<div class="wizard_wrap">
<div class="span-4 pp"><a href="#choose-plan">Choose plan</a></div>
<div class="span-4 pp"><a href="#create-account">Create account</a></div>
<div class="span-4 ps"><a href="#payment-info">Payment info</a></div>
<div class="span-4"><a href="#id-card">Create ID card</a></div>
<div class="span-4 last"><a href="#exercise">Exercise</a></div>
</div>
</div>
<div class="span-24">
<form action="/users/payment_info" accept-charset="utf-8" class="inline" id="CardPaymentInfoForm" method="post"><div style="display:none;"><input type="hidden" name="_method" value="POST"></div> <div class="dashboard">
<div class="span-14">
<div class="card_logos">
We accept:
<img src="/img/creditcardlogos.png" alt="Credit Card Logos" title="Credit Card Logos" height="72"><img src="/img/authorize_seal.gif" alt="Authorize.Net Merchant - Click to Verify" style="cursor: pointer;" onclick="window.open('//verify.authorize.net/anetseal/?pid=13957f02-81cf-43a5-8b47-cbea96f2dd3e&amp;amp;rurl=https://dev.fitpass.net/users/payment_info','AuthorizeNetVerification','width=600,height=430,dependent=yes,resizable=yes,scrollbars=yes,menubar=no,toolbar=no,status=no,directories=no,location=yes'); return false;"> </div>
<fieldset>
<legend>Credit Card Details</legend>
<div class="input text required"><label for="CardFirstName">First Name: </label><input name="data[Card][first_name]" class="text" size="20" maxlength="128" type="text" value="qwe" id="CardFirstName"></div><div class="input text required"><label for="CardLastName">Last Name: </label><input name="data[Card][last_name]" class="text" size="20" maxlength="128" type="text" value="qwe" id="CardLastName"></div><div class="input text required"><label for="CardCardNumber">Credit Card Number: </label><input name="data[Card][card_number]" class="text" size="20" maxlength="16" type="text" id="CardCardNumber"></div><div class="input text required"><label for="CardCvv">CVV: </label><input name="data[Card][cvv]" class="text" size="5" maxlength="3" type="text" id="CardCvv"></div> <div class="input text required ">
<label>Expiration Date: </label><select name="data[Card][exp_month][month]" id="CardExpMonthMonth">
<option value=""></option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select> <select name="data[Card][exp_year][year]" id="CardExpYearYear">
<option value=""></option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
</select> </div>
</fieldset>
<fieldset>
<legend>Billing Address</legend>
<div class="input text required"><label for="CardBillingAddress1">Address 1: </label><input name="data[Card][billing_address1]" class="text" size="40" maxlength="255" type="text" id="CardBillingAddress1"></div><div class="input text"><label for="CardBillingAddress2">Address 2: </label><input name="data[Card][billing_address2]" class="text" size="40" maxlength="255" type="text" id="CardBillingAddress2"></div><div class="input text required"><label for="CardBillingCity">City: </label><input name="data[Card][billing_city]" class="text" size="20" maxlength="50" type="text" id="CardBillingCity"></div><div class="input select required"><label for="CardBillingState">State: </label><select name="data[Card][billing_state]" id="CardBillingState">
<option value=""></option>
<option value="AL">AL</option>
<option value="AK">AK</option>
<option value="AZ">AZ</option>
<option value="AR">AR</option>
<option value="CA">CA</option>
<option value="CO">CO</option>
<option value="CT">CT</option>
<option value="DE">DE</option>
<option value="DC">DC</option>
<option value="FL">FL</option>
<option value="GA">GA</option>
<option value="HI">HI</option>
<option value="ID">ID</option>
<option value="IL">IL</option>
<option value="IN">IN</option>
<option value="IA">IA</option>
<option value="KS">KS</option>
<option value="KY">KY</option>
<option value="LA">LA</option>
<option value="ME">ME</option>
<option value="MD">MD</option>
<option value="MA">MA</option>
<option value="MI">MI</option>
<option value="MN">MN</option>
<option value="MS">MS</option>
<option value="MO">MO</option>
<option value="MT">MT</option>
<option value="NE">NE</option>
<option value="NV">NV</option>
<option value="NH">NH</option>
<option value="NJ">NJ</option>
<option value="NM">NM</option>
<option value="NY">NY</option>
<option value="NC">NC</option>
<option value="ND">ND</option>
<option value="OH">OH</option>
<option value="OK">OK</option>
<option value="OR">OR</option>
<option value="PA">PA</option>
<option value="RI">RI</option>
<option value="SC">SC</option>
<option value="SD">SD</option>
<option value="TN">TN</option>
<option value="TX">TX</option>
<option value="UT">UT</option>
<option value="VT">VT</option>
<option value="VA">VA</option>
<option value="WA">WA</option>
<option value="WV">WV</option>
<option value="WI">WI</option>
<option value="WY">WY</option>
</select></div><div class="input text required"><label for="CardBillingZip">Zip: </label><input name="data[Card][billing_zip]" class="text" size="10" maxlength="5" type="text" id="CardBillingZip"></div> </fieldset>
<fieldset>
<legend>Shipping Address</legend>
We will send member card at this address.<br><br>
<div class="input checkbox"><input type="hidden" name="data[Card][same_as_billing]" id="CardSameAsBilling_" value="0"><input type="checkbox" name="data[Card][same_as_billing]" value="1" id="CardSameAsBilling"> Same as Billing Address</div> <div id="shipping_fields">
<div class="input text required"><label for="CardMailingAddress">Address 1: </label><input name="data[Card][mailing_address]" class="text" size="40" maxlength="255" type="text" id="CardMailingAddress"></div><div class="input text"><label for="CardMailingAddress2">Address 2: </label><input name="data[Card][mailing_address2]" class="text" size="40" maxlength="255" type="text" id="CardMailingAddress2"></div><div class="input text required"><label for="CardMailingCity">City: </label><input name="data[Card][mailing_city]" class="text" size="20" maxlength="50" type="text" id="CardMailingCity"></div><div class="input select required"><label for="CardMailingState">State: </label><select name="data[Card][mailing_state]" id="CardMailingState">
<option value=""></option>
<option value="AL">AL</option>
<option value="AK">AK</option>
<option value="AZ">AZ</option>
<option value="AR">AR</option>
<option value="CA">CA</option>
<option value="CO">CO</option>
<option value="CT">CT</option>
<option value="DE">DE</option>
<option value="DC">DC</option>
<option value="FL">FL</option>
<option value="GA">GA</option>
<option value="HI">HI</option>
<option value="ID">ID</option>
<option value="IL">IL</option>
<option value="IN">IN</option>
<option value="IA">IA</option>
<option value="KS">KS</option>
<option value="KY">KY</option>
<option value="LA">LA</option>
<option value="ME">ME</option>
<option value="MD">MD</option>
<option value="MA">MA</option>
<option value="MI">MI</option>
<option value="MN">MN</option>
<option value="MS">MS</option>
<option value="MO">MO</option>
<option value="MT">MT</option>
<option value="NE">NE</option>
<option value="NV">NV</option>
<option value="NH">NH</option>
<option value="NJ">NJ</option>
<option value="NM">NM</option>
<option value="NY">NY</option>
<option value="NC">NC</option>
<option value="ND">ND</option>
<option value="OH">OH</option>
<option value="OK">OK</option>
<option value="OR">OR</option>
<option value="PA">PA</option>
<option value="RI">RI</option>
<option value="SC">SC</option>
<option value="SD">SD</option>
<option value="TN">TN</option>
<option value="TX">TX</option>
<option value="UT">UT</option>
<option value="VT">VT</option>
<option value="VA">VA</option>
<option value="WA">WA</option>
<option value="WV">WV</option>
<option value="WI">WI</option>
<option value="WY">WY</option>
</select></div><div class="input text required"><label for="CardMailingZipCode">Zip: </label><input name="data[Card][mailing_zip_code]" class="text" size="10" maxlength="5" type="text" id="CardMailingZipCode"></div>
</div>
</fieldset>
<div class="form-checkboxes">
<div class="input checkbox required"><input type="hidden" name="data[Card][terms_agree]" id="CardTermsAgree_" value="0"><input type="checkbox" name="data[Card][terms_agree]" value="1" id="CardTermsAgree"> I have read and agree to the FitPass Network <a href="/pages/terms" target="_new">Terms and Conditions</a></div> </div>
</div>
<div class="clear"></div>
<input type="submit" name="submit_button" id="submit_button" value="Save Payment Details &amp; Create Subscription" class="form-submit">
</div>
</form> </div>
</div>
</section> </div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment