-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
114 lines (114 loc) · 7.52 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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aaron's Website</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Anton&family=Roboto:wght@300&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Anton&display=swap" rel="stylesheet">
<link rel="icon" type="image/x-icon" href="./assets/images/favicon.ico">
<link rel="stylesheet" href="./styles.css" />
</head>
<body>
<section id="header" class="header-background">
<div class="banner-container">
<div class="logo">
<img src="./assets/images/logo.png" alt="Logo" height="90px">
</div>
<div class="contact-container">
<p>Contact</p>
<ul class="contact-list">
<li><a href="https://www.instagram.com/aaron_devil_dsouza/"><img src="./assets/images/instagram.png" alt="Instagram Link" class="social"></a></li>
<li><a href="https://twitter.com/DerilAaron"><img src="./assets/images/twitter.png" alt="Twitter Link" class="social"></a></li>
<li><a href="mailto:aaronddouza@gmail.com"><img src="./assets/images/mail.png" alt="Email" class="social"></a></li>
<li><a href="https://github.com/etheriousking"><img src="./assets/images/github.png" alt="Github Link" class="social"></a></li>
<li><a href="www.linkedin.com/in/aaron-deril-dsouza"><img src="./assets/images/linkedin.png" alt="Linkedin Link" class="social"></a></li>
</ul>
</div>
<div class="nav-menu">
<label for="menu">☰</label>
<input type="checkbox" id="menu" />
<ul class="nav-list">
<li class="nav-item"><a href="#top"><img src="./assets/images/home.png" alt="home" height="40px"><br/>Home</a></li>
<li class="nav-item"><a href="#projects"><img src="./assets/images/folder.png" alt="project" height="40px"><br/>Projects</a></li>
<li class="nav-item"><a href="#skills"><img src="./assets/images/skills.png" alt="skills" height="40px"><br/>Skills</a></li>
<li class="nav-item"><a href="#about"><img src="./assets/images/user.png" alt="About Me" height="40px"><br/>About Me</a></li>
<li class="nav-item"><a href="./assets/resume.pdf" download><img src="./assets/images/resume.png" alt="resume" height="40px"><br/> Download Resume</a></li>
</ul>
</div>
</div>
</section>
<section id="name" class="name-background">
<div class="name-container">
<div class="name-style">
<h1>Aaron Deril Dsouza</h1>
</div>
</div>
</section>
<section id="about" class="about-backkground">
<div class="about-me">
<h2>About Me</h2>
<p>I'm an aspiring software developer who is driven by a relentless desire to enhance my skillset and stay at the forefront of the ever-evolving tech industry. With a profound passion for Cloud and its associated technologies, I eagerly explore innovative solutions and keep a keen eye out for the latest developments in the field. I thrive on challenges and I'm constantly seeking new and exciting opportunities that will not only allow me to refine my abilities but also contribute to the growth and success of an organization. I am eager to find an environment that nurtures continuous learning, where I can further develop my skills while making a meaningful impact.</p>
</div>
</section>
<section id="skills" class="skill-background">
<div class="my-skills">
<h2>My Skills</h2>
<div class="skills-container">
<div><img src="./assets/images/html-logo.png" alt="HTML icon"><br/><span>HTML5</span></div>
<div><img src="./assets/images/css-logo.png" alt="CSS icon"><br/><span>CSS3</span></div>
<div><img src="./assets/images/javascript-logo.png" alt="Javascript icon"><br/><span>Javascript</span></div>
<div><img src="./assets/images/bootstrap-logo.png" alt="bootstrap icon"><br/><span>Bootstrap</span></div>
<div><img src="./assets/images/jQuery-logo.png" alt="jQuery icon"><br/><span>jQuery</span></div>
<div><img src="./assets/images/node-logo.png" alt="NodeJS icon"><br/><span>NodeJS</span></div>
<div><img src="./assets/images/express-logo.png" alt="express icon"><br/><span>ExpressJS</span></div>
<div><img src="./assets/images/git-logo.png" alt="Git icon"><br/><span>Git</span></div>
<div><img src="./assets/images/aws-logo.png" alt="AWS icon"><br/><span>AWS</span></div>
</div>
</div>
</section>
<section id="carousel" class="carousel-background">
<h2>Hobbies</h2>
<div class="carousel-container">
<div class="carousel-item"><img src="./assets/images/book.png" alt="Book"><br/><p>Reading</p></div>
<div class="carousel-item"><img src="./assets/images/briefcase.png" alt="Briefcase"><br/><p>Travelling</p></div>
<div class="carousel-item"><img src="./assets/images/controller.png" alt="Controller"><br/><p>Gaming</p></div>
<div class="carousel-item"><img src="./assets/images/headphones.png" alt="Headphones"><br/><p>Music</p></div>
<div class="carousel-item"><img src="./assets/images/tv.png" alt="TV"><br/><p>Anime</p></div>
</div>
</section>
<section id="projects" class="project-background">
<h2>Projects</h2>
<div id="project-carousel">
<a href="https://etheriousking.github.io/html-resume/">
<div class="projects-container">
<div class="card">
<img src="./assets/images/html-resume.png" alt="html-resume">
<h3>HTML Resume</h3>
<p>Created an Resume using nothing but vanilla HTML</p>
</div>
</div>
</a>
<a href="https://etheriousking.github.io/pomodoro-timer/">
<div class="projects-container">
<div class="card">
<img src="./assets/images/pomodoro-timer.png" alt="pomodoro-timer">
<h3>Pomodoro Timer</h3>
<p>Created a Pomodoro Timer using vanilla HTML, CSS and Javascript</p>
</div>
</div>
</a>
</div>
</section>
<section id="footer">
<footer class="footer">
<div class="footer-container">
<div class="footer-content"><p>© 2023 Aaron Deril Dsouza</p></div>
</div>
</footer>
</section>
</body>
</html>