Skip to content

Commit b0aa947

Browse files
ANKeshriANKeshri
authored
Hover on social icons of footer and contact us section of both the home and free content page (#538)
* add social icon hover in footer and contact us section home and free content page * add img
1 parent cd375cf commit b0aa947

File tree

5 files changed

+56
-22
lines changed

5 files changed

+56
-22
lines changed

‎Images/bam.jpg

34.5 MB
Loading

‎csedge.courses/Resources.html

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -799,17 +799,17 @@ <h2 class="section-heading">Contact Us</h2>
799799
<p class="section-content">For more information or inquiries, please contact us:</p>
800800
<p class="section-content">Email: internship@csedge.courses</p>
801801

802-
<div class="contact-icons">
802+
<div class="contact-icons contact-icn">
803803
<a href="mailto:cseedge@gmail.com" target="_blank"><i class="fas fa-envelope fa-2x"
804-
style="color: #0085ff;"></i></a>
804+
></i></a>
805805
<a href="https://www.linkedin.com/company/csedge/" target="_blank"><i class="fab fa-linkedin fa-2x"
806-
style="color: #0085ff;"></i></a>
806+
></i></a>
807807
<a href="https://github.com/CSEdgeOfficial" target="_blank"><i class="fab fa-github fa-2x"
808-
style="color: #0085ff;"></i></a>
808+
></i></a>
809809
<a href="https://www.instagram.com/csedgeofficial" target="_blank"><i class="fab fa-instagram fa-2x"
810-
style="color: #008bff;"></i></a>
810+
></i></a>
811811
<a href="https://youtube.com/@CSEdgeOfficial" target="_blank"><i class="fab fa-youtube fa-2x"
812-
style="color: #008bff;"></i></a>
812+
></i></a>
813813
</div>
814814
</section>
815815

@@ -858,15 +858,15 @@ <h4>Contact Us</h4>
858858
<h4>Follow US</h4>
859859
<div class="contact-icons">
860860
<a href="mailto:cseedge@gmail.com" target="_blank"><i class="fas fa-envelope fa-2x"
861-
style="color: #ffff;"></i></a>
861+
></i></a>
862862
<a href="https://www.linkedin.com/company/csedge/" target="_blank"><i class="fab fa-linkedin fa-2x"
863-
style="color: #ffff;"></i></a>
863+
></i></a>
864864
<a href="https://github.com/CSEdgeOfficial" target="_blank"><i class="fab fa-github fa-2x"
865-
style="color: #ffff;"></i></a>
865+
></i></a>
866866
<a href="https://www.instagram.com/csedgeofficial" target="_blank"><i class="fab fa-instagram fa-2x"
867-
style="color: #ffff;"></i></a>
867+
></i></a>
868868
<a href="https://youtube.com/@CSEdgeOfficial" target="_blank"><i class="fab fa-youtube fa-2x"
869-
style="color: #ffff;"></i></a>
869+
></i></a>
870870
</div>
871871
</div>
872872
</div>

‎csedge.courses/index.css

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -819,4 +819,38 @@ i {
819819
height: 55px;
820820
border-radius: 50%; /* Makes the image circular */
821821
}
822+
.contact-icons a i {
823+
color: #ffffff;
824+
transition: color 0.1s ease;
825+
826+
}
827+
.contact-icn a i {
828+
color: black;
829+
transition: color 0.1s ease;
830+
831+
}
832+
833+
/* Specific colors for each social media icon */
834+
.contact-icons a .fa-envelope:hover {
835+
color: #D44638; /* Red color for email */
836+
}
837+
838+
.contact-icons a .fa-linkedin:hover {
839+
color: #0077B5; /* LinkedIn blue */
840+
fill: white;
841+
}
822842

843+
.contact-icons a .fa-github:hover {
844+
color: black; /* GitHub black */
845+
background-color: white;
846+
border-radius: 50%;
847+
}
848+
849+
.contact-icons a .fa-instagram:hover {
850+
color: #E1306C; /* Instagram pink */
851+
}
852+
853+
.contact-icons a .fa-youtube:hover {
854+
color: #FF0000; /* YouTube red */
855+
856+
}

‎csedge.courses/index.html

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -268,17 +268,17 @@ <h2 class="section-heading">Contact Us</h2>
268268
<p class="section-content">For more information or inquiries, please contact us:</p>
269269
<p class="section-content">Email: internship@csedge.courses</p>
270270

271-
<div class="contact-icons">
271+
<div class="contact-icons contact-icn">
272272
<a href="mailto:cseedge@gmail.com" target="_blank"><i class="fas fa-envelope fa-2x"
273-
style="color: #0085ff;"></i></a>
273+
></i></a>
274274
<a href="https://www.linkedin.com/company/csedge/" target="_blank"><i class="fab fa-linkedin fa-2x"
275-
style="color: #0085ff;"></i></a>
275+
></i></a>
276276
<a href="https://github.com/CSEdgeOfficial" target="_blank"><i class="fab fa-github fa-2x"
277-
style="color: #0085ff;"></i></a>
277+
></i></a>
278278
<a href="https://www.instagram.com/csedgeofficial" target="_blank"><i class="fab fa-instagram fa-2x"
279-
style="color: #0085ff;"></i></a>
279+
></i></a>
280280
<a href="https://youtube.com/@CSEdgeOfficial" target="_blank"><i class="fab fa-youtube fa-2x"
281-
style="color: #0085ff;"></i></a>
281+
></i></a>
282282
</div>
283283
</section>
284284
<!--FAQ Section-->
@@ -392,15 +392,15 @@ <h4>Contact Us</h4>
392392
<h4>Follow US</h4>
393393
<div class="contact-icons">
394394
<a href="mailto:cseedge@gmail.com" target="_blank"><i class="fas fa-envelope fa-2x"
395-
style="color: #ffff;"></i></a>
395+
></i></a>
396396
<a href="https://www.linkedin.com/company/csedge/" target="_blank"><i class="fab fa-linkedin fa-2x"
397-
style="color: #ffff;"></i></a>
397+
></i></a>
398398
<a href="https://github.com/CSEdgeOfficial" target="_blank"><i class="fab fa-github fa-2x"
399-
style="color: #ffff;"></i></a>
399+
></i></a>
400400
<a href="https://www.instagram.com/csedgeofficial" target="_blank"><i class="fab fa-instagram fa-2x"
401-
style="color: #ffff;"></i></a>
401+
></i></a>
402402
<a href="https://youtube.com/@CSEdgeOfficial" target="_blank"><i class="fab fa-youtube fa-2x"
403-
style="color: #ffff;"></i></a>
403+
></i></a>
404404
</div>
405405
</div>
406406
</div>

‎images/bam.jpg

-3.64 MB
Binary file not shown.

0 commit comments

Comments
 (0)