Skip to content

Commit f24dc25

Browse files
nlmohdnlnlmohdnl
committed
2 parents 2a66b91 + b64a54c commit f24dc25

14 files changed

Lines changed: 375 additions & 13 deletions

‎Week1/homework/app.js‎

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎Week1/homework/index.html‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎Week1/homework/js-exercises/0.jpg‎

8.91 KB
Loading

‎Week1/homework/js-exercises/1.jpg‎

5.58 KB
Loading

‎Week1/homework/js-exercises/2.jpg‎

5.59 KB
Loading

‎Week1/homework/js-exercises/about_me.html‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>About Me</title>
6+
</head>
7+
<body>
8+
<h1>About Me</h1>
9+
10+
<ul>
11+
<li>Nickname: <span id="nickname"></span></li>
12+
<li>Favorite food: <span id="fav-food"></span></li>
13+
<li>Hometown: <span id="hometown"></span></li>
14+
</ul>
15+
<script>
16+
document.body.style.fontFamily="Arial, sans-serif"
17+
document.getElementById("nickname").innerText=" Abo Taim";
18+
document.getElementById("fav-food").innerText=" Chips";
19+
document.getElementById("hometown").innerText=" Damascus";
20+
21+
22+
23+
24+
let listItems = document.querySelector('ul').children;
25+
for (let i=0; i<listItems.length; i++){
26+
listItems[i].setAttribute("class", "list-item");
27+
}
28+
29+
30+
const head = document.querySelector('head');
31+
let style = document.createElement('style');
32+
style.innerHTML = ".list-item {color: red;}";
33+
head.appendChild(style);
34+
35+
let image =document.createElement('img');
36+
image.src="me.png"
37+
image.style.width="10%"
38+
image.style.margin="2%"
39+
document.querySelector("body").appendChild(image);
40+
41+
42+
43+
</script>
44+
</body>
45+
</html>

‎Week1/homework/js-exercises/hijackGoogleLogo.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
function hijackGoogleLogo() {
2+
const googleLogo = document.getElementById('hplogo');
3+
googleLogo.src = 'https://www.hackyourfuture.dk/static/logo-dark.svg';
4+
googleLogo.srcset = 'https://www.hackyourfuture.dk/static/logo-dark.svg';
5+
};
6+
hijackGoogleLogo();

‎Week1/homework/js-exercises/me.png‎

320 KB
Loading

‎Week1/homework/js-exercises/randomQuoteGenerator.html‎

Lines changed: 170 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<link rel="stylesheet" href="style.css">
6+
<title>Random Quote Generator</title>
7+
<style>
8+
9+
10+
*{
11+
margin: 0;
12+
padding: 0;
13+
box-sizing: border-box;
14+
font-family : Helvetica, sans-serif, serif;
15+
}
16+
17+
body {
18+
background-color: #fba62f;
19+
height: 100vh;
20+
display: flex;
21+
justify-content: center;
22+
align-items: center;
23+
24+
}
25+
.main-box{
26+
display: flex;
27+
flex-direction: column;
28+
justify-content: space-between;
29+
background-color: #fff;
30+
height: 50vh;
31+
}
32+
.main-box h1 span{
33+
font-size: 36px;
34+
}
35+
.color{
36+
color: #fba62f;
37+
}
38+
.main-box h1
39+
{
40+
font-size: 48px;
41+
text-align: center;
42+
margin: 40px 20px 0 20px;
43+
}
44+
h3 {
45+
font-size: 1.5vw;
46+
align-self: flex-end;
47+
margin: 20px 40px 20px 20px;
48+
49+
}
50+
main {
51+
width: 60vw;
52+
display: flex;
53+
flex-direction: column;
54+
}
55+
button {
56+
background-color: #fba62f;
57+
height: 40px;
58+
width: 130px;
59+
color: #fff;
60+
font-weight: bold;
61+
padding: 10px;
62+
border: none;
63+
font-size: 12px;
64+
}
65+
66+
67+
.bottom{
68+
margin: 20px 40px;
69+
display: flex;
70+
justify-content: space-between;
71+
}
72+
.fab{
73+
margin-left: 20px;
74+
color: #fff;
75+
background-color: #fba62f;
76+
}
77+
.fa-tumblr{
78+
width: 30px;
79+
}
80+
.fa-tumblr,
81+
.fa-twitter{
82+
padding: 5px;
83+
}
84+
.sec-rect{
85+
background-color: #fff;
86+
width: 30 vw;
87+
height: 50px;
88+
margin: 6px auto;
89+
}
90+
</style>
91+
92+
</head>
93+
<body>
94+
<main>
95+
<div class="main-box">
96+
<h1 class="quotes color"><i class="fas fa-quote-left"></i>
97+
<span id="quote"> Quotes are here!</span>
98+
</h1>
99+
<h3 class="color">
100+
<span id="author">Author is here!</span></h3>
101+
<div class="bottom">
102+
<div class="icons left">
103+
<a href=""><i class="fab fa-twitter color fa-2x"></i></a>
104+
<a href=""><i class="fab fa-tumblr color fa-2x"></i></a>
105+
</div>
106+
<button>New Quote</button>
107+
</div>
108+
</div>
109+
110+
<div class="sec-rect"></div>
111+
112+
</main>
113+
<script>
114+
'use strict';
115+
116+
const quotes = [
117+
{
118+
quote:"Knowing yourself is the beginning of all wisdom.",
119+
author:"Aristotle"
120+
},
121+
{
122+
quote:"The only true wisdom is in knowing you know nothing.",
123+
author: "Socrates"
124+
},
125+
{
126+
quote:"Count your age by friends, not years. Count your life by smiles, not tears.",
127+
author:"John Lennon"
128+
},
129+
{
130+
quote:"The saddest aspect of life right now is that science gathers knowledge faster than society gathers wisdom.",
131+
author: "Isaac Asimov"
132+
},
133+
{
134+
quote:"May you live every day of your life.",
135+
author: " Jonathan Swift"
136+
},
137+
{
138+
quote:"The secret of life, though, is to fall seven times and to get up eight times.",
139+
author:"Paulo Coelho"
140+
}
141+
]
142+
143+
const quoteHold = document.querySelector('#quote');
144+
const authorHold = document.querySelector('#author');
145+
const button = document.querySelector('button');
146+
147+
148+
button.addEventListener('click', randomQuote);
149+
150+
function randomQuote() {
151+
const random = Math.floor(Math.random() * quotes.length)
152+
quoteHold.innerText = quotes[random].quote;
153+
authorHold.innerText = quotes[random].author;
154+
}
155+
</script>
156+
157+
</body>
158+
</html>
159+
160+
161+
162+
163+
164+
165+
166+
167+
168+
169+
170+

‎Week1/homework/js-exercises/showCurrentTime.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
2+
window.onload = setInterval(startTime, 1000 );
3+
4+
5+
const body = document.querySelector('body');
6+
let currentTime = document.createElement('h1');
7+
currentTime.style = "width: 20%; margin: auto; display: block; text-align: center;"
8+
body.appendChild(currentTime);
9+
10+
function startTime(){
11+
12+
let today = new Date();
13+
let h = today.getHours();
14+
let m = correctTime(today.getMinutes());
15+
let s = correctTime(today.getSeconds());
16+
currentTime.innerHTML = h + ":" + m + ":" + s;
17+
}
18+
19+
20+
function correctTime(i) {
21+
if (i < 10) {
22+
i = "0" + i
23+
}
24+
return i;
25+
}

0 commit comments

Comments
 (0)