-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
78 lines (78 loc) · 3.5 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<!-- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymo></script> -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
<link href="css/style.css" rel="stylesheet">
<title>Yoseph_ABZ</title>
</head>
<body>
<header>
<div class="container">
<div class="row">
<div class="col mr-auto">
<a href="index.html" class="header-logo col"> Yoseph_ABZ</a>
</div>
<nav class="header-menu">
<ul>
<li><a href="about.html">About</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</div>
</div>
</header>
<main>
<section class="home-about animation">
<div class="container justify-content-center">
<div class="row animation">
<div class="col-6 mr-auto">
<p>Hi, I am</p>
<h1>Yoseph_ABZ</h1>
<p class="mb-4">I created this web pages according to harvard computer science program 2022 (week 8). "In some ways, programming is like painting. You start with a blank canvas and certain basic raw materials. You use a combination of science, art, and craft to determine what to do with them." <i>Andrew Hunt</i></p>
<div class="text-center">
<a href="about.html" class="btn">About Me</a>
</div>
</div>
<div class="col-6">
<img src="img/imgg.png" alt="Me">
</div>
</div>
</div>
</section>
<section class="home-projects animation-2">
<div class="container ">
<h2> <i> My interest ......</i></h2>
<div class="row justify-content-center">
<div class="col-4"><img src="img/Technology.jpg" alt="project"> <br> </div>
<div class="col-6">
<h3>Technology</h3>
<p>I study computer science with harvard university. Also web development and cyber security through online courses and bootcamps...etc. i'm interested in blockchain, cloud computing, and AI. I'm looking to do big stuff in the field of tech, especially we are now in the tech generation. </p>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class=" container">
<div class="row">
<div class="col-3 mr-auto">
<p>© Yoseph_ABZ</p>
</div>
<div class="social-networks">
<a href="https://github.com/youssefadbz" target="_blank"><img src="img/github.svg" alt=""></a>
<a href="https://www.linkedin.com/in/youssef-adebouz-989124170" target="_blank"><img src="img/linkendin.svg" alt=""></a>
<a href="https://www.facebook.com/youssef.adebouz" target="_blank"><img src="img/facebook.svg" alt=""></a>
</div>
</div>
</div>
</footer>
<script>
$(".animation").delay(100).animate({ opacity: 1 }, 700);
$(".animation-2").delay(1000).animate({ opacity: 1 }, 700);
</script>
</body>
</html>