pomelo/purchase-stripe.html at master · markphd/pomelo · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

<html>
  <head>
    <meta name="viewport" content="width=device-width"/>
    <link href="//cdnjs.cloudflare.com/ajax/libs/materialize/0.100.1/css/materialize.min.css" rel="stylesheet"/>
    <link href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
    <link href="dist/css/main.css" rel="stylesheet"/>
  </head>
  <body>
    <div id="logo"></div>
    <div class="main">
      <div class="modal" id="purchase-stripe-modal">
        <div class="stripe--payment-header">
          <button class="stripe--close"></button>
          <button class="stripe--logo"></button>
          <h1 class="stripe--payment-headline">Professional</h1>
          <p class="stripe--payment-subhead">$9/month</p>
        </div>
        <div class="stripe--payment-input">
          <div class="stripe--email-label"></div>
          <input class="stripe--email-input" type="email" placeholder="Email"/>
          <div class="stripe--card-label"></div>
          <input class="stripe--card-input" type="text" placeholder="Card number"/>
          <div class="stripe--mmyy-label"></div>
          <input class="stripe--mmyy-input" type="text" placeholder="MM / YY"/>
          <div class="stripe--cvc-label"></div>
          <input class="stripe--cvc-input" type="text"/><br/>
          <div class="stripe--remember-me">
            <input class="stripe--checkbox-input" type="checkbox" id="remember"/>
            <label for="remember">Remember Me</label>
          </div>
          <div class="stripe--pay-button waves-effect waves-light btn-large">Pay $9.99</div>
        </div>
      </div>
    </div>
    <script src="dist/scripts/jquery.min.js"></script>
    <script src="dist/scripts/hideshowpassword.min.js"></script>
    <script src="dist/scripts/materialize.min.js"></script>
    <script src="dist/scripts/main.js"></script>
  </body>
</html>