Nordstorm-clone/payment.html at main · agrawalrajat310/Nordstorm-clone · 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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Payment</title>
    <link rel="stylesheet" href="payment.css" />
    <link
      href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet"
    />
  </head>
  <body>
    <h1 id="head">NORDSTROM</h1>

    <div class="main">
      <div class="hex"></div>
      <div class="hexc">
        <div class="container">
          <div class="left">
            <h3>Payment Methods</h3>
            <form>
              Full name
              <input type="text" name="" placeholder="Enter name" required />
              Email
              <input type="text" name="" placeholder="Enter email" required />

              Address
              <input type="text" name="" placeholder="Enter address" required />

              City
              <input type="text" name="" placeholder="Enter City" required />
              <div id="zip">
                <label>
                  State
                  <select>
                    <option>Choose State..</option>
                    <option>Andhra Pradesh</option>
                    <option>Arunachal Pradesh</option>
                    <option>Assam</option>
                    <option>Bihar</option>
                    <option>Chhattisgarh</option>
                    <option>Goa</option>
                    <option>Gujarat</option>
                    <option>Haryana</option>
                    <option>Himachal Pradesh</option>
                    <option>Jharkhand</option>
                    <option>Karnataka</option>
                    <option>Kerala</option>
                    <option>Madhya Pradesh</option>
                    <option>Maharashtra</option>
                    <option>Manipur</option>
                    <option>Meghalaya</option>
                    <option>Mizoram</option>
                    <option>Nagaland</option>
                    <option>Odisha</option>
                    <option>Punjab</option>
                    <option>Rajasthan</option>
                    <option>Sikkim</option>
                    <option>Tamil Nadu</option>
                    <option>Telangana</option>
                    <option>Tripura</option>
                    <option>Uttar Pradesh</option>
                    <option>Uttarakhand</option>
                    <option>West Bengal</option>
                  </select>
                </label>
                <label>
                  Zip code
                  <input type="number" name="" placeholder="Zip code" />
                </label>
              </div>
            </form>
          </div>
          <div class="right">
            <h3>PAYMENT</h3>

            <form>
              Accepted Card <br />
              <img
                id="visa"
                src="https://i.im.ge/2022/07/23/F792dq.png"
                width="350"
              />

              <br /><br />

              Credit card number
              <input id="card_num" name="" placeholder="Enter card number" />

              Exp month
              <input type="text" name="" placeholder="Enter Month" />
              <div id="zip">
                <label>
                  Exp year
                  <select>
                    <option>Choose Year..</option>
                    <option>2022</option>
                    <option>2023</option>
                    <option>2024</option>
                    <option>2025</option>
                    <option>2026</option>
                    <option>2027</option>
                    <option>2028</option>
                  </select>
                </label>
                <label>
                  CVV
                  <input type="number" name="" placeholder="CVV" />
                </label>
              </div>
            </form>

            <button id="cnfPayment">Place Order</button>
          </div>
        </div>
      </div>
    </div>
    <p id="dot">
      ........................................................................................................................................................................................................
    </p>
    <p id="last">
      This order total is 100% guaranteed. There will be no additional charges
      due upon receipt.
    </p>
    <p id="f">
      By placing your order, you agree to the Terms & Conditions and Privacy
      Policy of Borderfree from Pitney Bowes, Nordstrom’s international
      fulfillment service. Borderfree is an online merchant that is located at
      Shelton, US, 06484, 27 Waterview Dr, CT.
    </p>

    <!-- <a href=""></a> -->
  </body>
</html>
<script src="./scripts/test.js" type="module"></script>

<script>
  document.getElementById("card_num").setAttribute("type", "number");

  document.getElementById("cnfPayment").addEventListener("click", cnf);

  function cnf() {
    window.confirm("Are You Sure !!");
    setTimeout(function () {
      alert("Your Order is Confirm !");
    }, 2000);
    setTimeout(function () {
      alert("Thanks For Shopping !");
      window.location.href = "index.html";
    }, 4000);
  }
</script>