Skip to content

Commit

Permalink
first commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@Miraj06
Miraj06 committed Jul 14, 2023
1 parent 0030ba2 commit ca640bb
Show file tree
Hide file tree
Showing 8 changed files with 733 additions and 0 deletions.
Binary file added about.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added home.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
171 changes: 171 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,171 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="width-device-width, initial-scale=1.0">
<title>Portfolio Website</title>
<!--box icons-->
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
<!--custom css-->
<link rel="stylesheet" href="style.css">
</head>
<body>
<!--header design-->
<header class="header">
<a href="#" class="logo">Portfolio</a>

<i class='bx bx-menu' id="menu-icon"></i>

<nav class="navbar">
<a href="#home" class="active">Home</a>
<a href="#about">About</a>
<a href="#education">Education</a>
<a href="#portfolio">Project</a>
<a href="#contact">Contact</a>
</nav>
</header>

<section class="home" id="home">
<div class="home-content">
<h3>Hello, It's Me </h3>
<h1>Miraj Khan</h1>
<h3>And I'm a <span >Engineering Student</span></h3>
<p>Passionate coder.Strong communication and problem-solving skills.Looking for a position with a highly regarded organization</p>
<div class="social-media">
<a href="#"><i class='bx bxl-facebook-circle' ></i></a>
<a href="#"><i class='bx bxl-twitter'></i></a>
<a href="#"><i class='bx bxl-instagram-alt'></i></a>
<a href="#"><i class='bx bxl-linkedin' ></i></a>
</div>
<a href="#" class="btn">Download CV</a>
</div>

<div class="home-img">
<img src="home.png" alt="">
</div>
</section>

<section class="about" id="about">
<div class="about-img">
<img src="about.jpg" alt="">
</div>
<div class="about-content">
<h2 class="heading">About <span>Me</span></h2>
<h3>Engineering Student!</h3>
<p>Welcome to my world of innovation! I'm <span>Miraj Khan</span>, a relentless explorer, dreamer, and engineer-in-the-making. With a curious mind and an insatiable thirst for knowledge, I am constantly pushing the boundaries of what is possible in the realm of Computer Science and Engineering. I have always been fascinated by how things work. My journey in Engineering has been a thrilling adventure. I am passionate about using my skills to make a positive impact on the world.</p>
<a href="#" class="btn">Read More</a>
</div>

</section>
<section class="education" id="education">
<h2 class="heading">My <span>Education</span></h2>

<div class="education-content">
<div class="education-box">
<i class='bx bxs-school'></i>
<h3>Class 10th </h3>
<p> 62.14% Marks</p>
<a href="#" class="btn">Read More</a>
</div>

<div class="education-box">
<i class='bx bxs-school'></i>
<h3>Class 12th </h3>
<p>71.40% Marks</p>
<a href="#" class="btn">Read More</a>
</div>

<div class="education-box">
<i class='bx bxs-graduation'></i>
<h3>Diploma</h3>
<p>Computer Science and Technology at EPI</p>
<a href="#" class="btn">Read More</a>
</div>

<div class="education-box">
<i class='bx bxs-graduation'></i>
<h3>B.Tech</h3>
<p>Computer Science and Engineering at Jis University. upto 5th semester average 8.36/10 CGPA</p>
<a href="#" class="btn">Read More</a>
</div>

</div>

</section>

<section class="portfolio" id="portfolio">
<h2 class="heading">Latest <span>Project</span></h2>

<div class="portfolio-content">
<div class="portfolio-box">
<img src="p1.jpg" alt="">
<div class="portfolio-layer">
<h4>College Management System</h4>
<p>Revolutionizing College Management with an Advanced System</p>
<a href="#"><i class='bx bx-link-external'></i></a>
</div>
</div>

<div class="portfolio-box">
<img src="p2.jpg" alt="">
<div class="portfolio-layer">
<h4>Testing Automation</h4>
<p>Automating Testing Processes with Precision: Harnessing the Power of Selenium </p>
<a href="#"><i class='bx bx-link-external'></i></a>
</div>
</div>

<div class="portfolio-box">
<img src="p3.jpg" alt="">
<div class="portfolio-layer">
<h4>Portfolio Website</h4>
<p>Showcasing the Engineering Adventures of Miraj Khan</p>
<a href="#"><i class='bx bx-link-external'></i></a>
</div>
</div>

</div>

</section>

<section class="contact" id="contact">
<h2 class="heading">Contact <span>Me!</span></h2>

<form action="#">
<div class="input-box">
<input type="text" placeholder="Full Name">
<input type="email" placeholder="Email Address">
</div>
<div class="input-box">
<input type="number" placeholder="Mobile Number">
<input type="text" placeholder="Subject">
</div>
<textarea name="" id="" cols="30" rows="10" placeholder="Your Message"></textarea>
<input type="submit" value="Send Message" class="btn">
</form>

</section>

<footer class="footer">
<div class="footer-text">
<p></p>
</div>
<div class="footer-iconTop">
<a href="#home"><i class='bx bx-up-arrow-alt'></i></a>
</div>
</footer>


<script src="https://unpkg.com/scrollreveal"></script>

<<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11/lib/typed.min.js"></script>

<!--custom js-->
<script src="script.js"></script>
</body>
</html>




Binary file added p1.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added p2.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added p3.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
59 changes: 59 additions & 0 deletions script.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@

let menuIcon = document.querySelector('#menu-icon');
let navbar = document.querySelector('.navbar');

menuIcon.onclick =() => {
menuIcon.classList.toggle('bx-x');
navbar.classList.toggle('active');
};


let sections =document.querySelectorAll('section');
let navLinks =document.querySelectorAll('header nav a');

window.onscroll = () =>{
sections.forEach(sec => {
let top = window.scrollY;
let offset = sec.offsetTop - 150;
let height = sec.offsetHeight;
let id = sec.getAttribute('id');

if(top >=offset && top < offset + height) {
navLinks.forEach(links => {
links.classList.remove('active');
document.querySelector('header nav a[href*=' + id +']').classList.add('active');
});
};
});

let header = document.querySelector('header');


header.classList.toggle('sticky', window.scrollY > 100);

menuIcon.classList.remove('bx-x');
navbar.classList.remove('active');

};


ScrollReveal({
//reset: true,
distance: '80px',
duration:2000,
delay: 200
});

ScrollReveal().reveal('.home-content, .heading', { origin:'top' });
ScrollReveal().reveal('.home-img, .education-content, .portfolio-box, .contact form', { origin:'bottom' });
ScrollReveal().reveal('.home-content h1, .about-img', { origin:'left' });
ScrollReveal().reveal('.home-content p, .about-content', { origin:'right' });


const typed= new Typed('.multiple-text', {
Strings: [ 'Computer Science', 'And Engineering', 'Student'],
typeSpeed: 100,
backSpeed: 100,
backDelay: 1000,
loop: true
});
Loading

0 comments on commit ca640bb

Please sign in to comment.