File tree Expand file tree Collapse file tree 3 files changed +52
-1
lines changed
Expand file tree Collapse file tree 3 files changed +52
-1
lines changed Original file line number Diff line number Diff line change 2020 < header class ="navbar ">
2121 < h1 class ="brand "> Anujit Singh</ h1 >
2222 < h1 class ="title "> Projects</ h1 >
23+ < div class ="nav-link ">
24+ < a href ="https://github.com/Anujit1 " target ="_blank " class ="nav-icon ">
25+ < i class ="fa-brands fa-github fa-2xl std-icon " style ="color: #FFD43B; "> </ i >
26+ < i class ="fa-brands fa-github fa-flip fa-2xl hover-icon " style ="color: #FFD43B; "> </ i >
27+ </ a >
28+ </ div >
29+
2330 </ header >
2431
2532 < div id ="navbarMargin "> < div >
@@ -75,5 +82,6 @@ <h2><a href="guess_number/index.html" class="project-link" target="_blank" rel="
7582
7683 </ div >
7784 </ body >
78-
85+
86+ < script src ="https://kit.fontawesome.com/fc8c322f0b.js " crossorigin ="anonymous "> </ script >
7987</ html >
Original file line number Diff line number Diff line change @@ -38,6 +38,48 @@ header {
3838 width : 100% ;
3939}
4040
41+ .nav-link {
42+ position : absolute;
43+ right : 20px ;
44+ width : 40px ;
45+ height : 40px ;
46+ padding : 5px ;
47+ display : flex;
48+ justify-content : center;
49+ align-items : center;
50+ }
51+
52+ .nav-icon {
53+ position : relative;
54+ display : inline-block;
55+ }
56+
57+ .std-icon , .hover-icon {
58+ position : absolute;
59+ transition : opacity 0.3s ease;
60+ }
61+
62+ .std-icon {
63+ opacity : 1 ;
64+ }
65+
66+ .hover-icon {
67+ opacity : 0 ;
68+ }
69+
70+ .nav-icon : hover .std-icon {
71+ opacity : 0 ;
72+ }
73+
74+ .nav-icon : hover .hover-icon {
75+ opacity : 1 ;
76+ }
77+
78+ .nav-icon : focus {
79+ outline : none;
80+ }
81+
82+
4183
4284.canvas {
4385 display : flex;
You can’t perform that action at this time.
0 commit comments