Skip to content

Commit aee43a5

Browse files
committed
Rock Paper Scissor Project Added
1 parent 7b226ea commit aee43a5

File tree

6 files changed

+66
-112
lines changed

6 files changed

+66
-112
lines changed

30DaysOfJavaScript/assets/37.png

22.4 KB
Loading

37 - RPS Game/font/sans.ttf

54.5 KB
Binary file not shown.

37 - RPS Game/index.html

+30-44
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,33 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<title>Document</title>
8-
<link rel="stylesheet" href="style.css" />
9-
<script src="start.js"></script>
10-
</head>
11-
<body>
12-
<div class="container">
13-
<div class="center">
14-
<h2>Stone Paper Scissors Game</h2>
15-
<br />
16-
<div>
17-
<img
18-
id="Rock"
19-
src="assets/images1.jpg"
20-
alt="Rock"
21-
height="150px"
22-
width="150px"
23-
onclick="rpsGame(id)"
24-
/>
25-
<img
26-
id="Paper"
27-
src="assets/images2.jpg"
28-
alt="Paper"
29-
height="150px"
30-
width="150px"
31-
onclick="rpsGame(id)"
32-
/>
33-
<img
34-
id="Scissors"
35-
src="assets/images3.jpg"
36-
alt="Scissors"
37-
height="150px"
38-
width="150px"
39-
onclick="rpsGame(id)"
40-
/>
41-
</div>
42-
</div>
43-
</div>
443

45-
<div id="message"></div>
46-
</body>
47-
</html>
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8+
<title>Rock Paper Scissors Game</title>
9+
<link rel="stylesheet" href="style.css" />
10+
<link rel="icon" href="./assets/images1.jpg">
11+
<script src="start.js" defer></script>
12+
</head>
13+
14+
<body>
15+
<h1>Rock Paper Scissors Game</h1>
16+
<div class="container">
17+
<img id="Rock" src="assets/images1.jpg" alt="Rock" onclick="rpsGame(id)" />
18+
<img id="Paper" src="assets/images2.jpg" alt="Paper" onclick="rpsGame(id)" />
19+
<img id="Scissors" src="assets/images3.jpg" alt="Scissors" onclick="rpsGame(id)" />
20+
</div>
21+
22+
<div id="message"></div>
23+
<footer>
24+
<p>&#x3c; &#47; &#x3e; with ❤️ by
25+
<a href="https://swapnilsparsh.github.io/">Swapnil Srivastava</a>
26+
<br>
27+
<a href="https://github.com/swapnilsparsh/30DaysOfJavaScript" target="_blank">#30DaysOfJavaScript
28+
</a>
29+
</p>
30+
</footer>
31+
</body>
32+
33+
</html>

37 - RPS Game/start.html

-47
This file was deleted.

37 - RPS Game/style.css

+33-18
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,26 @@
1-
body {
2-
background-color: #19172e;
3-
font-family: inter;
1+
* {
2+
padding: 0;
3+
box-sizing: border-box;
4+
font-family: "sans";
5+
}
6+
7+
@font-face {
8+
font-family: "sans";
9+
src: url(font/sans.ttf);
410
}
511

6-
h2 {
7-
/* font-style: oblique; */
12+
body {
13+
overflow: hidden;
14+
background: #19172e;
815
color: #fff;
9-
font-family: inter;
1016
text-align: center;
11-
font-size: 40px;
12-
padding: 0%;
17+
min-height: 100vh;
1318
}
1419

1520
img:hover {
1621
/* box-shadow: rgb(95, 9, 26) 10px 10px 10px; */
1722
border: 10px solid #929292;
23+
cursor: pointer;
1824
}
1925

2026
img {
@@ -25,26 +31,35 @@ img {
2531
transition: all 0.2s;
2632
}
2733

34+
#message {
35+
text-align: center;
36+
font-size: 32px;
37+
color: #fff;
38+
}
39+
2840
.container {
2941
max-width: 800px;
3042
display: flex;
3143
align-items: center;
3244
justify-content: center;
45+
flex-direction: row;
3346
margin: 100px auto 30px;
34-
border: 5px solid #fff;
3547
padding: 10px;
3648
}
37-
38-
.center {
39-
display: flex;
40-
flex-direction: column;
41-
justify-content: center;
42-
align-items: center;
49+
@media screen and (max-width: 600px) {
50+
.container{
51+
flex-direction: column;
52+
}
4353
}
4454

45-
#message {
46-
text-align: center;
47-
font-size: 32px;
4855

56+
footer, a{
4957
color: #fff;
5058
}
59+
60+
footer{
61+
text-align: center;
62+
position: absolute;
63+
bottom: 0;
64+
width: 100%;
65+
}

index.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -266,14 +266,14 @@ <h4>Decimal to Binary</h4>
266266
<img src="30DaysOfJavaScript/assets/36.png" alt="Hangman" />
267267
<h4>Hangman</h4>
268268
</a>
269-
</div>
269+
</div>-->
270270
<div class="item">
271-
<a target="_blank" href="37 - RPS Game/start.html">
271+
<a target="_blank" href="37 - RPS Game/index.html">
272272
<img src="30DaysOfJavaScript/assets/37.png" alt="Rock Paper Scissors Game" />
273273
<h4>Rock Paper Scissors</h4>
274274
</a>
275275
</div>
276-
<div class="item">
276+
<!--<div class="item">
277277
<a target="_blank" href="38 - Snake-Game/index.html">
278278
<img src="30DaysOfJavaScript/assets/38.png" alt="Snake Game" />
279279
<h4>Snake Game</h4>

0 commit comments

Comments
 (0)