Merge branch 'master' into master · k1499/30DaysOfJavaScript@9c5fec1 · GitHub
Skip to content

Commit 9c5fec1

Browse files
Hetu1107Hetu1107
authored
Merge branch 'master' into master
2 parents 2383fd2 + ef44053 commit 9c5fec1

14 files changed

Lines changed: 707 additions & 66 deletions

File tree

‎03 - Random Color Generator/index.html‎

Lines changed: 32 additions & 26 deletions

‎03 - Random Color Generator/main.js‎

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,38 @@
11
window.onload = function () {
22
addColor();
3-
};
4-
3+
};
4+
55
for (let i = 1; i <= 9; i++) {
66
const box = document.createElement('div');
77
box.classList.add('box');
88
document.querySelector('.container').appendChild(box);
9+
box.style.cursor = 'pointer';
10+
box.addEventListener('click', () => {
11+
console.log(box.innerHTML);
12+
navigator.clipboard.writeText(box.innerHTML);
13+
});
914
}
1015

1116
const btn = document.querySelector('.btn');
1217
const randomColorBlock = document.querySelectorAll('.box');
1318

14-
function RandomHexColorCode(){
15-
var chars = "0123456789abcdef";
19+
function RandomHexColorCode () {
20+
var chars = '0123456789abcdef';
1621
var colorLength = 6;
17-
var color = "";
22+
var color = '';
1823

19-
for (var i=0 ; i<colorLength ; i++){
24+
for (var i = 0; i < colorLength; i++) {
2025
var randomColor = Math.floor(Math.random() * chars.length);
21-
color += chars.substring(randomColor, randomColor+1);
26+
color += chars.substring(randomColor, randomColor + 1);
2227
}
23-
return "#"+color;
28+
return '#' + color;
2429
}
2530

26-
function addColor(){
27-
randomColorBlock.forEach(e =>{
31+
function addColor () {
32+
randomColorBlock.forEach(e => {
2833
var newColor = RandomHexColorCode();
2934
e.style.backgroundColor = newColor;
30-
e.innerHTML= newColor;
31-
})
32-
}
35+
e.innerHTML = newColor;
36+
});
37+
}
38+

‎03 - Random Color Generator/style.css‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,8 +71,62 @@ footer a:visited {
7171
color: inherit;
7272
}
7373

74+
.item {
75+
display: flex;
76+
flex-direction: row;
77+
}
78+
79+
.copy {
80+
color: white;
81+
padding: 15px 60px;
82+
font-size: 1.5rem;
83+
margin: 20px auto;
84+
background: #333;
85+
}
86+
87+
.body {
88+
display: flex;
89+
flex-direction: column;
90+
}
91+
7492
@media (max-width: 500px) {
7593
.box {
7694
font-size: 0.8rem;
7795
}
7896
}
97+
98+
@media (max-width: 450px) {
99+
.item {
100+
flex-direction: column;
101+
}
102+
.btn {
103+
width: 100%;
104+
}
105+
.copy {
106+
margin-left: 0px;
107+
width: 100%;
108+
}
109+
}
110+
111+
@media (max-width: 450px) {
112+
.copy {
113+
width: 100%;
114+
}
115+
}
116+
117+
@media (max-width: 840px) {
118+
.copy {
119+
margin-left: 10px;
120+
}
121+
}
122+
123+
@media (max-width: 300px) {
124+
.copy {
125+
padding: 5px;
126+
width: fit-content;
127+
text-align: center;
128+
}
129+
.btn {
130+
padding: 5px;
131+
}
132+
}

‎08 - Number Counter/index.html‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,11 +25,16 @@ <h3 class = "heading">Number Counter</h3>
2525
<div class = "button">
2626
<div class = "save">Save</div>
2727
</div>
28+
29+
<div class="button">
30+
<div class="deleted">Delete</div>
31+
</div>
2832
</div>
2933
<div class = "right">
3034
<div class = "heading">Numbers saved:</div>
3135
<div class = "number"></div>
3236
</div>
37+
3338
</div>
3439

3540

‎08 - Number Counter/script.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ const increase = document.querySelector('.increase');
33
const decrease = document.querySelector('.decrease');
44
const reset = document.querySelector('.reset');
55
const save = document.querySelector('.save');
6+
const deleted = document.querySelector('.deleted');
67

78
let count = 0;
89
increase.addEventListener('click', () => {
@@ -25,3 +26,9 @@ save.addEventListener('click', () => {
2526
num.innerHTML = count;
2627
number.appendChild(num);
2728
});
29+
30+
deleted.addEventListener('click',()=>{
31+
const number = document.querySelector('.number');
32+
number.innerHTML='';
33+
34+
})

‎08 - Number Counter/style.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@ footer a:visited {
9999
justify-content: center;
100100
}
101101

102-
.reset, .save {
102+
.reset, .save ,.deleted {
103103
cursor: pointer;
104104
color: white;
105105
padding: 20px;

‎30DaysOfJavaScript/assets/39.png‎

79.1 KB
Loading

‎39 - Age Calculator/assests/age-calculator.png‎

126 KB
Loading

‎39 - Age Calculator/font/sans.ttf‎

54.5 KB
Binary file not shown.

‎39 - Age Calculator/index.html‎

Lines changed: 62 additions & 0 deletions

0 commit comments

Comments
 (0)