Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update index.html #442

Merged
merged 2 commits into from
Jan 10, 2025
Merged

Update index.html #442

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8d3f2cb
Update index.html
Anushka-200617 Jan 9, 2025
6f6caca
Merge branch 'Main' into Anushka-200617-patch-1
dhairyagothi Jan 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
81 changes: 47 additions & 34 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -200,52 +200,65 @@
<div id="no-projects" style="display: none">No Projects Found</div>
</div>



<footer>
<div class="footer-content" style="display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; padding: 20px; background-color: #00D1B2; color: black;">
<div class="footer-section about" style="flex: 2; min-width: 300px; display: flex; align-items:flex-start; margin: 10px; transition: transform 0.3s ease-in-out;" onmouseover="this.style.transform='scale(1.02)'" onmouseout="this.style.transform='scale(1)'">
<img src="images/1736231291121.png" alt="100 Days 100 Web Projects Logo" style="width: 100px; margin-right: 20px;">
<p style="margin: 0;">The "100 Days, 100 Web Projects" challenge involves building one mini-project daily using HTML, CSS, and JavaScript. It boosts web development skills, creativity, and builds a strong project portfolio.</p>
<footer style="background-color: #00D1B2; color: black; padding: 40px 20px; font-family: Arial, sans-serif;">
<div class="footer-container" style="max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; text-align: left;">
<!-- About Section -->
<div class="footer-section about">
<div style="display: flex; align-items: center; margin-bottom: 15px;">
<img src="images/1736231291121.png" alt="100 Days 100 Web Projects Logo" style="width: 80px; margin-right: 15px;">
<h3 style="margin: 0; font-size: 24px;">100 Days, 100 Web Projects</h3>
</div>
<p style="font-size: 16px; line-height: 1.6; margin-bottom: 15px;">
Join the challenge to build one mini-project daily using HTML, CSS, and JavaScript. Improve your skills, unleash creativity, and expand your portfolio.
</p>
</div>

<div class="footer-section services" style="flex: 1; min-width: 150px; margin: 10px;">
<h2 style="font-size: 18px; margin-bottom: 10px; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'">100 Days 100 Web Projects</h2>
<ul style="list-style: none; padding: 0;">
<li><a href="#who-we-are" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Who We Are</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Blog</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Work With Us</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Investor Relations</a></li>
<li><a href="#contact-us" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Contact Us</a></li>
<!-- Quick Links Section -->
<div class="footer-section quick-links">
<h3 style="font-size: 20px; margin-bottom: 15px; border-bottom: 2px solid #e67e22; display: inline-block; padding-bottom: 5px;">Quick Links</h3>
<ul style="list-style: none; padding: 0; font-size: 16px; line-height: 2;">
<li><a href="#who-we-are" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.transform='translateX(5px)'; this.style.color='#e67e22';" onmouseout="this.style.transform='translateX(0px)'; this.style.color='black';">Who We Are</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.transform='translateX(5px)'; this.style.color='#e67e22';" onmouseout="this.style.transform='translateX(0px)'; this.style.color='black';">Blog</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.transform='translateX(5px)'; this.style.color='#e67e22';" onmouseout="this.style.transform='translateX(0px)'; this.style.color='black';">Work With Us</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.transform='translateX(5px)'; this.style.color='#e67e22';" onmouseout="this.style.transform='translateX(0px)'; this.style.color='black';">Investor Relations</a></li>
<li><a href="#contact-us" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.transform='translateX(5px)'; this.style.color='#e67e22';" onmouseout="this.style.transform='translateX(0px)'; this.style.color='black';">Contact Us</a></li>
</ul>
</div>

<div class="footer-section learn-more" style="flex: 1; min-width: 150px; margin: 10px;">
<h2 style="font-size: 18px; margin-bottom: 10px; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'">Learn More</h2>
<ul style="list-style: none; padding: 0;">
<li><a href="privacy.html" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Privacy Policy</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Security</a></li>
<li><a href="Terms.html" style="color: black; text-decoration: none; transition: all 0.3s ease;" onmouseover="this.style.color='#e67e22'; this.style.paddingLeft='10px'" onmouseout="this.style.color='black'; this.style.paddingLeft='0'">Terms of Service</a></li>
<!-- Policies Section -->
<div class="footer-section policies">
<h3 style="font-size: 20px; margin-bottom: 15px; border-bottom: 2px solid #e67e22; display: inline-block; padding-bottom: 5px;">Policies</h3>
<ul style="list-style: none; padding: 0; font-size: 16px; line-height: 2;">
<li><a href="privacy.html" style="color: black; text-decoration: none; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'">Privacy Policy</a></li>
<li><a href="#" style="color: black; text-decoration: none; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'">Security</a></li>
<li><a href="Terms.html" style="color: black; text-decoration: none; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'">Terms of Service</a></li>
</ul>
</div>

<div class="footer-section social-links" style="flex: 1; min-width: 150px; margin: 10px;">
<h2 style="font-size: 18px; margin-bottom: 10px; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'">Follow Us</h2>
<ul class="social-icons" style="list-style: none; padding: 0; display: flex; gap: 10px;">
<li><a href="#" style="color: black; text-decoration: none; font-size: 24px; transition: all 0.3s ease;" onmouseover="this.style.color='#e1306c'; this.style.transform='scale(1.2)'; this.style.display='inline-block'" onmouseout="this.style.color='black'; this.style.transform='scale(1)'"><i class="fab fa-instagram"></i></a></li>
<li><a href="#" style="color: black; text-decoration: none; font-size: 24px; transition: all 0.3s ease;" onmouseover="this.style.color='#3b5998'; this.style.transform='scale(1.2)'; this.style.display='inline-block'" onmouseout="this.style.color='black'; this.style.transform='scale(1)'"><i class="fab fa-facebook"></i></a></li>
<li><a href="#" style="color: black; text-decoration: none; font-size: 24px; transition: all 0.3s ease;" onmouseover="this.style.color='#0077b5'; this.style.transform='scale(1.2)'; this.style.display='inline-block'" onmouseout="this.style.color='black'; this.style.transform='scale(1)'"><i class="fab fa-linkedin"></i></a></li>
<li><a href="#" style="color: black; text-decoration: none; font-size: 24px; transition: all 0.3s ease;" onmouseover="this.style.color='#1da1f2'; this.style.transform='scale(1.2)'; this.style.display='inline-block'" onmouseout="this.style.color='black'; this.style.transform='scale(1)'"><i class="fab fa-twitter"></i></a></li>
<li><a href="#" style="color: black; text-decoration: none; font-size: 24px; transition: all 0.3s ease;" onmouseover="this.style.color='#ff0000'; this.style.transform='scale(1.2)'; this.style.display='inline-block'" onmouseout="this.style.color='black'; this.style.transform='scale(1)'"><i class="fab fa-youtube"></i></a></li>
</ul>
<!-- Social Links Section -->
<div class="footer-section social-links">
<h3 style="font-size: 20px; margin-bottom: 15px; border-bottom: 2px solid #e67e22; display: inline-block; padding-bottom: 5px;">Follow Us</h3>
<div style="display: flex; gap: 15px; font-size: 24px;">
<a href="#" style="color: black; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'"><i class="fab fa-instagram"></i></a>
<a href="#" style="color: black; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'"><i class="fab fa-facebook"></i></a>
<a href="#" style="color: black; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'"><i class="fab fa-linkedin"></i></a>
<a href="#" style="color: black; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'"><i class="fab fa-twitter"></i></a>
<a href="#" style="color: black; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'"><i class="fab fa-youtube"></i></a>
<a href="#" style="color: black; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='black'"><i class="fab fa-github"></i></a>
</div>

</div>
</div>

<div class="footer-bottom" style="margin:10px; padding: 10px; text-align: center;">
<p style="margin: 0; color: white; transition: color 0.3s ease;" onmouseover="this.style.color='#e67e22'" onmouseout="this.style.color='white'">© 2024 100 Days 100 Web Projects. All rights reserved.</p>
</div>
</footer>

<!-- Footer Bottom -->
<div style="background-color: #f1f1f1; text-align: center; padding: 10px 20px; font-size: 16px; color: black; margin-top: 10px;">
<p style="margin: 0;">© 2024 100 Days 100 Web Projects. All rights reserved.</p>
</div>






<!-- Top scroll button -->
Expand Down
Loading