Skip to content

Commit 3a98a23

Browse files
RohanHandoreRohanHandore
committed
Show toast message in Random Color Generator
1 parent 68db721 commit 3a98a23

File tree

2 files changed

+42
-34
lines changed

2 files changed

+42
-34
lines changed

‎03 - Random Color Generator/index.html

+40-34
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,45 @@
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>Random Color Generator</title>
8-
<link rel="stylesheet" href="style.css" />
9-
<link rel="shortcut icon" href="assets/wheel.png" type="image/x-icon" />
10-
</head>
11-
<body>
12-
<h2 class="heading">Random Color Generator</h2>
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>Random Color Generator</title>
8+
<link rel="stylesheet" href="style.css" />
9+
<link rel="shortcut icon" href="assets/wheel.png" type="image/x-icon" />
10+
<link
11+
rel="stylesheet"
12+
href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css"
13+
/>
14+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
15+
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
16+
</head>
17+
<body>
18+
<h2 class="heading">Random Color Generator</h2>
1319

14-
<div class="body">
15-
<div class="item">
16-
<button class="btn" onclick="addColor();">Refresh</button>
17-
<div class="copy">Click on any box below to copy the code.</div>
18-
</div>
19-
<div class="cont">
20-
<section class="container"></section>
21-
</div>
22-
</div>
23-
<br /><br />
24-
<footer>
25-
<p>
26-
&#x3c; &#47; &#x3e; with ❤️ by
27-
<a href="https://swapnilsparsh.github.io/">Swapnil Srivastava</a>
28-
<br />
29-
<a
30-
href="https://github.com/swapnilsparsh/30DaysOfJavaScript"
31-
target="_blank"
32-
>#30DaysOfJavaScript
33-
</a>
34-
</p>
35-
</footer>
20+
<div class="body">
21+
<div class="item">
22+
<button class="btn" onclick="addColor();">Refresh</button>
23+
<div class="copy">Click on any box below to copy the code.</div>
24+
</div>
25+
<div class="cont">
26+
<section class="container"></section>
27+
</div>
28+
</div>
29+
<br /><br />
30+
<footer>
31+
<p>
32+
&#x3c; &#47; &#x3e; with ❤️ by
33+
<a href="https://swapnilsparsh.github.io/">Swapnil Srivastava</a>
34+
<br />
35+
<a
36+
href="https://github.com/swapnilsparsh/30DaysOfJavaScript"
37+
target="_blank"
38+
>#30DaysOfJavaScript
39+
</a>
40+
</p>
41+
</footer>
3642

37-
<script src="main.js"></script>
38-
</body>
43+
<script src="main.js"></script>
44+
</body>
3945
</html>

‎03 - Random Color Generator/main.js

+2
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ for (let i = 1; i <= 9; i++) {
1010
box.addEventListener('click', () => {
1111
console.log(box.innerHTML);
1212
navigator.clipboard.writeText(box.innerHTML);
13+
console.log("copied");
14+
toastr.success('Now you can use it!', 'Copied to clipboard', {timeOut: 3000});
1315
});
1416
}
1517

0 commit comments

Comments
 (0)