Skip to content

Commit

Permalink
Merge pull request #268 from ANKeshri/change-colour-of-footer-icons
Browse files Browse the repository at this point in the history
change colour and add hover effect
  • Loading branch information
AbhiDiva96 authored Jul 8, 2024
2 parents 18501e7 + b230545 commit e00b7a4
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 3 deletions.
1 change: 1 addition & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@
"react-scripts": "5.0.1",
"react-simple-chatbot": "^0.6.1",
"react-toastify": "^10.0.5",
"urix": "^0.1.0",
"web-vitals": "^2.1.4"
},
"scripts": {
Expand Down
29 changes: 28 additions & 1 deletion src/pages/footer.css
Original file line number Diff line number Diff line change
Expand Up @@ -108,8 +108,35 @@
align-items: center;
width: 1.5rem;
height: 1.5rem;
color:rgba(0,0,0,0.5);
transition: all 0.3s ease-in-out;
}

.footer-icons .icon:last-child {
margin-right: 0;
}
}
body.active .footer-icons .icon{
color: white;
}
.footer-icons .git:hover{
color: #000016;
transform: scale(1.2);
background-color: white;
border-radius: 50%;
}
.footer-icons .linkedin:hover{
color: #0077B5;
transform: scale(1.2);
background-color: white;
}
body.active .footer-icons .git:hover{
color: #000016;
transform: scale(1.2);
background-color: white;
border-radius: 50%;
}
body.active .footer-icons .linkedin:hover{
color: #0077B5;
transform: scale(1.2);
background-color: white;
}
4 changes: 2 additions & 2 deletions src/pages/footer.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,10 @@ const Footer = () => {
</div>
<div className="footer-item footer-icons">
<a href="https://github.com/AbhiDiva96/75per">
<GitHubIcon className="icon" />
<GitHubIcon className="icon git" />
</a>
<a href="https://www.linkedin.com/in/abhishek-kumar-062231198/">
<LinkedInIcon className="icon" />
<LinkedInIcon className="icon linkedin" />
</a>
</div>
</div>
Expand Down

0 comments on commit e00b7a4

Please sign in to comment.