Skip to content

Commit 843d1db

Browse files
committed
some changes, add color on connect me section during hover and youtube experience section added
1 parent 4566905 commit 843d1db

File tree

5 files changed

+167
-31
lines changed

5 files changed

+167
-31
lines changed

index.html

Lines changed: 29 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -186,7 +186,7 @@ <h1 class="section-heading">About</h1>
186186
Hi, My name is <b>Pankaj Kumar</b>. I'm currently pursuing B.Tech from Computer Sciecne and Enginerring at National Institute of Technology Uttarakhand (2018-2022).
187187
</p>
188188
<p class="intro">
189-
I am a <b>Software Developer</b> and <b>Frontend Web Developer.</b>
189+
I am a <b>Software Developer</b> and <b>YouTuber</b> where I provide video explanation of algorithms and video solution of algorithmic problems.
190190
</p>
191191
<div class="btn explore-button">
192192
<a href="#skill">Explore More</a>
@@ -229,7 +229,7 @@ <h1 class="text-center section-heading">
229229
</p>
230230
<ul class="programming_list">
231231
<li>
232-
<p>C++(Intermediate)</p>
232+
<p>C++</p>
233233
</li>
234234
<li>
235235
<p>Python</p>
@@ -266,9 +266,6 @@ <h1 class="text-center section-heading">
266266
<li>
267267
<p>Adobe XD</p>
268268
</li>
269-
<li>
270-
<p>Keras for Neural Network</p>
271-
</li>
272269
<li>
273270
<p>Linux</p>
274271
</li>
@@ -295,7 +292,7 @@ <h1 class="text-center section-heading">
295292
<th>Link</th>
296293
</tr>
297294
</thead>
298-
<tbody>
295+
<tbody class="table1_body">
299296
<tr>
300297
<td>1</td>
301298
<td>Destributive Compiler</td>
@@ -457,6 +454,25 @@ <h1 class="text-center section-heading">
457454
<td class="starting">may 2021</td>
458455
<td class="duration">2 months</td>
459456
</tr>
457+
458+
<tr>
459+
<td>2</td>
460+
<td>
461+
<div >
462+
<img src="v2/public/assest/Images/YouTube.svg" alt="Company Logo" class="img-responsive img-fluid company_logo">
463+
<p> YouTube</p>
464+
<span class="text-center">
465+
<a href="https://www.youtube.com/channel/UCSVfA_mo9u3_eglngWNpCWg" target="_blank">
466+
<i class="fa fa-link"></i>
467+
</a>
468+
</span>
469+
</div>
470+
471+
</td>
472+
<td>Algo Tutor</td>
473+
<td class="starting">Dec 2021</td>
474+
<td class="duration">running</td>
475+
</tr>
460476
</tbody>
461477
</table>
462478
</div>
@@ -523,7 +539,7 @@ <h1 class="text-center section-heading">
523539
</p>
524540
</div>
525541
<div class="connect-me-inner-div">
526-
<ul class="col">
542+
<ul class="col text-center">
527543
<li class="github_account">
528544
<a href="https://github.com/Pankajcoder1" title="Github account">
529545
<i class="fa fa-github"></i>
@@ -548,6 +564,12 @@ <h1 class="text-center section-heading">
548564
</a>
549565
</li>
550566

567+
<li class="youtube_account">
568+
<a href="https://www.youtube.com/channel/UCSVfA_mo9u3_eglngWNpCWg" title="YouTube Channel">
569+
<i class="fa fa-youtube-play"></i>
570+
</a>
571+
</li>
572+
551573
</ul>
552574
</div>
553575
</div>

v2/public/assest/Images/YouTube.svg

Lines changed: 1 addition & 0 deletions
Loading

v2/public/assest/css/index.css

Lines changed: 23 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -428,20 +428,39 @@ nav li a
428428
}
429429
.connect-me-inner-div ul{
430430
list-style-type: none;
431-
text-align: center;
432431
}
433432
.connect-me-inner-div ul li{
434433
display: inline;
435-
margin-right: 30px;
434+
margin-right: 20px;
435+
margin-left: 20px;
436436
}
437437
.connect-me-inner-div ul li a i{
438438
font-size: 30px;
439439
color: #000;
440440
}
441-
.connect-me-inner-div ul li:hover i{
442-
color: #7456c6;
441+
442+
.connect-me-inner-div ul li:nth-child(1):hover i{
443+
color: black;
444+
}
445+
.connect-me-inner-div ul li:nth-child(2):hover i{
446+
color: #0e76a8;
447+
}
448+
.connect-me-inner-div ul li:nth-child(3):hover i{
449+
color: #bc2a8d;
450+
}
451+
.connect-me-inner-div ul li:nth-child(4):hover i{
452+
color: #1DA1F2;
443453
}
454+
.connect-me-inner-div ul li:nth-child(5):hover i{
455+
color: red;
456+
}
457+
444458
@media(max-width: 575px){
459+
.connect-me-inner-div ul li{
460+
display: inline;
461+
margin-right: auto;
462+
margin-left: auto;
463+
}
445464
.connect-me-inner-div ul li a i{
446465
font-size: 28px;
447466
}

v2/public/assest/js/change_mode.js

Lines changed: 87 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ var full_screen=document.getElementsByTagName("body");
44
function change_light_mode()
55
{
66
// js for main section start
7-
full_screen[0].style.backgroundColor="#242526";
7+
full_screen[0].style.backgroundColor = "#303030";
88
document.getElementsByClassName("dark")[0].style.display="block";
99
document.getElementsByClassName("light")[0].style.display="none";
1010
document.getElementsByClassName("intro")[0].style.color="white";
@@ -26,22 +26,36 @@ function change_light_mode()
2626
// js for skill section end here
2727

2828
// js for project section start
29-
var column=document.querySelectorAll(".table1 tbody tr");
30-
for(var i=0;i<column.length;i+=2)
31-
column[i].style.backgroundColor="#141414";
29+
var project_section_column=document.querySelectorAll(".table1 tbody tr");
30+
for(var i=0;i<project_section_column.length;i+=2){
31+
project_section_column[i].style.backgroundColor ="#181818";
32+
}
3233

33-
// js for project section end
34-
35-
// js for project section start
36-
var list=document.querySelectorAll("tbody tr td");
37-
for(var i=0;i<list.length;i++)
38-
list[i].style.color="white";
34+
var project_section_text = document.querySelectorAll(".table1_body tr td");
35+
for(var i=0;i<project_section_text.length;i++){
36+
project_section_text[i].style.color="white";
37+
}
3938

4039
// js for project section end here
4140

41+
// js for experience section start
42+
43+
var experience_column = document.querySelectorAll(".experience_section .container .table2 .table2_tbody tr");
44+
for (var i = 0; i < experience_column.length; i += 2){
45+
experience_column[i].style.backgroundColor = "#181818";
46+
}
47+
48+
var experience_section_text = document.querySelectorAll(".table2_tbody tr td");
49+
for (var i = 0; i < experience_section_text.length; i++){
50+
experience_section_text[i].style.color = "white";
51+
}
52+
53+
// js for experience section end here
54+
55+
4256
// js for contact me section start
4357
var list=document.querySelectorAll(".contact div .row");
44-
list[0].style.backgroundColor="#242526";
58+
list[0].style.backgroundColor ="#303030";
4559

4660
// js for contact me section end
4761

@@ -54,7 +68,41 @@ function change_light_mode()
5468
instagram.style.color = "white";
5569
var twitter = document.querySelectorAll(".twitter_account a i")[0];
5670
twitter.style.color = "white";
71+
var youtube = document.querySelectorAll(".youtube_account a i")[0];
72+
youtube.style.color = "white";
5773

74+
$(document).ready(function () {
75+
$(github).hover(function () {
76+
$(this).css("color", "#ffffff");
77+
},
78+
function () {
79+
$(this).css("color", "#ffffff");
80+
});
81+
$(linkedin).hover(function () {
82+
$(this).css("color", "#ffffff");
83+
},
84+
function () {
85+
$(this).css("color", "#ffffff");
86+
});
87+
$(instagram).hover(function () {
88+
$(this).css("color", "#ffffff");
89+
},
90+
function () {
91+
$(this).css("color", "#ffffff");
92+
});
93+
$(twitter).hover(function () {
94+
$(this).css("color", "#ffffff");
95+
},
96+
function () {
97+
$(this).css("color", "#ffffff");
98+
});
99+
$(youtube).hover(function () {
100+
$(this).css("color", "#ffffff");
101+
},
102+
function () {
103+
$(this).css("color", "#ffffff");
104+
});
105+
});
58106

59107
// js for connect me section end
60108

@@ -97,12 +145,28 @@ function change_dark_mode()
97145

98146
// js for project section end
99147

148+
// js for experience section start
149+
150+
var experience_column = document.querySelectorAll(".experience_section .container .table2 .table2_tbody tr");
151+
for (var i = 0; i < experience_column.length; i += 2) {
152+
experience_column[i].style.backgroundColor = "rgba(0,0,0,.05)";
153+
}
154+
155+
var experience_section_text = document.querySelectorAll(".table2_tbody tr td");
156+
for (var i = 0; i < experience_section_text.length; i++) {
157+
experience_section_text[i].style.color = "black";
158+
}
159+
160+
// js for experience section end here
161+
100162
// js for contact me section start
101163
var list=document.querySelectorAll(".contact div .row");
102164
list[0].style.backgroundColor="white";
103165
// js for contact me section end
104166

105167

168+
// js for connect me section start
169+
106170
var github = document.querySelectorAll(".github_account a i")[0];
107171
github.style.color = "black";
108172
var linkedin = document.querySelectorAll(".linkedin_account a i")[0];
@@ -111,32 +175,40 @@ function change_dark_mode()
111175
instagram.style.color = "black";
112176
var twitter = document.querySelectorAll(".twitter_account a i")[0];
113177
twitter.style.color = "black";
178+
var youtube = document.querySelectorAll(".youtube_account a i")[0];
179+
youtube.style.color = "black";
114180
$(document).ready(function()
115181
{
116182
$(github).hover(function()
117183
{
118-
$(this).css("color","#7456c6");
184+
$(this).css("color","#171515");
119185
},
120186
function()
121187
{
122188
$(this).css("color","black");
123189
});
124190
$(linkedin).hover(function()
125191
{
126-
$(this).css("color","#7456c6");
192+
$(this).css("color","#0e76a8");
127193
},
128194
function()
129195
{
130196
$(this).css("color","black");
131197
});
132198
$(instagram).hover(function () {
133-
$(this).css("color", "#7456c6");
199+
$(this).css("color", "#bc2a8d");
134200
},
135201
function () {
136202
$(this).css("color", "black");
137203
});
138204
$(twitter).hover(function () {
139-
$(this).css("color", "#7456c6");
205+
$(this).css("color", "#1DA1F2");
206+
},
207+
function () {
208+
$(this).css("color", "black");
209+
});
210+
$(youtube).hover(function () {
211+
$(this).css("color", "red");
140212
},
141213
function () {
142214
$(this).css("color", "black");

v2/public/index.html

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -185,7 +185,7 @@ <h1 class="section-heading">About</h1>
185185
Hi, My name is <b>Pankaj Kumar</b>. I'm currently pursuing B.Tech from Computer Sciecne and Enginerring at National Institute of Technology Uttarakhand (2018-2022).
186186
</p>
187187
<p class="intro">
188-
I am a <b>Software Developer</b> and <b>Frontend Web Developer.</b>
188+
I am a <b>Software Developer</b> and <b>YouTuber</b> where I provide video explanation of algorithms and video solution of algorithmic problems.
189189
</p>
190190
<div class="btn explore-button">
191191
<a href="#skill">Explore More</a>
@@ -228,7 +228,7 @@ <h1 class="text-center section-heading">
228228
</p>
229229
<ul class="programming_list">
230230
<li>
231-
<p>C++(Intermediate)</p>
231+
<p>C++</p>
232232
</li>
233233
<li>
234234
<p>Python</p>
@@ -265,9 +265,6 @@ <h1 class="text-center section-heading">
265265
<li>
266266
<p>Adobe XD</p>
267267
</li>
268-
<li>
269-
<p>Keras for Neural Network</p>
270-
</li>
271268
<li>
272269
<p>Linux</p>
273270
</li>
@@ -456,6 +453,25 @@ <h1 class="text-center section-heading">
456453
<td class="starting">may 2021</td>
457454
<td class="duration">2 months</td>
458455
</tr>
456+
457+
<tr>
458+
<td>2</td>
459+
<td>
460+
<div >
461+
<img src="assest/Images/YouTube.svg" alt="Company Logo" class="img-responsive img-fluid company_logo">
462+
<p> YouTube</p>
463+
<span class="text-center">
464+
<a href="https://www.youtube.com/channel/UCSVfA_mo9u3_eglngWNpCWg" target="_blank">
465+
<i class="fa fa-link"></i>
466+
</a>
467+
</span>
468+
</div>
469+
470+
</td>
471+
<td>Algo Tutor</td>
472+
<td class="starting">Dec 2021</td>
473+
<td class="duration">running</td>
474+
</tr>
459475
</tbody>
460476
</table>
461477
</div>
@@ -547,6 +563,12 @@ <h1 class="text-center section-heading">
547563
</a>
548564
</li>
549565

566+
<li class="youtube_account">
567+
<a href="https://www.youtube.com/channel/UCSVfA_mo9u3_eglngWNpCWg" title="YouTube Channel">
568+
<i class="fa fa-youtube-play"></i>
569+
</a>
570+
</li>
571+
550572
</ul>
551573
</div>
552574
</div>

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy