Skip to content

Commit

Permalink
Merge pull request #1122 from thevijayshankersharma/footer
Browse files Browse the repository at this point in the history 
Added Footer
  • Loading branch information
@jfmartinz
jfmartinz authored Jun 14, 2024
2 parents 0a665a9 + d7de644 commit 3187df8
Show file tree
Hide file tree
Showing 5 changed files with 170 additions and 0 deletions.
Binary file added new-website/assets/footerDark.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added new-website/assets/footerLight.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions new-website/home.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ function toggleDarkMode() {
const orgLogoImg = document.getElementById('org-logo');
// Set the new image source based on dark mode state
orgLogoImg.src = isDarkModeEnabled ? 'assets/GSSocDark.png' : 'assets/GSSocLight.png';
const footerImg = document.getElementById('logo-image');
footerImg.src = isDarkModeEnabled ? 'assets/footerDark.png' : 'assets/footerLight.png';
}

// For particles
Expand Down
41 changes: 41 additions & 0 deletions new-website/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -179,6 +179,47 @@ <h1 class="license-title dark:text-white">License</h1>
</p>
</div>
</div>
<!-- Footer Section -->
<div class="footer-container">
<div class="footer-content">
<div class="footer-left">
<div class="logo-and-title">
<img id="logo-image" src="assets/footerLight.png" alt="ResourceHub Image">
<h2 class="footer-title">ResourceHub</h2>
</div>
<p class="footer-description">ResourceHub is an open-source project that serves as a one-stop repository of
valuable resources curated by the amazing contributors in the community</p>
<div class="footer-icons">
<a href="https://github.com/jfmartinz/ResourceHub" target="_blank" aria-label="Github">
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill="black"
d="M12 0a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2.1c-3.4.7-4.1-1.6-4.1-1.6-.5-1.2-1.3-1.6-1.3-1.6-1.1-.8.1-.8.1-.8 1.2.1 1.8 1.3 1.8 1.3 1 .2 1.7.7 2 .9.2-.7.4-1.3.7-1.6-2.7-.3-5.5-1.3-5.5-5.6 0-1.3.4-2.3 1.2-3.2-.1-.3-.5-1.4.1-3 0 0 1-.3 3.4 1.2a11.4 11.4 0 0 1 6.2 0c2.4-1.5 3.4-1.2 3.4-1.2.6 1.6.2 2.7.1 3 .8.9 1.2 1.9 1.2 3.2 0 4.3-2.8 5.3-5.5 5.6.4.4.7 1.1.7 2.1v3c0 .3.2.7.8.6A12 12 0 0 0 12 0Z" />
</svg>
</a>
<a href="https://discord.com/channels/1243120700626309131/1243121246217175081" target="_blank"
aria-label="Discord">
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill="black"
d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2763-3.68-.2763-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561 19.911 19.911 0 004.967 2.5225.0777.0777 0 00.0842-.0276c.3841-.5234.7217-1.0782 1.0062-1.657a.076.0766 0 00-.0416-.1057 13.1141 13.1141 0 01-1.872-1.0279.077.077 0 01-.0076-.1257c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.0991.246.1981.3728.2924a.077.077 0 01-.0066.1256 12.7578 12.7578 0 01-1.873 1.0279.0766.0766 0 00-.0407.1067c.2845.5788.6221 1.1336 1.0062 1.657a.076.076 0 00.0842.0276 19.9183 19.9183 0 004.967-2.5225.077.077 0 00.0313-.0561c.5004-5.177-.8382-9.6739-3.5485-13.6607a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.955-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.955 2.4189-2.1568 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.955-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z" />
</svg>
</a>
</div>
</div>
<div class="footer-right">
<ul class="footer-links">
<li><a href="https://github.com/jfmartinz/ResourceHub" target="_blank">View on GitHub</a></li>
<li><a href="https://github.com/jfmartinz/ResourceHub/stargazers" target="_blank">Star on GitHub</a></li>
<li><a href="https://github.com/jfmartinz/ResourceHub/blob/main/CONTRIBUTING.md" target="_blank">How to Contribute</a></li>
<li><a href="https://github.com/jfmartinz/ResourceHub/edit/main/README.md" target="_blank">Edit on GitHub</a></li>
<li><a href="https://github.com/jfmartinz/ResourceHub/issues" target="_blank">Feedback</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p>Copyright &copy; 2024 <a href="#">ResourceHub</a>. All Rights Reserved.</p>
</div>
</div>

<!-- for particle effet -->

<script>
Expand Down
127 changes: 127 additions & 0 deletions new-website/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1052,6 +1052,26 @@ body{
color: white;
}

.dark .footer-container{
color: white;
background-color: black;
}

.dark .footer-description,
.dark .footer-links a,
.dark .footer-links a::before{
color: white;
}

.dark .footer-bottom a {
color: white;
font-weight: bold;
}

.dark .footer-icons path{
fill: white ;
}

/* Add these styles to the end of your existing style.css file */

.container {
Expand Down Expand Up @@ -1152,4 +1172,111 @@ body{
text-decoration: underline;
}

/* Footer Specific Styles */
.footer-container {
display: flex;
flex-direction: column;
align-items: center;
width: 90%;
max-width: 1000px;
background-color: #ffffff;
padding: 20px;
box-sizing: border-box;
margin: 40px auto;
}

.footer-content {
display: flex;
justify-content: space-between;
align-items: flex-start;
width: 100%;
}

.footer-left,
.footer-right {
flex: 1;
max-width: 600px;
padding-right: 20px;
box-sizing: border-box;
}

.logo-and-title {
display: flex;
align-items: center; /* Align items vertically */
}

.logo-and-title img {
width: 50px; /* Adjust the width as needed */
height: auto; /* Maintain aspect ratio */
margin-right: 10px; /* Adjust the margin as needed */
margin-top: -15px;
}

.footer-right {
margin-top: 6%;
}

.footer-title {
font-size: 2em;
margin-bottom: 20px;
}

.footer-description {
font-size: 1em;
line-height: 1.5;
color: #333333;
margin-bottom: 20px;
}

.footer-icons {
display: flex;
align-items: center; /* Align items vertically in the center */
}

.footer-icons a {
margin-right: 10px;
color: black;
}

.footer-links {
list-style: none;
padding: 0;
padding-left: 100px; /* Add right padding to move the links towards the right */
}

.footer-links li {
margin-bottom: 10px;
position: relative; /* To position the pseudo-element */
}

.footer-links a {
color: black;
text-decoration: underline;
font-size: 1em;
padding-left: 30px; /* Increased padding to make space for the larger arrow */
position: relative; /* Position relative for absolute positioning of arrow */
}

.footer-links a::before {
content: '→'; /* Unicode for right arrow */
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%); /* Center the arrow vertically */
color: black;
font-size: 1.5em; /* Increase the font size to make the arrow larger */
height: 1.5em; /* Set the height of the arrow */
width: 1.5em; /* Set the width of the arrow */
}

.footer-bottom {
text-align: center;
margin-top: 20px;
font-size: 0.875em;
width: 100%;
}

.footer-bottom a {
color: black;
font-weight: bold;
}

0 comments on commit 3187df8

Please sign in to comment.