Skip to content

Commit 8982b4c

Browse files
committed
upgrade some part of code
1 parent 305739f commit 8982b4c

File tree

5 files changed

+80
-88
lines changed

5 files changed

+80
-88
lines changed

Details.txt

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
This file contain information about some file.
2+
3+
v2/public/assest/css/light_mode.css -> contain css code which lead to change color of page.
4+
v2/public/assest/css/index.css -> contain remaining css code of page.
5+
v2/public/assest/js/index.js -> contain js code for bottom right arrow button.
6+
v2/public/assest/js/change_mode.js -> contain js code to change mode.
7+
v2/public/assest/Images -> contain all images

index.html

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
<html>
33
<head>
44
<meta charset="utf-8">
5-
<!-- <meta http-equiv="refresh" content="2"> -->
65
<meta name="viewport" content="width=device-width, initial-scale=1">
76
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
87
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
@@ -501,18 +500,32 @@ <h1 class="text-center section-heading">
501500
Connect with me
502501
</p>
503502
</div>
504-
<div class="row justify-content-center">
505-
<ul class="col-4">
506-
<li class="github">
503+
<div class="connect-me-inner-div">
504+
<ul class="col">
505+
<li class="github_account">
507506
<a href="https://github.com/Pankajcoder1" title="Github account">
508507
<i class="fa fa-github"></i>
509508
</a>
510509
</li>
511-
<li class="col-4 linkedin">
510+
511+
<li class="linkedin_account">
512512
<a href="https://www.linkedin.com/in/pankaj-kumar-795b48198/" title="Linkedin account">
513513
<i class="fa fa-linkedin"></i>
514514
</a>
515515
</li>
516+
517+
<li class="instagram_account">
518+
<a href="https://www.instagram.com/pankajcoder1/" title="Instagram account">
519+
<i class="fa fa-instagram"></i>
520+
</a>
521+
</li>
522+
523+
<li class="twitter_account">
524+
<a href="https://twitter.com/PankajK66627177" title="Twitter account">
525+
<i class="fa fa-twitter"></i>
526+
</a>
527+
</li>
528+
516529
</ul>
517530
</div>
518531
</div>

v2/public/assest/css/index.css

Lines changed: 25 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200&display=swap');
55

66
/*css start*/
7-
/* css to handle different media will later write */
87

98
body
109
{
@@ -56,7 +55,7 @@ nav li a
5655
}
5756
/* css for media query of navbar section*/
5857

59-
@media(max-width: 992px) and (min-width: 768px)
58+
@media(max-width: 992px) and (min-width: 767px)
6059
{
6160
nav .container
6261
{
@@ -69,7 +68,7 @@ nav li a
6968
}
7069
}
7170

72-
@media(max-width: 768px)
71+
@media(max-width: 767px)
7372
{
7473
nav .container
7574
{
@@ -167,7 +166,7 @@ nav li a
167166
}
168167

169168
/*css for media query for main section*/
170-
@media(max-width: 992px) and (min-width: 768px)
169+
@media(max-width: 992px) and (min-width: 767px)
171170
{
172171
.row div img
173172
{
@@ -297,7 +296,7 @@ nav li a
297296
{
298297
font-size: 15px;
299298
}
300-
@media (max-width: 768px)
299+
@media (max-width: 767px)
301300
{
302301
.project-section
303302
{
@@ -361,7 +360,7 @@ nav li a
361360
text-transform: capitalize;
362361
}
363362

364-
@media (max-width: 768px)
363+
@media (max-width: 767px)
365364
{
366365
.experience_section{
367366
min-height: 100px;
@@ -411,53 +410,35 @@ nav li a
411410
/* css for contact me section end here */
412411

413412
/* css start for connect me section*/
414-
.connect-me
415-
{
416-
padding-top: 10px;
417-
min-height: 200px;
413+
414+
.connect-me-inner-div{
415+
min-height: 100px;
416+
padding-top: 15px;
418417
}
419-
.connect-me div .row ul li
420-
{
418+
.connect-me-inner-div ul{
421419
list-style-type: none;
420+
text-align: center;
422421
}
423-
.connect-me div .row ul li a i,img
424-
{
425-
height: 60px;
426-
padding-top: 20px;
427-
font-size: 30px;
422+
.connect-me-inner-div ul li{
423+
display: inline;
424+
margin-right: 30px;
428425
}
429-
430-
.connect-me div .row ul li
431-
{
432-
float: left;
433-
margin-left: 22%;
426+
.connect-me-inner-div ul li a i{
427+
font-size: 30px;
428+
color: #000;
434429
}
435-
@media (max-width: 576px)
436-
{
437-
.connect-me div .row ul li
438-
{
439-
float: left;
440-
margin-left: 0%;
441-
}
442-
.connect-me div .row ul li a i
443-
{
444-
height: 30px;
445-
width: 30px;
446-
}
430+
.connect-me-inner-div ul li:hover i{
431+
color: #7456c6;
447432
}
448-
@media(max-width: 300px)
449-
{
450-
.connect-me div .row ul li
451-
{
452-
padding-top: 30px;
453-
float: left;
454-
display: block;
433+
@media(max-width: 575px){
434+
.connect-me-inner-div ul li a i{
435+
font-size: 28px;
455436
}
456-
.github
457-
{
458-
margin-left: 50%;
437+
.connect-me-inner-div ul li{
438+
margin-right: 28px;
459439
}
460440
}
441+
461442
/* css for connect me section end here */
462443

463444
/* css for footer section */

v2/public/assest/css/light_mode.css

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,15 +15,6 @@ nav li a
1515
{
1616
background-color: #7456c6;
1717
}
18-
.navbar:hover
19-
{
20-
/*background-color: #f8f9fa;*/
21-
}
22-
.navbar:hover .nav-item>a
23-
{
24-
/*color: #7456c6;*/
25-
}
26-
2718
.nav-link:hover
2819
{
2920
color: #000;

v2/public/assest/js/change_mode.js

Lines changed: 30 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
var full_screen=document.getElementsByTagName("body");
22

3-
3+
// for dark mode
44
function change_light_mode()
55
{
66
// js for main section start
@@ -45,28 +45,23 @@ function change_light_mode()
4545

4646
// js for contact me section end
4747

48-
// js for experience section start
49-
50-
// var logo_background = document.getElementsByClassName("company_logo")[0];
51-
// logo_background.style.backgroundColor="white";
52-
53-
// var column=document.querySelectorAll(".table2 tbody tr");
54-
// for(var i=0;i<column.length;i+=2)
55-
// column[i].style.backgroundColor="#141414";
56-
57-
// js for experience section end
58-
5948
// js for connect me section start
60-
var github=document.querySelectorAll(".github a i")[0];
49+
var github=document.querySelectorAll(".github_account a i")[0];
6150
github.style.color="white";
62-
var linkedin=document.querySelectorAll(".linkedin a i")[0];
63-
linkedin.style.color="white";
51+
var linkedin = document.querySelectorAll(".linkedin_account a i")[0];
52+
linkedin.style.color = "white";
53+
var instagram = document.querySelectorAll(".instagram_account a i")[0];
54+
instagram.style.color = "white";
55+
var twitter = document.querySelectorAll(".twitter_account a i")[0];
56+
twitter.style.color = "white";
57+
6458

6559
// js for connect me section end
6660

6761
}
6862

6963

64+
// light mode
7065
function change_dark_mode()
7166
{
7267
// js for main section start
@@ -100,29 +95,22 @@ function change_dark_mode()
10095
for(var i=0;i<list.length;i++)
10196
list[i].style.color="black";
10297

103-
10498
// js for project section end
105-
// js for experience section start
106-
107-
// var logo_background = document.getElementsByClassName("company_logo")[0];
108-
// logo_background.style.backgroundColor="transparent";
109-
110-
// var column=document.querySelectorAll(".table2 tbody tr");
111-
// for(var i=0;i<column.length;i+=2)
112-
// column[i].style.backgroundColor="rgba(0,0,0,0.05)";
113-
114-
// js for experience section end
11599

116100
// js for contact me section start
117101
var list=document.querySelectorAll(".contact div .row");
118102
list[0].style.backgroundColor="white";
119103
// js for contact me section end
120104

121105

122-
var github=document.querySelectorAll(".github a i")[0];
123-
github.style.color="black";
124-
var linkedin=document.querySelectorAll(".linkedin a i")[0];
125-
linkedin.style.color="black";
106+
var github = document.querySelectorAll(".github_account a i")[0];
107+
github.style.color = "black";
108+
var linkedin = document.querySelectorAll(".linkedin_account a i")[0];
109+
linkedin.style.color = "black";
110+
var instagram = document.querySelectorAll(".instagram_account a i")[0];
111+
instagram.style.color = "black";
112+
var twitter = document.querySelectorAll(".twitter_account a i")[0];
113+
twitter.style.color = "black";
126114
$(document).ready(function()
127115
{
128116
$(github).hover(function()
@@ -141,6 +129,18 @@ function change_dark_mode()
141129
{
142130
$(this).css("color","black");
143131
});
132+
$(instagram).hover(function () {
133+
$(this).css("color", "#7456c6");
134+
},
135+
function () {
136+
$(this).css("color", "black");
137+
});
138+
$(twitter).hover(function () {
139+
$(this).css("color", "#7456c6");
140+
},
141+
function () {
142+
$(this).css("color", "black");
143+
});
144144
});
145145

146146
// js for connect me section end

0 commit comments

Comments
 (0)