<!
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Resume</title>
<!-- Bootstrap CSS -->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet">
<!-- Custom CSS -->
<style>
body {
font-family: Arial, sans-serif;
}
.profile-img {
border-radius: 50%;
width: 150px;
height: 150px;
}
.skills-bar {
margin-bottom: 15px;
}
.skills-bar .progress-bar {
background-color: #007bff;
}
</style>
</head>
<body>
<!-- Header Section -->
<header class="bg-primary text-white text-center py-5">
<div class="container">
<img src="profile.jpg" alt="Profile Picture" class="profile-img">
<h1 class="my-3">John Doe</h1>
<p>Full Stack Developer | JavaScript Enthusiast</p>
</div>
</header>
<!-- About Section -->
<section class="container my-5">
<h2>About Me</h2>
<p>I am a full stack developer with a passion for creating dynamic and
responsive web applications...</p>
</section>
<!-- Skills Section -->
<section class="container my-5">
<h2>Skills</h2>
<div class="skills-bar">
<h4>JavaScript</h4>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width:
90%;">90%</div>
</div>
</div>
<div class="skills-bar">
<h4>HTML & CSS</h4>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width:
80%;">80%</div>
</div>
</div>
<!-- Add more skills as needed -->
</section>
<!-- Experience Section -->
<section class="container my-5">
<h2>Experience</h2>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Senior Developer at ABC Corp</h5>
<p class="card-text">June 2018 - Present</p>
<p>Responsible for leading the development team and designing
scalable web applications...</p>
</div>
</div>
<!-- Add more experiences as needed -->
</section>
<!-- Education Section -->
<section class="container my-5">
<h2>Education</h2>
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title">Bachelor of Computer Science</h5>
<p class="card-text">XYZ University, 2014 - 2018</p>
<p>Graduated with honors and specialized in software
engineering...</p>
</div>
</div>
<!-- Add more education details as needed -->
</section>
<!-- Contact Section -->
<section class="bg-light py-5">
<div class="container text-center">
<h2>Contact Me</h2>
<p>Email:
[email protected]</p>
<p>Phone: (123) 456-7890</p>
<button id="downloadResume" class="btn btn-primary">Download
Resume</button>
</div>
</section>
<!-- Bootstrap JS and dependencies -->
<script
src="https://cdn.jsdelivr.net/npm/
[email protected]/dist/js/bootstrap.bundle.min.js">
</script>
<!-- Custom JavaScript -->
<script>
document.getElementById('downloadResume').addEventListener('click',
function() {
alert('Resume download feature coming soon!');
});
</script>
</body>
</html>
