-
Notifications
You must be signed in to change notification settings - Fork 86
/
Copy pathMyPortfolio.html
151 lines (139 loc) · 7.13 KB
/
MyPortfolio.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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!-- SakhinetiPraveena -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Portfolio</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
crossorigin="anonymous">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
<link href="style.css" rel="stylesheet">
</head>
<body style="background-color:#161A1D;">
<!-- Navbar -->
<nav class="navbar sticky-top navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#" style="color:#8000C0">Sakhineti Praveena</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#hero">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#skills" style="color:white;">My Skills</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#works" style="color:white;">My Works</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#Contact" style="color:white;">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<main class="container mt-3">
<section id="hero" class="d-flex justify-content-sm-center
justify-content-md-evenly align-items-center mx-auto flex-column-reverse gap-3 flex-md-row">
<!-- Hero -->
<div class="d-flex justify-content-sm-center align-items-center mx-auto flex-column justify-content-md-start align-items-md-start">
<h1 style="color:white">Welcome to my Portfolio Website!</h1>
<h2 style="color:#C000FF";>I'm Sakhineti Praveena</h2>
<p style="color:white">Student at National Institute Of Technology Calicut</p>
<a href="https://drive.google.com/file/d/12WuN5YTglUQSZAbf_mJ8j4dkOZRThi4A/view?usp=sharing" target="_blank" class="btn btn-info" role="button">Resume</a>
</div>
<div class="w-25 w-25 mx auto">
<img src="https://media-exp1.licdn.com/dms/image/C5603AQF8P8rfvxcCog/profile-displayphoto-shrink_800_800/0/1616445309154?e=1639612800&v=beta&t=9wa9TzeE1oUjGznFyUHdAVDL1BfjEJ4E9Se-lkZ6D9I" alt="me" class="w-50 h-50 rounded-square shadow-lg">
</div>
</section>
<section id="skills" class="mt-3 bg-dark p-4 rounded" style="background-color:#000000">
<!-- My skills -->
<h2 class=" text-center" style="color:#C000FF;">Skills</h2>
<div class="d-flex mt-3 justify-content-sm-evenly">
<div>
<i class="fas fa-code fa-3x" style="color:#F0DB4F" ></i>
<p style="color:white" align="center">C++</p>
</div>
<div>
<i class="fab fa-html5 fa-3x" style="color:#f4470b"></i>
<p style="color:white">HTML</p>
</div>
<div>
<i class="fab fa-css3-alt fa-3x" style="color:#264de4"></i>
<p style="color:white" align="center">CSS</p>
</div>
<div>
<i class="fab fa-bootstrap fa-3x" style="color:#800080"></i>
<p style="color:white" align="justify">Bootstrap</p>
</div>
<div>
<i class="fab fa-python fa-3x" style="color:#4B8BBE"></i>
<p style="color:white">Python</p>
</div>
</div>
</section>
<section id="works" class="mt-3 bg-dark p-4 rounded">
<!-- My works -->
<h2 class=" text-center" style="color:#C000FF;">Works</h2>
<div class="d-flex flex-column flex-md-row justify-content-md-evenly mt-3 gap-3">
<!-- Portfolio -->
<div class="card mb-2 text-white" style="width: 15rem; background-color:#161A1D;">
<img src="https://images.unsplash.com/photo-1515879218367-8466d910aaa4?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8cHl0aG9ufGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=600&q=60" alt="coding">
<div class="card-body">
<h5 class="card-title" style="color:#8000C0;">Portfolio website</h5>
<p class="card-text">Built a responsive and sturdy website of my own using HTML and Bootstrap.</p>
<a href="https://github.com/SakhinetiPraveena/Porfolio/blob/main/index.html" target="_blank"
class="btn btn-dark">View Source <i class="fab fa-github"></i></a>
</div>
</div>
<!-- EDA NLP -->
<div class="card mb-2 text-white" style="width: 15rem; background-color:#161A1D;">
<img src="https://images.unsplash.com/photo-1625993034446-85f2a5e3c8ad?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=751&q=80" alt="fire">
<div class="card-body">
<h5 class="card-title" style="color:#8000C0;">Fire Alarm</h5>
<p class="card-text">Assembled a circuit in proteous using LM741 which gives an alarm when the temperature goes beyond 50 degree celcius</p>
</div>
</div>
<!-- MBA -->
<div class="card mb-2 text-white" style="width: 15rem; background-color:#161A1D;">
<img src="https://images.unsplash.com/photo-1581677641984-cf14ca58c5ee?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=751&q=80" alt="coding">
<div class="card-body">
<h5 class="card-title" style="color:#8000C0;">Traffic light system</h5>
<p class="card-text">Wrote the assembly language code for 8051 microcontroller to mnage 4 lane traffic light system.</p>
<a href="https://github.com/SakhinetiPraveena/MPMC-traffic-lights-project" target="_blank" class="btn btn-dark">View Source <i class="fab fa-github" ></i></a>
</div>
</div>
</div>
</section>
<section id="Contact" class="mt-3 bg-dark py-4 rounded" >
<h2 class="text-center" style="color:#C000FF;">Contact</h2>
<!-- Contact Me -->
<form>
<div class="mb-3">
<label for="exampleFormControlInput1" class="form-label">Email address</label>
<input type="email" required class="form-control" id="exampleFormControlInput1" placeholder="[email protected]">
</div>
<div class="mb-3">
<label for="exampleFormControlTextarea1" class="form-label">Example textarea</label>
<textarea class="form-control" id="exampleFormControlTextarea1" required placeholder="Enter your message" rows="3"></textarea>
</div>
<button type="submit" class="btn btn-outline-light">Submit</button>
<button type="reset" class="btn btn-outline-light"> Reset </button>
</form>
<div class="mt-3">
<p style="color:#C000FF;"><i class="fas fa-envelope-square"></i> [email protected]</p>
<button type="button" class="btn btn-link btn-outline-light mt-1">
<a href="https://github.com/SakhinetiPraveena"><i class="fab fa-github" style="color:white"></i></a>
</button>
<button type="button" class="btn btn-link btn-outline-light mt-1">
<a href="https://www.linkedin.com/in/sakhineti-praveena-73827318b/"><i class="fab fa-linkedin-in"></i></a>
</button>
</div>
</section>
</main>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>
</body>
</html>