Skip to content

Commit fd39930

Browse files
MDJAminMDJAmin
committed
Code 2 - Class 8
1 parent 11af24e commit fd39930

6 files changed

Lines changed: 232 additions & 0 deletions

File tree

‎Block Chain Collage Code 2/8/Razer/Leonardo_Phoenix_A_sleek_highgloss_pink_Razer_gaming_headset_r_2.jpg‎

608 KB
Loading

‎Block Chain Collage Code 2/8/Razer/headphone.png‎

456 KB
Loading

‎Block Chain Collage Code 2/8/Razer/index.html‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta
6+
name="viewport"
7+
content="width=device-width, initial-scale=1.0"
8+
/>
9+
<link
10+
rel="stylesheet"
11+
href="style.css"
12+
/>
13+
<title>Razer</title>
14+
</head>
15+
<body>
16+
<section>
17+
<div class="container">
18+
<div class="text-button">
19+
<h2>Head phone</h2>
20+
<div>
21+
<p>
22+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Vitae rerum porro
23+
consequatur? Possimus esse accusamus harum voluptatem quod sapiente odit quasi,
24+
molestiae cupiditate deserunt, laborum minus deleniti sunt exercitationem quas!
25+
</p>
26+
<button>Click</button>
27+
</div>
28+
</div>
29+
30+
<div>
31+
<img
32+
src="headphone.png"
33+
alt=""
34+
/>
35+
</div>
36+
37+
<div class="text">
38+
<p>
39+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Vitae rerum porro
40+
consequatur? Possimus esse accusamus harum voluptatem quod sapiente odit quasi,
41+
molestiae cupiditate deserunt, laborum minus deleniti sunt exercitationem quas!
42+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsam a consequuntur
43+
laudantium mollitia dolores eligendi libero, itaque eum sequi odit? Error ullam
44+
cumque, perspiciatis quam atque harum nihil cum architecto! Lorem ipsum dolor sit
45+
amet, consectetur adipisicing elit. Facere sint harum eaque recusandae tempora
46+
omnis accusamus est minus consequuntur, eum quibusdam soluta at unde vero nihil
47+
atque maiores non ipsam?
48+
</p>
49+
</div>
50+
</div>
51+
</section>
52+
53+
<!-- <div class="card">
54+
<div class="imageCover">
55+
<img
56+
src="Leonardo_Phoenix_A_sleek_highgloss_pink_Razer_gaming_headset_r_2.jpg"
57+
alt=""
58+
/>
59+
</div>
60+
<div class="content">
61+
<h4>pink panther Headphone</h4>
62+
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Autem, asperiores?</p>
63+
</div>
64+
</div> -->
65+
</body>
66+
</html>

‎Block Chain Collage Code 2/8/Razer/style.css‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
* {
2+
margin: 0;
3+
padding: 0;
4+
box-sizing: border-box;
5+
}
6+
7+
body {
8+
min-height: 100vh;
9+
background-color: black;
10+
}
11+
12+
div.card {
13+
margin: 20%;
14+
width: 300px;
15+
height: 300px;
16+
background-color: #fff;
17+
display: flex;
18+
flex-direction: column;
19+
justify-content: center;
20+
align-items: center;
21+
border-radius: 10px;
22+
}
23+
24+
div.imageCover {
25+
width: 200px;
26+
height: 200px;
27+
}
28+
29+
div.imageCover img {
30+
width: 100%;
31+
height: 100%;
32+
}
33+
34+
.content {
35+
display: flex;
36+
flex-direction: column;
37+
text-align: center;
38+
}
39+
40+
section {
41+
height: 70vh;
42+
width: 100%;
43+
padding: 40px;
44+
}
45+
46+
section div.container {
47+
width: 100%;
48+
height: 100%;
49+
display: flex;
50+
justify-content: space-between;
51+
border-radius: 10px;
52+
background-color: #fff;
53+
position: relative;
54+
}
55+
56+
section div img {
57+
position: absolute;
58+
width: 500px;
59+
bottom: -6px;
60+
left: 32%;
61+
}
62+
63+
section div.container div p {
64+
/* color: black; */
65+
}
66+
67+
@media (max-width: 580px) {
68+
section div img {
69+
width: 300px;
70+
}
71+
}
72+
73+
.text {
74+
width: 300px;
75+
background-color: aqua;
76+
margin: 30px;
77+
border-radius: 10px;
78+
padding: 10px;
79+
}
80+
81+
.text-button {
82+
display: flex;
83+
flex-direction: column;
84+
width: 800px;
85+
padding: 40px;
86+
}
87+
88+
89+
.text-button div{
90+
width: 300px;
91+
}
92+
93+
h2{
94+
font-size: 3em;
95+
letter-spacing: 40px;
96+
}

‎Block Chain Collage Code 2/8/index.html‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Document</title>
7+
</head>
8+
<body>
9+
10+
11+
12+
<script src="js/script.js"></script>
13+
</body>
14+
</html>

‎Block Chain Collage Code 2/8/js/script.js‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
// Array(5)
2+
3+
// let listOfAnimals = ["Cat", "Dog", "Bird", "Fox", "Wolf"];
4+
// console.log(listOfAnimals[1]);
5+
6+
// let listOfNumbers = [1, 4, 6, 8, 2, 536, 35, 43];
7+
// let listOfBooleans = [true, false, true, true];
8+
// let listOfObj = [
9+
// {
10+
// name: "amin",
11+
// age: "19",
12+
// },
13+
// { name: "mahdi" },
14+
// { name: "yasin" },
15+
// { name: "erfan" },
16+
// ];
17+
18+
// // console.log(listOfObj[2])
19+
// let listOfArray = [
20+
// [12, 1413, 421],
21+
// ["g", "h", "y"],
22+
// [true, {}, "5", 75],
23+
// ];
24+
25+
// console.log(listOfArray[0][2]);
26+
27+
// let listOfFunctions = [function work1() {}, function work2() {}];
28+
29+
// let arrayList = [
30+
// ["w0", "w1", " w2 "],
31+
// ["w3", "w4", "w5", ["8", 9, 7]],
32+
// ["w6", "w7", ["hello ", "good bye"], "w8"],
33+
// ["w16", "w2", "w45"],
34+
// ];
35+
36+
// console.log(arrayList[2][2][0] + arrayList[1][3][0] + arrayList[0][2] + arrayList[2][2][1]);
37+
38+
39+
let listOfAnimals = ["Cat", "Dog","Bird", "Rhino", "Wolf"];
40+
41+
// console.log("All animals:", listOfAnimals)
42+
// listOfAnimals.shift()
43+
// console.log("Remove first el:",listOfAnimals)
44+
// listOfAnimals.pop()
45+
// console.log("Remove last el:",listOfAnimals)
46+
// listOfAnimals.push("Bird")
47+
// console.log("add el:",listOfAnimals)
48+
49+
let newListOfAnimals = listOfAnimals.concat(["snake","Fox"])
50+
console.log("newListOfAnimals",newListOfAnimals)
51+
52+
console.log(newListOfAnimals.indexOf("wewbetgrnhf"))
53+
54+
55+
listOfAnimals.sort()
56+
console.log("sorted list:", listOfAnimals)

0 commit comments

Comments
 (0)