paymob-iframe/iframe.html at main · Graduation-Project-2023/paymob-iframe · 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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
</head>

<div class="iframeOut">
  <div class="iframBody">
    <header>
      <div class="uniTitle">
        <h1>Suez Canal University</h1>
      </div>
    </header>
    <form id="paymob_checkout">
      <div class="inputDiv">
        <input
          placeholder="Card Number"
          required
          maxlength="16"
          type="text"
          paymob_field="card_number"
        />
      </div>
      <div class="inputDiv">
        <input
          placeholder="Card Holder Name"
          required
          paymob_field="card_holdername"
        />
      </div>
      <div class="inputDiv cardExpire">
        <input
          placeholder="Exp. Month"
          required
          maxlength="2"
          type="text"
          paymob_field="card_expiry_mm"
        />
        <input
          placeholder="Exp. Year"
          required
          maxlength="2"
          type="text"
          paymob_field="card_expiry_yy"
        />
      </div>
      <div class="inputDiv">
        <input
          placeholder="CCV"
          type="text"
          required
          maxlength="4"
          paymob_field="card_cvn"
        />
      </div>
      <input type="hidden" value="CARD" paymob_field="subtype" />
      <div class="inputDiv saveCard">
        <div>
          <input
            type="checkbox"
            value="tokenize"
            name="save card"
            id="save card"
          />
          <label for="save card">Save Card</label>
        </div>
        <div class="iframeType">
          <div class="cardsLogos">
            <img src="/static/img/visa.svg" />
            <img src="/static/img/Mastercard.svg" />
          </div>
        </div>
      </div>
      <input class="iframeBtn" type="submit" value="Pay" />
    </form>
    <footer>
      Powered by
      <a href="#"><img src="/static/img/paymob_new.svg" /></a>
    </footer>
  </div>
</div>