Skip to content

Commit

Permalink
Made footer consistent in responsive layouts
Browse files Browse the repository at this point in the history
  • Loading branch information
@shivam8112005
shivam8112005 committed Oct 28, 2024
1 parent a5b1f75 commit 13f112b
Show file tree
Hide file tree
Showing 4 changed files with 429 additions and 429 deletions.
262 changes: 127 additions & 135 deletions blog.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1208,155 +1208,147 @@ <h2 class="category-heading">Categories</h2>
<!-- footer -->
<footer id="footer">
<div class="footer-container">
<div class="row mb-3 col-3-main">
<div class="col-3">
<div id="about-us">
<h2 class="footer-title secondary-title">About Us</h2>

<div class="secondary-title text-secondary">
<p class="mt-2 style=" text-align: left;">
We are a close-knit team of passionate storytellers dedicated to sharing captivating content with the
world.
</p>

<address>
<i class="fas fa-map-marker-alt text-primary"></i>
5 South Main Street Los Angeles, ZZ-9611 USA
</address>

<div class="phone">
<i class="fas fa-mobile text-primary"></i>
125-896-485
</div>

<div class="email">
<a href="mailto: [email protected]" style="color: 3B3B58;"><i
class="fas fa-envelope text-primary"></i>
<span id="mailhover">[email protected]</span>
<style>
#mailhover:hover {
color: #f44336;
transition: color 0.5s ease-out;
}
</style>
</a>
</div>
<div> <a href="privacy.html" style="color: #520be1e7;">Privacy Policy</a> </div>
<div>
<img
src="https://hits.sh/anshika-26.github.io/WordWise.svg?label=Website%20Views&extraCount=1515&color=30322f&labelColor=F5B3B5"
alt="Web views" style="height: 20px;width: 150px;margin-top: 40px;">
</div>
</div>
<div class="row mb-3 col-3-main">
<div class="col-3">
<div id = "about-us">
<h2 class="footer-title secondary-title" >About Us</h2>

<div class="secondary-title text-secondary " >
<p class="mt-2 text-lg" style="text-align: left;" >
We are a close-knit team of passionate storytellers dedicated to sharing captivating content with the world.
</p>

<address class="mt-2">
<i class="fas fa-map-marker-alt text-primary"></i>
5 South Main Street Los Angeles, ZZ-9611 USA
</address>

<div class="phone mt-2">
<i class="fas fa-mobile text-primary"></i>
125-896-485
</div>

<div class="email mt-2">
<a href="mailto: [email protected]" style="color: 3B3B58;"><i class="fas fa-envelope text-primary"></i>
<span id="mailhover">[email protected]</span>
<style>
#mailhover:hover{
color: #f44336;
transition: color 0.5s ease-out;
}
</style>
</a>
</div>

</div>
</div>
<div class="col-3">
<h2 class="footer-title secondary-title">Feature Post</h2>
<div>
<img src="https://hits.sh/anshika-26.github.io/WordWise.svg?label=Website%20Views&extraCount=1515&color=30322f&labelColor=F5B3B5" alt="Web views" style="height: 20px;width: 150px;margin-top: 40px;">
</div>
</div>

<div class="feature-post">
<div class="flex-item">
<article class="article">
<div class="d-flex ">
<a class="d-flex" href="#">
<img src="./assets/img9.webp" class="object-fit" alt="">
<div class="px-1" style="width: 300px;">
<a href="#" class="text-title display-2 text-dark">
Embrace the beauty of nature through our enchanting blog, where we celebrate the wonders of
the natural world
</a>
<p class="secondary-title text-secondary display-3" style="margin-top:3px;">
<span><i class="far fa-clock text-primary"></i> Wed 02, 2022 </span>
</p>
</div>
</a>
</div>
</article>
</div>
</div>
<div class="flex-item">
<article class="article">
<div class="d-flex">
<a class="d-flex" href="#">
<img src="./assets/img1.webp" class="object-fit" alt="">
<div class="px-1" style="width: 300px;">
<a href="#" class="text-title display-2 text-dark">
Embark on unforgettable journeys through our travel blog, where wanderlust meets inspiration
</a>
<p class="secondary-title text-secondary display-3" style="margin-top:3px;">
<span><i class="far fa-clock text-primary"></i> Wed 05, 2020 </span>
</p>
<div class="col-3">
<h2 class="footer-title secondary-title">Feature Post</h2>

<div class="feature-post">
<div class="flex-item">
<article class="article">
<div class="d-flex" style="align-items: flex-start; ">
<a class="d-flex" href="#">
<img src="./assets/img9.webp" class="object-fit" alt="">
<div class="px-1" style="width: 300px; ">
<a href="#" class="text-title display-2 text-dark">
Embrace the beauty of nature through our enchanting blog, where we celebrate the wonders of the natural world
</a>
<p class="secondary-title text-secondary " style="margin-top:3px;margin-left:0px; text-align: left; ">
<span><i class="far fa-clock text-primary"></i> Wed 02, 2022 </span>
</p>
</div>
</a>
</div>
</article>

</div>
</a>
<div class="flex-item">
<article class="article">
<div class="d-flex" style="align-items: flex-start; ">
<a class="d-flex" href="#">
<img src="./assets/img1.webp" class="object-fit" alt="">
<div class="px-1" style="width: 300px;">
<a href="#" class="text-title display-2 text-dark">
Embark on unforgettable journeys through our travel blog, where wanderlust meets inspiration
</a>
<p class="secondary-title text-secondary display-3" style="margin-top:3px;margin-left:0px; text-align: left;">
<span><i class="far fa-clock text-primary"></i> Wed 05, 2020 </span>
</p>
</div>
</a>
</div>
</article>
</div>
<div class="flex-item">
<article class="article">
<div class="d-flex" style="align-items: flex-start; ">
<a class="d-flex " href="#" >
<img src="./assets/img2.webp" class="object-fit" alt="">
<div class="px-1" style="width: 300px;">
<a href="#" class="text-title display-2 text-dark">
Gaming Adventures Unleashed
</a>
<p class="secondary-title text-secondary display-3" style="margin-top:3px;margin-left:0px; text-align: left;">
<span><i class="far fa-clock text-primary"></i> Wed 02, 2021 </span>
</p>
</div>
</a>
</div>
</article>
</div>
</div>
</article>
</div>
<div class="flex-item">
<article class="article">
<div class="d-flex">
<a class="d-flex" href="#">
<img src="./assets/img2.webp" class="object-fit" alt="">
<div class="px-1" style="width: 300px;">
<a href="#" class="text-title display-2 text-dark">
Gaming Adventures Unleashed
</a>
<p class="secondary-title text-secondary display-3" style="margin-top:3px;">
<span><i class="far fa-clock text-primary"></i> Wed 02, 2021 </span>
</p>
</div>
</a>
<div class="col-3">
<h2 class="footer-title secondary-title">Popular Tags</h2>

<div class="tags">
<div class="d-flex-gap flex-wrap">
<a href="#" class="nav-link btn bg-light pop-link">Travel</a>
<a href="#" class="nav-link btn bg-light pop-link">Food</a>
<a href="#" class="nav-link btn bg-light pop-link">Lifestyle</a>
<a href="#" class="nav-link btn bg-light pop-link">Techonogy</a>
<a href="#" class="nav-link btn bg-light pop-link">Fashion</a>
</div>
<style>
.pop-link{
transition: 1.0s ease !important;
}

</style>
</div>

<h2 class="footer-title secondary-title mt-5">Connect with us</h2>

<div class="tags social" id="contact">
<div class="d-flex-gap flex-wrap">
<a href="https://www.facebook.com/" id="facebook" class="nav-link btn bg-light"><i class="fab fa-facebook-f"></i></a>
<a href="https://x.com/" id="twitter" class="nav-link btn bg-light"><i class="fa-brands fa-x-twitter"></i></a>
<a href="https://www.instagram.com/" id="instagram" class="nav-link btn bg-light"><i class="fab fa-instagram"></i></a>
<a href="https://dribbble.com/" id="dribbble" class="nav-link btn bg-light"><i class="fab fa-dribbble"></i></a>
<a href="https://github.com/ANSHIKA-26?tab=overview&from=2022-12-01&to=2022-12-31" id="github" target="_blank"
class="nav-link btn bg-light"><i class="fa-brands fa-github"></i></a>
</div>
</div>
</article>
</div>
</div>
</div>
<div class="col-3">
<h2 class="footer-title secondary-title">Popular Tags</h2>

<div class="tags">
<div class="d-flex-gap flex-wrap">
<a href="#" class="nav-link btn bg-light pop-link">Travel</a>
<a href="#" class="nav-link btn bg-light pop-link">Food</a>
<a href="#" class="nav-link btn bg-light pop-link">Lifestyle</a>
<a href="#" class="nav-link btn bg-light pop-link">Techonogy</a>
<a href="#" class="nav-link btn bg-light pop-link">Fashion</a>

</div>
<style>
.pop-link {
transition: 1.0s ease !important;
}
</style>
</div>

<h2 class="footer-title secondary-title mt-2">Connect with us</h2>

<div class="tags social" id="contact">
<div class="d-flex-gap flex-wrap">
<a href="https://www.facebook.com/" id="facebook" class="nav-link btn bg-light"><i
class="fab fa-facebook-f"></i></a>
<a href="https://www.twitter.com/" id="twitter" class="nav-link btn bg-light"><i
class="fa-brands fa-x-twitter"></i>
<a href="https://www.instagram.com/" id="instagram" class="nav-link btn bg-light"><i
class="fab fa-instagram"></i></a>
<a href="https://dribbble.com/" id="dribbble" class="nav-link btn bg-light"><i
class="fab fa-dribbble"></i></a>
<a href="https://github.com/ANSHIKA-26?tab=overview&from=2022-12-01&to=2022-12-31" id="github"
target="_blank" class="nav-link btn bg-light"><i class="fa-brands fa-github"></i></a>
</div>
</div>

</div>
</div>


</div>
<!-- the authentication copyright -->
<div class="wordwise-footer">
<!-- the authentication copyright -->
<div class="wordwise-footer">
<div class="wordwise-footer-content">
<p>&copy; <span id="current-year"></span> WordWise. All rights reserved.</p>
<p class="last">&copy; <span id="current-year"></span> WordWise. All rights reserved.</p>
</div>
</div>

</footer>
</div>
</footer>
<!-- Script for Navbar Toggle -->
<script>

Expand Down
Loading

0 comments on commit 13f112b

Please sign in to comment.