Skip to content

Commit 13eaed0

Browse files
codewithdhruba01sanjay-kv
codewithdhruba01
and
sanjay-kv
authored
add: footer social icon (#1398)
Co-authored-by: Sanjay Viswanathan <[email protected]>
1 parent 8a767f7 commit 13eaed0

File tree

1 file changed

+123
-45
lines changed

1 file changed

+123
-45
lines changed

‎pages/help.html‎

Lines changed: 123 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -256,65 +256,146 @@ <h3>Contact Form</h3>
256256
</div>
257257
</form>
258258
</div>
259+
259260
<footer id="Contact" class="footer-2">
260-
<div class="footer-container">
261+
<div class="footer-container">
261262
<div class="footer-content">
262-
<div class="footer-info">
263-
<img src="../assets/recode.png" alt="Recode-Hive logo" class="footer-logo">
264-
</div>
265-
266-
<div class="footer-links">
267-
<div class="footer-section">
268-
<h6 class="footer-heading">ABOUT RECODE-HIVE</h6>
269-
<div>
270-
<a href="help.html" class="footer-link">Contact Us</a>
271-
<a href="https://github.com/recodehive/awesome-github-profiles/blob/main/CODE_OF_CONDUCT.md"
272-
class="footer-link">Code of Conduct</a>
273-
<!-- Added FAQ section -->
274-
<a href="faq.html" class="footer-link">FAQ</a>
275-
263+
<div class="footer-info">
264+
<a href="../index.html" style="text-decoration: none; color: #333;">
265+
<img src="../assets/recode.png" alt="Recode-Hive logo" class="footer-logo">
266+
</a>
267+
<!-- Social Media Icons -->
268+
<div class="social-media-icons">
269+
<a href="https://github.com/sanjay-kv" target="_blank" aria-label="GitHub" data-social="github">
270+
<i class="fab fa-github"></i>
271+
<div class="filled"></div>
272+
</a>
273+
<a href="https://stream.recodehive.com/github" target="_blank" aria-label="YouTube" data-social="youtube">
274+
<i class="fab fa-youtube footer-youtube-icon"></i>
275+
<div class="filled"></div>
276+
</a>
277+
<a href="https://www.linkedin.com/in/sanjay-k-v/" target="_blank" aria-label="LinkedIn" data-social="linkedin">
278+
<i class="fab fa-linkedin-in footer-linkedin-icon"></i>
279+
<div class="filled"></div>
280+
</a>
281+
<a href="https://twitter.com/sanjay_kv_" target="_blank" aria-label="Twitter" data-social="twitter">
282+
<i class="fab fa-twitter footer-twitter-icon"></i>
283+
<div class="filled"></div>
284+
</a>
285+
<a href="https://www.facebook.com/sanjay.k.viswanathan/" target="_blank" aria-label="Facebook" data-social="facebook">
286+
<i class="fab fa-facebook-f footer-facebook-icon"></i>
287+
<div class="filled"></div>
288+
</a>
289+
</div>
290+
<!-- End of Social Media Icons -->
276291
</div>
292+
<div class="footer-links">
293+
<div class="footer-section">
294+
<h6 class="footer-heading">ABOUT RECODE-HIVE</h6>
295+
<div>
296+
<a href="help.html" class="footer-link">Contact Us</a>
297+
<a href="https://github.com/recodehive/awesome-github-profiles/blob/main/CODE_OF_CONDUCT.md" class="footer-link">Code of Conduct</a>
298+
<a href="faq.html" class="footer-link">FAQ</a>
299+
</div>
300+
</div>
301+
<div class="footer-section">
302+
<h6 class="footer-heading">GET INVOLVED</h6>
303+
<div>
304+
<a href="https://github.com/recodehive/awesome-github-profiles/issues/new?assignees=&amp;labels=%E2%9E%95+profile&amp;projects=&amp;template=add_profile.md&amp;title=Add+Profile%3A+" class="footer-link">Add Your Profile</a>
305+
<a href="https://github.com/recodehive/Support/issues/new?assignees=&amp;labels=invite+me+to+the+community&amp;projects=&amp;template=invitation.yml&amp;title=Please+invite+me+to+the+Recode-Hive+GitHub+Community+Organization" class="footer-link">Join the Organization</a>
306+
<a href="http://127.0.0.1:5501/pages/events.html" class="footer-link">Events</a>
307+
</div>
308+
</div>
277309
</div>
278-
<div class="footer-section">
279-
<h6 class="footer-heading">GET INVOLVED</h6>
280-
<div>
281-
<a href="https://github.com/recodehive/awesome-github-profiles/issues/new?assignees=&labels=%E2%9E%95+profile&projects=&template=add_profile.md&title=Add+Profile%3A+" class="footer-link">Add Your Profile</a>
282-
<a href="https://github.com/recodehive/Support/issues/new?assignees=&labels=invite+me+to+the+community&projects=&template=invitation.yml&title=Please+invite+me+to+the+Recode-Hive+GitHub+Community+Organization" class="footer-link">Join the Organization</a>
283-
</div>
310+
311+
<div class="footer-description">
312+
<h5>
313+
We focus on quality content for the right people at the right time. What we are trying to do is help you brand personal skills through GitHub readme.md, listing the best profiles, and giving you the opportunity to list your profile to the world.
314+
</h5>
315+
<a href="exploremore.html" class="footer-button">Explore</a>
284316
</div>
285-
</div>
286-
287-
<div class="footer-description">
288-
<h5>
289-
We focus on quality content for the right people at the right time⏱️. What we are trying to do is help you to brand personal skills through GitHub readme.md, So we listing the best profiles & opportunity to list your profile to the world 🌎.
290-
</h5>
291-
<a href="exploremore.html" class="footer-button">Explore</a>
292-
</div>
293-
</div>
294-
</div>
295-
296-
<div class="footer-bottom">
297-
<div class="footer-container">
298-
<p class="footer-copyright">
299-
&copy; <span id="dynamic-year"></span> Recode-Hive. Made with 🖤️ by the community. All rights reserved.
300-
</p>
301317
</div>
302318
</div>
303-
319+
320+
<div class="footer-bottom">
321+
<p>© <span id="dynamic-year">2024</span> Recode-Hive. Made with 🖤 by the
322+
<a href="https://github.com/recodehive/awesome-github-profiles" target="_blank" rel="noopener noreferrer" class="no-underline">community</a>. All rights reserved.
323+
</p>
324+
</div>
325+
304326
<script>
305327
document.getElementById("dynamic-year").textContent = new Date().getFullYear();
306328
</script>
307-
308-
</footer>
329+
</footer>
330+
331+
<style>
332+
.footer-logo {
333+
width: auto;
334+
height: 93px;
335+
cursor: pointer;
336+
padding-left: 20px;
337+
padding-top: 40px;
338+
}
339+
.social-media-icons {
340+
display: flex;
341+
justify-content: center;
342+
margin-top: 10px;
343+
}
344+
345+
.social-media-icons a {
346+
margin: 0 15px;
347+
text-decoration: none;
348+
color: #000;
349+
position: relative;
350+
transition: transform 0.3s, background-color 0.3s;
351+
}
352+
353+
.social-media-icons a i {
354+
font-size: 24px;
355+
}
356+
357+
.social-media-icons a .filled {
358+
position: absolute;
359+
top: 0;
360+
left: 0;
361+
right: 0;
362+
bottom: 0;
363+
background-color: transparent;
364+
transition: background-color 0.3s;
365+
border-radius: 50%;
366+
}
367+
368+
.social-media-icons a:hover {
369+
transform: rotate(20deg);
370+
}
371+
372+
.social-media-icons a:hover .filled {
373+
background-color: rgba(0, 0, 0, 0.1);
374+
}
375+
376+
.footer-info {
377+
display: flex;
378+
flex-direction: column;
379+
align-items: center; /* Center the logo and social icons */
380+
}
381+
382+
383+
.footer-links {
384+
text-align: left; /* Align the links to the left */
385+
margin-top: 20px; /* Add spacing from above elements */
386+
}
387+
388+
.footer-section {
389+
margin-bottom: 15px; /* Space between sections */
390+
}
391+
</style>
309392

310393
<!-- Scroll to top -->
311394
<button id="scrollToTop" aria-label="Scroll to top">
312395
<svg viewBox="0 0 384 512" xmlns="http://www.w3.org/2000/svg" class="arrow-icon">
313396
<path d="M374.6 246.6C368.4 252.9 360.2 256 352 256s-16.38-3.125-22.62-9.375L224 141.3V448c0 17.69-14.33 31.1-31.1 31.1S160 465.7 160 448V141.3L54.63 246.6c-12.5 12.5-32.75 12.5-45.25 0s-12.5-32.75 0-45.25l160-160c12.5-12.5 32.75-12.5 45.25 0l160 160C387.1 213.9 387.1 234.1 374.6 246.6z"/>
314397
</svg>
315398
</button>
316-
317-
318399
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js"></script>
319400
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-database.js"></script>
320401
<script src="../scripts/ScrollToTop.js"></script>
@@ -348,9 +429,6 @@ <h5>
348429
});
349430
</script>
350431

351-
352-
353-
354432
<script>
355433

356434
function active(){

0 commit comments

Comments
 (0)