Skip to content

Commit 5c2464d

Browse files
Tejas1510Tejas1510
authored
Merge pull request #1113 from Tanaya555/main
Add files via upload
2 parents 9d09fce + ebe7b35 commit 5c2464d

23 files changed

Lines changed: 878 additions & 0 deletions

‎Javascript/a mini project using html,css and javascript/blog.jpeg‎

125 KB
Loading

‎Javascript/a mini project using html,css and javascript/bookpay.html‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
<html>
2+
<head>
3+
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
4+
<style type="text/css">
5+
body{
6+
background-image:url("https://image.shutterstock.com/image-photo/credit-card-close-shot-selective-260nw-567634105.jpg");
7+
background-size: cover;
8+
9+
}
10+
.form-style-8{
11+
font-family: 'Open Sans Condensed', arial, sans;
12+
width: 500px;
13+
padding: 30px;
14+
background: #FFFFFF;
15+
margin: 50px auto;
16+
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.22);
17+
18+
19+
}
20+
.form-style-8 h2{
21+
background: #4D4D4D;
22+
text-transform: uppercase;
23+
font-family: 'Open Sans Condensed', sans-serif;
24+
color: #797979;
25+
font-size: 28px;
26+
font-weight: 100;
27+
padding: 20px;
28+
margin: -30px -30px 30px -30px;
29+
}
30+
.form-style-8 input[type="text"],
31+
.form-style-8 input[type="date"],
32+
33+
34+
.form-style-8 input[type="number"],
35+
36+
37+
.form-style-8 input[type="password"],
38+
.form-style-8 input[type="tel"],
39+
.form-style-8 textarea,
40+
.form-style-8 select
41+
{
42+
box-sizing: border-box;
43+
outline: none;
44+
display: block;
45+
width: 100%;
46+
padding: 7px;
47+
border: none;
48+
border-bottom: 1px solid #ddd;
49+
background: transparent;
50+
margin-bottom: 10px;
51+
font: 16px Arial, Helvetica, sans-serif;
52+
height: 45px;
53+
}
54+
55+
.form-style-8 input[type="submit"],
56+
.form-style-8 input[type="submit"]{
57+
-moz-box-shadow: inset 0px 1px 0px 0px #45D6D6;
58+
-webkit-box-shadow: inset 0px 1px 0px 0px #45D6D6;
59+
box-shadow: inset 0px 1px 0px 0px #45D6D6;
60+
background-color: #2CBBBB;
61+
border: 1px solid #27A0A0;
62+
display: inline-block;
63+
cursor: pointer;
64+
color: #FFFFFF;
65+
font-family: 'Open Sans Condensed', sans-serif;
66+
font-size: 14px;
67+
padding: 8px 18px;
68+
text-decoration: none;
69+
text-transform: uppercase;
70+
}
71+
.form-style-8 input[type="button"]:hover,
72+
.form-style-8 input[type="submit"]:hover {
73+
background:linear-gradient(to bottom, #34CACA 5%, #30C9C9 100%);
74+
background-color:#34CACA;
75+
}
76+
.center {
77+
display: block;
78+
margin-left: auto;
79+
margin-right: auto;
80+
width: 50%;
81+
}
82+
</style>
83+
</head>
84+
<body>
85+
<div class="form-style-8">
86+
<h2>Fill the given information</h2>
87+
<img src="credit.jpg" class="center">
88+
<form onsubmit="generateOTP()";>
89+
<table>
90+
<tr>Card Number:<input type="tel" pattern="[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{4}" name="field1" required placeholder="xxxx xxxx xxxx xxxx" label="name"></tr>
91+
<tr> <td>Card holder name:<input type="text" name="field2" required placeholder="enter name" /></td>
92+
<td>Expiry date:<input type="date" required placeholder="enter expiry date" ></td>
93+
</tr>
94+
<tr>
95+
<td>Enter CVV:<input type="password" name="password" required placeholder="***"></td>
96+
</tr>
97+
</table>
98+
99+
<br>
100+
<input type="submit" value="Generate OTP"/>
101+
<input type="submit" value="Cancel" /><br><br>
102+
<input type="submit" value="Go back to home page" />
103+
104+
</form>
105+
</div>
106+
<script>
107+
function generateOTP() {
108+
109+
// Declare a digits variable
110+
// which stores all digits
111+
var digits = '0123456789';
112+
let OTP = '';
113+
for (let i = 0; i < 4; i++ ) {
114+
OTP += digits[Math.floor(Math.random() * 10)];
115+
}
116+
alert("your otp of 4 digit is-"+OTP);
117+
var y = prompt("Please enter otp");
118+
if(y==OTP)
119+
{alert("you have entered correct otp");
120+
alert("Congratulations!! your transaction is succesfull.");}
121+
else{alert("you have entered incorrect otp.Try again!!")};
122+
123+
}
124+
</script>
125+
</body>
126+
</html>

‎Javascript/a mini project using html,css and javascript/credit.jpg‎

13.2 KB
Loading

‎Javascript/a mini project using html,css and javascript/facebook.png‎

81.2 KB
Loading

‎Javascript/a mini project using html,css and javascript/instagram.png‎

15.8 KB
Loading

0 commit comments

Comments
 (0)