Skip to content

Commit

Permalink
Merge pull request #76 from PavaniKudulla/main
Browse files Browse the repository at this point in the history 
Added dark mode to all the pages(issue #66)
  • Loading branch information
@aditya-bhaumik
aditya-bhaumik authored Oct 2, 2024
2 parents 100cd6c + b49bcc9 commit e7f83cd
Show file tree
Hide file tree
Showing 7 changed files with 183 additions and 66 deletions.
31 changes: 20 additions & 11 deletions blog.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,24 @@
<link rel="stylesheet" href="styles.css">
<style>
/* General Styles */
:root{
--primary-color:#f4f4f4;
--secondary-color:#333;
}
.darkmode{
--primary-color:#333;
--secondary-color:#f4f4f4;
}
body {
margin: 0;
font-family: Arial, sans-serif;
background-color: #f4f4f4;
background-color: var(--primary-color);
}

.blog-header {
background: linear-gradient(to right, #ff7e5f, #feb47b);
padding: 20px;
text-align: center;
color: white;
color: var(--primary-color);
}

.blog-subtitle {
Expand All @@ -33,7 +40,7 @@
display: flex;
justify-content: space-between;
gap: 20px;
background-color: white;
background-color: var(--primary-color);
padding: 20px;
margin: 20px;
border-radius: 8px;
Expand Down Expand Up @@ -97,13 +104,14 @@
border: 1px solid #ccc;
margin-top: 10px;
display: block;
background-color: var(--primary-color);
}

.submit-comment {
margin-top: 10px;
padding: 10px 15px;
background-color: #ff7e5f;
color: white;
color: var(--primary-color);
border: none;
border-radius: 5px;
display: block;
Expand All @@ -114,7 +122,7 @@
margin-top: 10px;
padding: 10px 15px;
background-color: #ff7e5f;
color: white;
color: var(--primary-color);
border: none;
border-radius: 5px;
text-decoration: none;
Expand All @@ -132,7 +140,7 @@
background-color: #ff7e5f;
padding: 30px;
text-align: center;
color: white;
color: var(--primary-color);
}

.newsletter-input {
Expand All @@ -146,7 +154,7 @@
.subscribe-button {
padding: 10px 20px;
font-size: 16px;
background-color: white;
background-color: var(--primary-color);
color: #ff7e5f;
border: none;
border-radius: 5px;
Expand Down Expand Up @@ -192,6 +200,7 @@
<li><a href="#faqs">FAQs</a></li>
<li><a href="blog.html">Blog</a></li>
</ul>
<img src="images/dark.png" id="icon" alt="">
</nav>
</header>

Expand Down Expand Up @@ -269,9 +278,7 @@ <h2>Subscribe to Our Newsletter</h2>
</section>
</main>

<footer>
<p>&copy; 2024 PathSphere. All rights reserved.</p>
</footer>
<div class="copyright">&copy; 2024 PathSphere. All rights reserved.</div>

<script>
document.querySelectorAll('.like-button').forEach(button => {
Expand Down Expand Up @@ -314,6 +321,8 @@ <h2>Subscribe to Our Newsletter</h2>
});
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js" integrity="sha512-7eHRwcbYkK4d9g/6tD/mhkf++eoTHwpNM9woBxtPUBWm67zeAfFC+HrdoE2GanKeocly/VxeLvIqwvCdk7qScg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="script.js"></script>
</body>

</html>
8 changes: 5 additions & 3 deletions faqs.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,9 @@
<li><a href="jobs.html">Jobs</a></li>
<li><a href="forum.html">Forum</a></li>
<li><a href="#faqs">FAQs</a></li>
<li><a href="blog.html">Blog</a></li>
</ul>
<img src="images/dark.png" id="icon" alt="">
</nav>
</header>
<main>
Expand Down Expand Up @@ -58,8 +60,8 @@ <h2>5. How can I contact PathSphere for support?</h2>
</section>
</main>

<footer>
<p>&copy; 2024 PathSphere. All rights reserved.</p>
</footer>
<div class="copyright">&copy; 2024 PathSphere. All rights reserved.</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js" integrity="sha512-7eHRwcbYkK4d9g/6tD/mhkf++eoTHwpNM9woBxtPUBWm67zeAfFC+HrdoE2GanKeocly/VxeLvIqwvCdk7qScg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="script.js"></script>
</body>
</html>
4 changes: 4 additions & 0 deletions forum.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,9 @@
<li><a href="jobs.html">Jobs</a></li>
<li><a href="forum.html">Forum</a></li>
<li><a href="faqs.html">FAQs</a></li>
<li><a href="blog.html">Blog</a></li>
</ul>
<img src="images/dark.png" id="icon" alt="">
</nav>
</header>
<main>
Expand Down Expand Up @@ -126,6 +128,8 @@ <h3>Follow us on</h3>
</div>
</div>
<div class="copyright">&copy; 2024 PathSphere. All rights reserved.</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js" integrity="sha512-7eHRwcbYkK4d9g/6tD/mhkf++eoTHwpNM9woBxtPUBWm67zeAfFC+HrdoE2GanKeocly/VxeLvIqwvCdk7qScg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="script.js"></script>
</body>

</html>
46 changes: 29 additions & 17 deletions jobs.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,18 @@
padding: 0;
box-sizing: border-box;
}
:root{
--primary-color:#f4f4f4;
--secondary-color:#333;
}
.darkmode{
--primary-color:#333;
--secondary-color:#f4f4f4;
}
header {
background-color: #3c3f41;
background-color: var(--primary-color);
padding: 20px;
color: white;
color: var(--secondary-color);
position: sticky;
top: 0;
z-index: 1000;
Expand All @@ -32,7 +40,7 @@
margin-right: 10px;
}
nav a {
color: white;
color: var(--secondary-color);
text-decoration: none;
padding: 10px;
transition: background-color 0.3s;
Expand All @@ -43,7 +51,7 @@
}
.hero {
background-color: #4caf50;
color: white;
color: var(--secondary-color);
padding: 30px;
text-align: center;
}
Expand Down Expand Up @@ -78,7 +86,7 @@
width: 300px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
transition: transform 0.3s;
background-color: #ffffff;
background-color: var(--primary-color);
}
.job-item:hover {
transform: scale(1.05);
Expand All @@ -89,7 +97,7 @@
.apply-btn {
display: inline-block;
background-color: #4caf50;
color: white;
color: var(--secondary-color);
padding: 10px 15px;
border-radius: 5px;
text-decoration: none;
Expand All @@ -99,8 +107,8 @@
background-color: #45a049;
}
.footer-container {
background-color: #3c3f41;
color: white;
background-color: var(--primary-color);
color: var(--secondary-color);
padding: 20px;
text-align: center;
margin-top: 20px;
Expand Down Expand Up @@ -159,7 +167,9 @@
<li><a href="jobs.html">Jobs</a></li>
<li><a href="forum.html">Forum</a></li>
<li><a href="faqs.html">FAQs</a></li>
<li><a href="blog.html">Blog</a></li>
</ul>
<img src="images/dark.png" id="icon" alt="">
</nav>
</header>
<main>
Expand Down Expand Up @@ -266,23 +276,25 @@ <h3>PathSphere</h3>
<div class="footer-list">
<h3>Quick Links</h3>
<ul>
<li><a href="index.html" style="color: white;">Home</a></li>
<li><a href="scholarships.html" style="color: white;">Scholarships</a></li>
<li><a href="jobs.html" style="color: white;">Jobs</a></li>
<li><a href="forum.html" style="color: white;">Forum</a></li>
<li><a href="index.html" style="color: var(--secondary-color);">Home</a></li>
<li><a href="scholarships.html" style="color: var(--secondary-color);">Scholarships</a></li>
<li><a href="jobs.html" style="color: var(--secondary-color);">Jobs</a></li>
<li><a href="forum.html" style="color: var(--secondary-color);">Forum</a></li>
</ul>
</div>
<div class="footer-list">
<h3>Follow Us On</h3>
<ul class="social-icons">
<li><a href="https://github.com" target="_blank" style="color: white;"><i class="fab fa-github"></i></a></li>
<li><a href="https://instagram.com" target="_blank" style="color: white;"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://x.com" target="_blank" style="color: white;"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="https://facebook.com" target="_blank" style="color: white;"><i class="fab fa-facebook"></i></a></li>
<li><a href="https://linkedin.com" target="_blank" style="color: white;"><i class="fab fa-linkedin"></i></a></li>
<li><a href="https://github.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-github"></i></a></li>
<li><a href="https://instagram.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://x.com" target="_blank" style="color: var(--secondary-color);"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="https://facebook.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-facebook"></i></a></li>
<li><a href="https://linkedin.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-linkedin"></i></a></li>
</ul>
</div>
</div>
<div class="copyright">&copy; 2024 PathSphere. All rights reserved.</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js" integrity="sha512-7eHRwcbYkK4d9g/6tD/mhkf++eoTHwpNM9woBxtPUBWm67zeAfFC+HrdoE2GanKeocly/VxeLvIqwvCdk7qScg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="script.js"></script>
</body>
</html>
46 changes: 29 additions & 17 deletions scholarships.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,18 @@
padding: 0;
box-sizing: border-box;
}
:root{
--primary-color:#f4f4f4;
--secondary-color:#333;
}
.darkmode{
--primary-color:#333;
--secondary-color:#f4f4f4;
}
header {
background-color: #3c3f41;
background-color: var(--primary-color);
padding: 20px;
color: white;
color: var(--secondary-color);
position: sticky;
top: 0;
z-index: 1000;
Expand All @@ -32,7 +40,7 @@
margin-right: 10px;
}
nav a {
color: white;
color: var(--primary-color);
text-decoration: none;
padding: 10px;
transition: background-color 0.3s;
Expand All @@ -43,7 +51,7 @@
}
.hero {
background-color: #4caf50;
color: white;
color: var(--primary-color);
padding: 30px;
text-align: center;
}
Expand Down Expand Up @@ -78,7 +86,7 @@
width: 300px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
transition: transform 0.3s;
background-color: #ffffff;
background-color: var(--primary-color);
}
.scholarship-item:hover {
transform: scale(1.05);
Expand All @@ -89,7 +97,7 @@
.apply-btn {
display: inline-block;
background-color: #4caf50;
color: white;
color: var(--primary-color);
padding: 10px 15px;
border-radius: 5px;
text-decoration: none;
Expand All @@ -99,8 +107,8 @@
background-color: #45a049;
}
.footer-container {
background-color: #3c3f41;
color: white;
background-color: var(--primary-color);
color: var(--secondary-color);
padding: 20px;
text-align: center;
margin-top: 20px;
Expand Down Expand Up @@ -159,7 +167,9 @@
<li><a href="jobs.html">Jobs</a></li>
<li><a href="forum.html">Forum</a></li>
<li><a href="faqs.html">FAQs</a></li>
<li><a href="blog.html">Blog</a></li>
</ul>
<img src="images/dark.png" id="icon" alt="">
</nav>
</header>
<main>
Expand Down Expand Up @@ -255,23 +265,25 @@ <h3>PathSphere</h3>
<div class="footer-list">
<h3>Quick Links</h3>
<ul>
<li><a href="index.html" style="color: white;">Home</a></li>
<li><a href="scholarships.html" style="color: white;">Scholarships</a></li>
<li><a href="jobs.html" style="color: white;">Jobs</a></li>
<li><a href="forum.html" style="color: white;">Forum</a></li>
<li><a href="index.html" style="color: var(--secondary-color);">Home</a></li>
<li><a href="scholarships.html" style="color: var(--secondary-color);">Scholarships</a></li>
<li><a href="jobs.html" style="color: var(--secondary-color);">Jobs</a></li>
<li><a href="forum.html" style="color: var(--secondary-color);">Forum</a></li>
</ul>
</div>
<div class="footer-list">
<h3>Follow Us On</h3>
<ul class="social-icons">
<li><a href="https://github.com" target="_blank" style="color: white;"><i class="fab fa-github"></i></a></li>
<li><a href="https://instagram.com" target="_blank" style="color: white;"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://x.com" target="_blank" style="color: white;"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="https://facebook.com" target="_blank" style="color: white;"><i class="fab fa-facebook"></i></a></li>
<li><a href="https://linkedin.com" target="_blank" style="color: white;"><i class="fab fa-linkedin"></i></a></li>
<li><a href="https://github.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-github"></i></a></li>
<li><a href="https://instagram.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-instagram"></i></a></li>
<li><a href="https://x.com" target="_blank" style="color: var(--secondary-color);"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="https://facebook.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-facebook"></i></a></li>
<li><a href="https://linkedin.com" target="_blank" style="color: var(--secondary-color);"><i class="fab fa-linkedin"></i></a></li>
</ul>
</div>
</div>
<div class="copyright">&copy; 2024 PathSphere. All rights reserved.</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js" integrity="sha512-7eHRwcbYkK4d9g/6tD/mhkf++eoTHwpNM9woBxtPUBWm67zeAfFC+HrdoE2GanKeocly/VxeLvIqwvCdk7qScg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="script.js"></script>
</body>
</html>
Loading

0 comments on commit e7f83cd

Please sign in to comment.