-
Notifications
You must be signed in to change notification settings - Fork 0
/
personal-portfolio.html
122 lines (102 loc) · 6.93 KB
/
personal-portfolio.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
115
116
117
118
119
120
121
122
<!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/normalize/7.0.0/normalize.min.css">
<link rel="icon" href="./img/logo-icon.png">
<link rel="stylesheet" href="./css/style.css">
<title>Project Page</title>
</head>
<style>
.project-description{
background-color: rgb(29, 31, 41) !important;
}
</style>
<body class="project-page-body">
<div class="loading-bg">
<svg id="logo-loading" class="logo-loading stroke-animate" width="494" height="495" viewBox="0 0 494 495" fill="none" xmlns="http://www.w3.org/2000/svg">
<path class="stroke" d="M398.797 2.74993L175.158 142.069C169.294 145.723 169.563 154.348 175.643 157.629L242.375 193.639C245.098 195.108 248.384 195.076 251.078 193.553L486.75 60.3226C492.928 56.8302 492.822 47.8956 486.563 44.5505L407.798 2.45152C404.96 0.934638 401.528 1.04842 398.797 2.74993Z" stroke="black"/>
<path class="stroke" d="M240 325.359V227.103C240 223.897 238.295 220.933 235.523 219.322L14.5229 90.8605C8.52292 87.3729 1 91.7015 1 98.6415V196.898C1 200.104 2.70542 203.067 5.47714 204.679L226.477 333.14C232.477 336.627 240 332.299 240 325.359Z" stroke="black"/>
<path class="stroke" d="M50.3304 267.317L133.33 312.872C136.21 314.453 138 317.477 138 320.762V484.794C138 491.636 130.667 495.975 124.67 492.683L41.6696 447.127C38.7898 445.547 37 442.522 37 439.237V275.206C37 268.364 44.3325 264.025 50.3304 267.317Z" stroke="black"/>
<path class="stroke" d="M426.574 121.582L349.574 165.065C346.748 166.661 345 169.656 345 172.902V427.919C345 434.49 351.815 438.846 357.78 436.086L434.78 400.456C437.963 398.983 440 395.795 440 392.288V129.418C440 122.528 432.574 118.194 426.574 121.582Z" stroke="black"/>
</svg>
</div>
<div class="navbar" id="navbar">
<div class="container">
<a href="index.html#page-top" id="logo">
<img class="logo" src="img/logo-black.svg" alt="logo">
</a>
<img src="img/menu-black.svg" class="menu" id="menu-button" alt="menu">
<nav>
<div class="exit-button-right">
<img src="img/menu-close.svg" class="menu-exit-icon" id="exit-menu-button" alt="exit-icon">
</div>
<ul class="nav-menu">
<li><a href="index.html#page-top" class="btn nav-buttons" id="home-button">Home</a></li>
<li><a href="index.html#projects" class="btn nav-buttons" id="projects-button">Projects</a></li>
<li><a href="index.html#aboutme-scroll" class="btn nav-buttons" id="aboutme-button">About Me</a></li>
<li><a href="files/Manak Kumar Singh Resume.pdf" class="btn nav-buttons" id="resume-button">Resume</a></li>
<li><a href="index.html#contactme-scroll" class="btn nav-buttons" id="contactme-button">Contact Me</a></li>
</ul>
<div class="container mobile-socials">
<a href="#"><img src="img/github.svg" class="github-logo" alt="logo-github"> </a>
<a href="#"><img src="img/linkedin.svg" class="linkedin-logo" alt="logo-linkedin"></a>
</div>
</nav>
</div>
</div>
<section class="project-page">
<div class="page-content" id="cover-page">
<div class="container heading-div">
<h1 class="main-project-heading">Portfolio Website</h1>
<img class="project-first-img mobile-images" src="img/portfolio-2.png" alt="project-image">
</div>
<div class="desktop-view">
<div class="desktop-images" id="desktop-images">
<img src="img/portfolio-2.png" alt="project-image">
<img src="img/portfolio-1.png" alt="project-image">
<img src="img/portfolio-3.png" alt="project-image">
</div>
<div class="project-description">
<div class="description-background">
<div class="center-align-description">
<h1>Introduction</h1>
<p>A high performance responsive personal website portfolio for showcasing my work which I can constantly update in the future.</p>
<h1>Project Details</h1>
<p>This website was designed and prototyped using Figma, extra graphics like logos, icons were also created by me on figma.</p>
<br>
<p>To code this website and make it responsive, I used SCSS, CSS, HTML, JavaScript.</p>
<img class="mobile-images" src="img/portfolio-1.png" alt="project-image">
<h1>Features:</h1>
<ul>
<li>Responsive</li>
<li>Animations</li>
<li>Multi-platform</li>
</ul>
<img class="mobile-images" src="img/portfolio-3.png" alt="project-image">
<h1>Project Link:</h1>
<p>Github: <a href="https://github.com/Hiperultimate/Portfolio-Website" target="_blank">Link</a></p>
</div>
<div class="background-text noselect">Portfolio</div>
</div>
<div class="button-position">
<a href="index.html" class="gradient-button">Back To Home</a>
</div>
</div>
</div>
</div>
<footer>
<div class="footer-div">
<a href="index.html#page-top" id="footer-logo"><img class="footer-logo" src="img/logo.svg" alt="logo"></a>
<div class="footer-social">
<a href="https://github.com/Hiperultimate" target="_blank" class="github-link">Github</a>
<a href="https://www.linkedin.com/in/manak-kumar/" target="_blank" class="linkedin-link">Linkedin</a>
</div>
<p>© 2021 Manak Kumar Singh - VAT 7011311081- Contact</p>
</div>
</footer>
</section>
<script src="./scripting/projectPage-script.js"></script>
</body>
</html>