-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathskills.html
213 lines (186 loc) · 18.6 KB
/
skills.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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
<!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">
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- <link rel="stylesheet" href="project.css"> -->
<title>Skills</title>
</head>
<body>
<header class="header" id="header">
<h1 class="logo" id="logo"><a href="#">Mohit's Portfolio</a></h1>
<ul class="main-nav" id="main-nav" >
<li><a href="index.html" class="actH">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="project.html">Projects</a></li>
<li><a href="skills.html">Skills</a></li>
<button onclick="myFunction()">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17.2929 13.2929C16.2886 13.7471 15.1738 13.9999 14 13.9999C9.58172 13.9999 6 10.4182 6 5.9999C6 4.82593 6.25287 3.71102 6.70712 2.70667C3.93137 3.96191 2 6.75526 2 9.9997C2 14.418 5.58172 17.9997 10 17.9997C13.2443 17.9997 16.0376 16.0685 17.2929 13.2929Z" fill="#111827"/>
</svg>
</button>
</ul>
</header>
<div class="container3">
<div class="techski">
<h1> Tech Skills</h1>
<div class="bar front expert" data-skill="HTML5"></div>
<div class="bar front advanced" data-skill="CSS3"></div>
<div class="bar front intermediate" data-skill="JS"></div>
<div class="bar front intermediate" data-skill="ReactJS"></div>
<div class="bar front advanced" data-skill="Figma"></div>
</div>
<h1> Non-Tech Skills</h1>
<div class="bar front expert" data-skill="Leadership"></div>
<div class="bar front expert" data-skill="English proficiency"></div>
<div class="bar front expert" data-skill="Communication skills"></div>
</div>
<footer class="footer">
<div class="row">
<div class="col">
<h3 class="footer-title"> - My Thoughts - </h3>
<p class="text">"Success is the peak point of world's tallest building, with only stairs, where Excellence is the lift. Let's climb it!"</p>
</div>
<div class="col">
<h3 class="footer-title"> - Connect Me - </h3>
<div>
<svg width="22" height="22" viewBox="0 0 14 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<a href="https://www.google.com/maps/place/Indian+Institute+of+Information+Technology+(IIIT)+Bhopal/@23.217693,77.4064425,17z/data=!3m1!4b1!4m5!3m4!1s0x397c4377bd0627f5:0xf968cf9fe4da497a!8m2!3d23.217693!4d77.4086312" target="_blank">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.05025 2.05025C4.78392 -0.683417 9.21608 -0.683418 11.9497 2.05025C14.6834 4.78392 14.6834 9.21608 11.9497 11.9497L7 16.8995L2.05025 11.9497C-0.683418 9.21608 -0.683418 4.78392 2.05025 2.05025ZM7 9C8.10457 9 9 8.10457 9 7C9 5.89543 8.10457 5 7 5C5.89543 5 5 5.89543 5 7C5 8.10457 5.89543 9 7 9Z" fill="white"/>
</a>
</svg>
<span class="text">IIIT Bhopal</span>
</div>
<div>
<svg width="22" height="22" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.00012207 1C0.00012207 0.447715 0.447837 0 1.00012 0H3.153C3.64183 0 4.05902 0.353413 4.13939 0.835601L4.8787 5.27147C4.95087 5.70451 4.73218 6.13397 4.33952 6.3303L2.79138 7.10437C3.90768 9.87832 6.1218 12.0924 8.89575 13.2087L9.66982 11.6606C9.86615 11.2679 10.2956 11.0492 10.7286 11.1214L15.1645 11.8607C15.6467 11.9411 16.0001 12.3583 16.0001 12.8471V15C16.0001 15.5523 15.5524 16 15.0001 16H13.0001C5.82042 16 0.00012207 10.1797 0.00012207 3V1Z" fill="white"/>
</svg>
<span class="text">+91 7574985585</span>
</div>
<div>
<svg width="22" height="22" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.940063 4.4124C0.3553 4.77788 6.10352e-05 5.41882 6.10352e-05 6.1084V13.9999C6.10352e-05 15.1045 0.895492 15.9999 2.00006 15.9999H14.0001C15.1046 15.9999 16.0001 15.1045 16.0001 13.9999V6.1084C16.0001 5.41882 15.6448 4.77788 15.0601 4.4124L9.06006 0.662402C8.41152 0.257064 7.5886 0.257064 6.94006 0.662402L0.940063 4.4124ZM3.55476 6.83462C3.09523 6.52826 2.47436 6.65244 2.16801 7.11197C1.86166 7.5715 1.98583 8.19236 2.44536 8.49872L7.44536 11.8321C7.78126 12.056 8.21886 12.056 8.55476 11.8321L13.5548 8.49872C14.0143 8.19236 14.1385 7.5715 13.8321 7.11197C13.5258 6.65244 12.9049 6.52826 12.4454 6.83462L8.00006 9.79815L3.55476 6.83462Z" fill="white"/>
</svg>
<span class="text">[email protected]</span>
</div>
</div>
</div>
<div class="icons">
<svg width="58" height="59" viewBox="0 0 58 59" fill="none" xmlns="http://www.w3.org/2000/svg">
<a href="https://www.linkedin.com/in/mohit-k-74199a137/" target="_blank">
<g filter="url(#filter0_d)">
<path d="M4 25.8027C4 39.6099 15.1929 50.8027 29 50.8027C42.8071 50.8027 54 39.6099 54 25.8027C54 11.9956 42.8071 0.802734 29 0.802734C15.1929 0.802734 4 11.9956 4 25.8027Z" fill="#2867B2"/>
<path d="M22.125 38.3027H16.8125V21.584H22.125V38.3027ZM19.4688 19.2402C17.75 19.2402 16.5 17.9902 16.5 16.2715C16.5 14.5527 17.9063 13.3027 19.4688 13.3027C21.1875 13.3027 22.4375 14.5527 22.4375 16.2715C22.4375 17.9902 21.1875 19.2402 19.4688 19.2402ZM41.5 38.3027H36.1875V29.2402C36.1875 26.584 35.0937 25.8027 33.5312 25.8027C31.9687 25.8027 30.4062 27.0527 30.4062 29.3965V38.3027H25.0938V21.584H30.0937V23.9277C30.5625 22.834 32.4375 21.1152 35.0937 21.1152C38.0625 21.1152 41.1875 22.834 41.1875 27.9902V38.3027H41.5Z" fill="white"/>
</g>
<defs>
<filter id="filter0_d" x="0" y="0.802734" width="58" height="58" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="4"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/> -->
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</a>
</svg>
<!-- youtube icon -->
<svg width="58" height="59" viewBox="0 0 58 59" fill="none" xmlns="http://www.w3.org/2000/svg">
<a href="https://www.youtube.com/channel/UC5I4A3f-6hI_dlPb8ke1iJw" target="_blank">
<g filter="url(#filter0_d)">
<path d="M4 25.8027C4 39.6099 15.1929 50.8027 29 50.8027C42.8071 50.8027 54 39.6099 54 25.8027C54 11.9956 42.8071 0.802734 29 0.802734C15.1929 0.802734 4 11.9956 4 25.8027Z" fill="#FF0000"/>
<path d="M40.875 19.709C40.5625 18.6152 39.7813 17.834 38.6875 17.5215C36.8125 17.0527 28.8437 17.0527 28.8437 17.0527C28.8437 17.0527 21.0313 17.0527 19 17.5215C17.9063 17.834 17.125 18.6152 16.8125 19.709C16.5 21.7402 16.5 25.8027 16.5 25.8027C16.5 25.8027 16.5 29.8652 16.9688 31.8965C17.2813 32.9902 18.0625 33.7715 19.1562 34.084C21.0312 34.5527 29 34.5527 29 34.5527C29 34.5527 36.8125 34.5527 38.8437 34.084C39.9375 33.7715 40.7188 32.9902 41.0313 31.8965C41.5 29.8652 41.5 25.8027 41.5 25.8027C41.5 25.8027 41.5 21.7402 40.875 19.709ZM26.5 29.5527V22.0527L33.0625 25.8027L26.5 29.5527Z" fill="white"/>
</g>
<defs>
<filter id="filter0_d" x="0" y="0.802734" width="58" height="58" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="4"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</a>
</svg>
<!-- twitter icon -->
<svg width="58" height="59" viewBox="0 0 58 59" fill="none" xmlns="http://www.w3.org/2000/svg">
<a href="https://twitter.com/MohitKhairnar12" target="_blank">
<g filter="url(#filter0_d)">
<path d="M4 25.8027C4 39.6099 15.1929 50.8027 29 50.8027C42.8071 50.8027 54 39.6099 54 25.8027C54 11.9956 42.8071 0.802734 29 0.802734C15.1929 0.802734 4 11.9956 4 25.8027Z" fill="#1DA1F2"/>
<path d="M41.5 17.9902C40.5625 18.459 39.625 18.6152 38.5313 18.7715C39.625 18.1465 40.4062 17.209 40.7188 15.959C39.7812 16.584 38.6875 16.8965 37.4375 17.209C36.5 16.2715 35.0937 15.6465 33.6875 15.6465C30.4063 15.6465 27.9063 18.7715 28.6875 21.8965C24.4688 21.7402 20.7188 19.709 18.0625 16.584C16.6563 18.9277 17.4375 21.8965 19.625 23.459C18.8438 23.459 18.0625 23.1465 17.2812 22.834C17.2812 25.1777 19 27.3652 21.3438 27.9902C20.5625 28.1465 19.7813 28.3027 19 28.1465C19.625 30.1777 21.5 31.7402 23.8437 31.7402C21.9687 33.1465 19.1563 33.9277 16.5 33.6152C18.8438 35.0215 21.5 35.959 24.3125 35.959C33.8437 35.959 39.1562 27.9902 38.8437 20.6465C39.9375 20.0215 40.875 19.084 41.5 17.9902Z" fill="white"/>
</g>
<defs>
<filter id="filter0_d" x="0" y="0.802734" width="58" height="58" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="4"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</a>
</svg>
<!-- instagram icon -->
<svg width="58" height="59" viewBox="0 0 58 59" fill="none" xmlns="http://www.w3.org/2000/svg">
<a href="https://www.instagram.com/mohitt_khairnar/" target="_blank">
<g filter="url(#filter0_d)">
<path d="M4 25.8027C4 39.6099 15.1929 50.8027 29 50.8027C42.8071 50.8027 54 39.6099 54 25.8027C54 11.9956 42.8071 0.802734 29 0.802734C15.1929 0.802734 4 11.9956 4 25.8027Z" fill="#F00073"/>
<path d="M29 15.1777C32.4375 15.1777 32.9062 15.1777 34.3125 15.1777C35.5625 15.1777 36.1875 15.4902 36.6562 15.6465C37.2812 15.959 37.75 16.1152 38.2187 16.584C38.6875 17.0527 39 17.5215 39.1562 18.1465C39.3125 18.6152 39.4687 19.2402 39.625 20.4902C39.625 21.8965 39.625 22.209 39.625 25.8027C39.625 29.3965 39.625 29.709 39.625 31.1152C39.625 32.3652 39.3125 32.9902 39.1562 33.459C38.8437 34.084 38.6875 34.5527 38.2187 35.0215C37.75 35.4902 37.2812 35.8027 36.6562 35.959C36.1875 36.1152 35.5625 36.2715 34.3125 36.4277C32.9062 36.4277 32.5937 36.4277 29 36.4277C25.4062 36.4277 25.0938 36.4277 23.6875 36.4277C22.4375 36.4277 21.8125 36.1152 21.3438 35.959C20.7188 35.6465 20.25 35.4902 19.7813 35.0215C19.3125 34.5527 19 34.084 18.8438 33.459C18.6875 32.9902 18.5312 32.3652 18.375 31.1152C18.375 29.709 18.375 29.3965 18.375 25.8027C18.375 22.209 18.375 21.8965 18.375 20.4902C18.375 19.2402 18.6875 18.6152 18.8438 18.1465C19.1563 17.5215 19.3125 17.0527 19.7813 16.584C20.25 16.1152 20.7188 15.8027 21.3438 15.6465C21.8125 15.4902 22.4375 15.334 23.6875 15.1777C25.0938 15.1777 25.5625 15.1777 29 15.1777ZM29 12.834C25.4062 12.834 25.0938 12.834 23.6875 12.834C22.2813 12.834 21.3438 13.1465 20.5625 13.459C19.7813 13.7715 19 14.2402 18.2188 15.0215C17.4375 15.8027 17.125 16.4277 16.6563 17.3652C16.3438 18.1465 16.1875 19.084 16.0312 20.4902C16.0312 21.8965 16.0312 22.3652 16.0312 25.8027C16.0312 29.3965 16.0312 29.709 16.0312 31.1152C16.0312 32.5215 16.3438 33.459 16.6563 34.2402C16.9688 35.0215 17.4375 35.8027 18.2188 36.584C19 37.3652 19.625 37.6777 20.5625 38.1465C21.3438 38.459 22.2813 38.6152 23.6875 38.7715C25.0938 38.7715 25.5625 38.7715 29 38.7715C32.4375 38.7715 32.9062 38.7715 34.3125 38.7715C35.7187 38.7715 36.6562 38.459 37.4375 38.1465C38.2187 37.834 39 37.3652 39.7812 36.584C40.5625 35.8027 40.875 35.1777 41.3437 34.2402C41.6563 33.459 41.8125 32.5215 41.9687 31.1152C41.9687 29.709 41.9687 29.2402 41.9687 25.8027C41.9687 22.3652 41.9687 21.8965 41.9687 20.4902C41.9687 19.084 41.6563 18.1465 41.3437 17.3652C41.0312 16.584 40.5625 15.8027 39.7812 15.0215C39 14.2402 38.375 13.9277 37.4375 13.459C36.6562 13.1465 35.7187 12.9902 34.3125 12.834C32.9062 12.834 32.5937 12.834 29 12.834Z" fill="white"/>
<path d="M29 19.084C25.25 19.084 22.2812 22.0527 22.2812 25.8027C22.2812 29.5527 25.25 32.5215 29 32.5215C32.75 32.5215 35.7187 29.5527 35.7187 25.8027C35.7187 22.0527 32.75 19.084 29 19.084ZM29 30.1777C26.6562 30.1777 24.625 28.3027 24.625 25.8027C24.625 23.459 26.5 21.4277 29 21.4277C31.3437 21.4277 33.375 23.3027 33.375 25.8027C33.375 28.1465 31.3437 30.1777 29 30.1777Z" fill="white"/>
<path d="M35.875 20.4902C36.7379 20.4902 37.4375 19.7907 37.4375 18.9277C37.4375 18.0648 36.7379 17.3652 35.875 17.3652C35.0121 17.3652 34.3125 18.0648 34.3125 18.9277C34.3125 19.7907 35.0121 20.4902 35.875 20.4902Z" fill="white"/>
</g>
<defs>
<filter id="filter0_d" x="0" y="0.802734" width="58" height="58" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="4"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</a>
</svg>
<!-- github icon -->
<svg width="58" height="59" viewBox="0 0 58 59" fill="none" xmlns="http://www.w3.org/2000/svg">
<a href="https://github.com/mohittk" target="_blank">
<g filter="url(#filter0_d)">
<path d="M4 25.8027C4 39.6099 15.1929 50.8027 29 50.8027C42.8071 50.8027 54 39.6099 54 25.8027C54 11.9956 42.8071 0.802734 29 0.802734C15.1929 0.802734 4 11.9956 4 25.8027Z" fill="#231E1B"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M28.9618 13.6027C22.081 13.6027 16.5 19.1838 16.5 26.0645C16.5 31.5691 20.0933 36.2327 24.9862 37.9146C25.5979 37.9911 25.8272 37.6088 25.8272 37.303C25.8272 36.9972 25.8272 36.2327 25.8272 35.1624C22.3868 35.9269 21.6223 33.4804 21.6223 33.4804C21.0872 32.0278 20.2462 31.6455 20.2462 31.6455C19.0994 30.881 20.3226 30.881 20.3226 30.881C21.5459 30.9575 22.2339 32.1807 22.2339 32.1807C23.3807 34.092 25.1391 33.5569 25.8272 33.251C25.9037 32.4101 26.2859 31.8749 26.5917 31.5691C23.8394 31.2633 20.9343 30.1929 20.9343 25.3764C20.9343 24.0003 21.393 22.9299 22.2339 22.0125C22.1575 21.7831 21.6988 20.4835 22.3868 18.8015C22.3868 18.8015 23.4572 18.4957 25.8272 20.1012C26.8211 19.7954 27.8914 19.7189 28.9618 19.7189C30.0321 19.7189 31.1024 19.8718 32.0963 20.1012C34.4664 18.4957 35.5367 18.8015 35.5367 18.8015C36.2248 20.4835 35.7661 21.7831 35.6896 22.089C36.4541 22.9299 36.9893 24.0767 36.9893 25.4529C36.9893 30.2694 34.0841 31.2633 31.3318 31.5691C31.7905 31.9513 32.1728 32.7159 32.1728 33.8627C32.1728 35.5446 32.1728 36.8443 32.1728 37.303C32.1728 37.6088 32.4021 37.9911 33.0138 37.9146C37.9832 36.2327 41.5 31.5691 41.5 26.0645C41.4235 19.1838 35.8425 13.6027 28.9618 13.6027Z" fill="white"/>
</g>
<defs>
<filter id="filter0_d" x="0" y="0.802734" width="58" height="58" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="4"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</a>
</svg>
</div>
<div class="copyright">
<h4>Copyright@2021 | Mohit Khairnar</h4>
</div>
</footer>
<script src="js/stickynav.js" > </script>
<script src="js/darkmode.js"> </script>
</body>
</html>