Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
mandoof1 authored Nov 24, 2023
0 parents commit 19630e1
Showing 3 changed files with 249 additions and 0 deletions.
113 changes: 113 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<link rel="stylesheet" href="styles.css">
<title>Hadi Abdulrahman Al Nather - Cyber Security Professional</title>
</head>
<body>
<div class="container">
<header>
<h1>Hadi Abdulrahman Al Nather</h1>
<p>Cyber Security Engineering Student</p>
</header>

<section id="contact" class="contact fade-in">
<h2>Contact Information</h2>
<p>Email: <a href="mailto:Haadii2005@gmail.com">Haadii2005@gmail.com</a></p>
<p>Mobile: <a href="tel:+971503272083">+971 503272083</a></p>
<p>LinkedIn: <a href="https://www.linkedin.com/in/hadi-abdulrahman-b54816261/">Hadi Abdulrahman</a></p>
</section>

<section id="summary" class="fade-in">
<h2>Summary</h2>
<p>Cyber Security engineering student looking for experience in software engineering, IT, Data, Cyber Security machine learning and data science. I’m also a golden visa owner.</p>
</section>

<section id="education" class="fade-in">
<h2>Education</h2>
<p>Bachelor of Science in Cyber Security Engineering | Abu Dhabi University | August 2021 - (Expected) June 2025 | CGPA: 3.9/4<br>
Relevant Coursework: Structed Programming, Development, Machine Learning & Pattern Recognition, Introductory Big Data Analytics, Cisco Cyber Security Training, and self-training</p>
</section>

<section id="work-experience" class="fade-in">
<h2>Work Experience</h2>
<p>Cyber Security Agent | December 2022 – January 2023 | Abu Dhabi University, Mubadala Hybrid<br>
• Found security flaws and assisted in fixing them.<br>
• Maintained the security of the website and performed pen testing.<br>
• Collaborated with the university to enhance website functionality.<br>
• Provided IT support for students and employees.</p>
</section>

<section id="volunteering" class="fade-in">
<h2>Volunteering</h2>
<h3>University Volunteering | September 2021</h3>
<p>Contributed 100 hours of my time volunteering to my university.<br>
Processed and thought of multiple events and helped in organizing them.<br>
Trained and educated other students on how to volunteer and the correct etiquettes to have during volunteering.</p>

<h3>Hazza Stadium Volunteering | May 2022</h3>
<p>Contributed over 30 hours in volunteering for Hazza bin Zayed stadium.<br>
Managed and organized some of the biggest football matches that happened.<br>
Evaluated performance of the teams that played.</p>

<h3>Wadi Park Volunteering | November 2022</h3>
<p>Contributed over 16 hours of volunteering in Wadi Park.<br>
Utilized my time to help enrich and better the community around me.<br>
Organized an event for children where massive crowds attended.</p>
</section>

<section id="skills" class="fade-in">
<h2>Skills</h2>
<div class="skills-grid">
<div class="skill">
<span class="icon" data-tooltip="Java"><i class="fab fa-java"></i></span>
<p>Proficient: Java</p>
</div>
<div class="skill">
<span class="icon" data-tooltip="Python"><i class="fab fa-python"></i></span>
<p>Proficient: Python</p>
</div>
<div class="skill">
<span class="icon" data-tooltip="C#"><i class="fab fa-csharp"></i></span>
<p>Proficient: C#</p>
</div>
<div class="skill">
<span class="icon" data-tooltip="Bash"><i class="fas fa-terminal"></i></span>
<p>Proficient: Bash</p>
</div>
<div class="skill">
<span class="icon" data-tooltip="JavaScript"><i class="fab fa-js"></i></span>
<p>Familiar: JavaScript</p>
</div>
<div class="skill">
<span class="icon" data-tooltip="C++"><i class="fas fa-cuttlefish"></i></span>
<p>Familiar: C++</p>
</div>
<div class="skill">
<span class="icon" data-tooltip="SQL"><i class="fas fa-database"></i></span>
<p>Familiar: SQL</p>
</div>
</div>
</section>

<section id="language-proficiencies" class="fade-in">
<h2>Language Proficiencies</h2>
<p>English (Fluent, Emsat Score: 1900), Arabic (Native Language)</p>
</section>

<section id="awards" class="fade-in">
<h2>Awards and Achievements</h2>
<p>Award of Appreciation From Abu Dhabi University - September 2021<br>
For the countless hours that have been contributed towards the bettering of the university</p>

<p>Cisco Certificate of Cyber Security - August 2023<br>
For putting in the time and effort to self-study Cyber Security and improving my skills</p>
</section>
</div>

<script src="script.js"></script>
</body>
</html>
23 changes: 23 additions & 0 deletions script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
// Smooth scroll
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();

document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});

// Fade in elements on scroll
document.addEventListener('scroll', function() {
const fadeElements = document.querySelectorAll('.fade-in');

fadeElements.forEach(element => {
const position = element.getBoundingClientRect().top;
const windowHeight = window.innerHeight;
if (position < windowHeight) {
element.classList.add('visible');
}
});
});
113 changes: 113 additions & 0 deletions styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
body {
font-family: 'Helvetica Neue', Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #24292e; /* Darker blue-gray background */
color: #ffffff; /* White text color */
}

.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #32383e; /* Blue-gray background */
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Subtle box shadow */
border-radius: 12px; /* Rounded corners */
}

header {
background: #0366d6; /* Blue background */
color: #ffffff; /* White text color */
text-align: center;
padding: 1em;
border-radius: 12px 12px 0 0; /* Rounded corners only at the top */
margin-bottom: 20px;
}

h1 {
margin: 0;
font-size: 2em; /* Larger font size */
}

.contact, .fade-in {
margin: 20px 0;
padding: 20px;
background-color: #394048; /* Darker blue-gray background */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle box shadow */
border-radius: 12px; /* Rounded corners */
opacity: 0; /* Start with elements hidden */
transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; /* Adding transition effects */
}

.contact:hover, .fade-in:hover {
transform: scale(1.05); /* Enlarge the section on hover */
}

.contact.visible, .fade-in.visible {
opacity: 1; /* Fade in elements on scroll */
}

h2 {
color: #ffffff; /* White text color */
font-size: 1.5em; /* Larger font size */
}

h3 {
color: #61dafb; /* Lighter blue text color */
}

a {
color: #61dafb; /* Lighter blue text color */
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

/* Modern Icons Styling with Hover Effects */
.icon {
font-size: 2em;
margin-right: 10px;
color: #61dafb; /* Lighter blue color for icons */
transition: transform 0.3s ease-in-out, font-size 0.3s ease-in-out;
}

.icon:hover {
transform: scale(1.2); /* Enlarge the icon on hover */
font-size: 2.2em; /* Increase font size on hover */
}

/* Tooltip Styling */
[data-tooltip] {
position: relative;
cursor: pointer;
}

[data-tooltip]::before {
content: attr(data-tooltip);
position: absolute;
background: #333333; /* Tooltip background color */
color: #ffffff; /* Tooltip text color */
padding: 5px;
border-radius: 5px;
font-size: 0.8em;
opacity: 0;
transition: opacity 0.3s ease-in-out;
}

[data-tooltip]:hover::before {
opacity: 1;
}

/* Grid Layout for Skills */
.skills-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 20px;
}

.skill {
display: flex;
align-items: center;
}

0 comments on commit 19630e1

Please sign in to comment.