-
Notifications
You must be signed in to change notification settings - Fork 10
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #3 from Upendra2003/master
created home page, added navbar and footer and followed color code.
- Loading branch information
Showing
4 changed files
with
675 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,127 @@ | ||
| <!DOCTYPE html> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Impact Wall</title> | ||
| <link rel="stylesheet" href="style.css"> | ||
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" /> | ||
| <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> | ||
| </head> | ||
| <body> | ||
| <header class="header-area overlay"> | ||
| <nav class="navbar navbar-expand-md navbar-dark"> | ||
| <div class="container"> | ||
| <a href="#" class="navbar-brand">Impace Wall</a> | ||
|
|
||
| <button type="button" class="navbar-toggler collapsed" data-toggle="collapse" data-target="#main-nav"> | ||
| <span class="menu-icon-bar"></span> | ||
| <span class="menu-icon-bar"></span> | ||
| <span class="menu-icon-bar"></span> | ||
| </button> | ||
|
|
||
| <div id="main-nav" class="collapse navbar-collapse"> | ||
| <ul class="navbar-nav ml-auto"> | ||
| <li><a href="#" class="nav-item nav-link active">Home</a></li> | ||
| <li><a href="#" class="nav-item nav-link">About Us</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
|
|
||
| <div class="banner"> | ||
| <div class="container"> | ||
| <h1>Welcome to <span class="navbar-brand" style="color: #D2B863;">Impact-Wall</span></h1> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec elit ex. Etiam elementum lectus et tempor molestie.</p> | ||
| <div class="p-4 bg-light rounded rounded-pill shadow-sm mb-4"> | ||
| <div class="input-group"> | ||
| <input type="search" placeholder="What're you searching for?" aria-describedby="button-addon1" class="form-control border-0 bg-light"> | ||
| <div class="input-group-append"> | ||
| <button id="button-addon1" type="submit" class="btn btn-link text-primary"><i class="fa fa-search"></i></button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </header> | ||
|
|
||
| <!-- cards --> | ||
|
|
||
| <div style="background-color: #D2B863;"> | ||
| <div class="container p-5"> | ||
| <h1 class="m-5" style="text-align: center; font-weight: bold; font-size: 40px;">Our <span style="color: #1B0508;">Participants</span></h1> | ||
| <hr> | ||
| <div class="row mt-5"> | ||
| <div class="col-md-3 col-sm-6 item"> | ||
| <div class="card item-card card-block"> | ||
| <img src="https://static.pexels.com/photos/7096/people-woman-coffee-meeting.jpg" alt="Photo of sunset"> | ||
| <h5 class="item-card-title mt-3 mb-3 p-2">Sierra Web Development • Owner</h5> | ||
| <p class="card-text p-2">This is a company that builds websites, web apps and e-commerce solutions.</p> | ||
| </div> | ||
| </div> | ||
| <div class="col-md-3 col-sm-6 item"> | ||
| <div class="card item-card card-block"> | ||
| <img src="https://static.pexels.com/photos/7357/startup-photos.jpg" alt="Photo of sunset"> | ||
| <h5 class="card-title p-2 mt-3 mb-3">ProVyuh</h5> | ||
| <p class="card-text p-2">This is a company that builds websites, web .</p> | ||
| </div> | ||
| </div> | ||
| <div class="col-md-3 col-sm-6 item"> | ||
| <div class="card item-card card-block"> | ||
| <img src="https://static.pexels.com/photos/262550/pexels-photo-262550.jpeg" alt="Photo of sunset"> | ||
| <h5 class="card-title p-2 mt-3 mb-3">ProVyuh</h5> | ||
| <p class="card-text p-2">This is a company that builds websites, web apps and e-commerce solutions.</p> | ||
| </div> | ||
| </div> | ||
| <div class="col-md-3 col-sm-6 item"> | ||
| <div class="card item-card card-block"> | ||
| <img src="https://static.pexels.com/photos/7357/startup-photos.jpg" alt="Photo of sunset"> | ||
| <h5 class="card-title p-2 mt-3 mb-3">ProVyuh</h5> | ||
| <p class="card-text p-2">This is a company that builds websites.</p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
| <!-- footer --> | ||
|
|
||
|
|
||
| <section class="contact-area" id="contact"> | ||
| <div class="container"> | ||
| <div class="row"> | ||
| <div class="col-lg-6 offset-lg-3"> | ||
| <div class="contact-content text-center"> | ||
| <a href="#" class="navbar-brand" style="font-size: 40px;">Impace Wall</a> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum </p> | ||
| <div class="hr"></div> | ||
| <h6>1120 Lorem ipsum dolor sit amet, KC 179050, Chandigarh.</h6> | ||
| <h6>+01 2345 6789 12<span>|</span>+01 2345 6789 12</h6> | ||
| <div class="contact-social"> | ||
| <ul> | ||
| <li><a class="hover-target" href=""><i class="fab fa-facebook-f"></i></a></li> | ||
| <li><a class="hover-target" href=""><i class="fab fa-linkedin-in"></i></a></li> | ||
| <li><a class="hover-target" href=""><i class="fab fa-github"></i></a></li> | ||
| <li><a class="hover-target" href=""><i class="fab fa-behance"></i></a></li> | ||
| <li><a class="hover-target" href=""><i class="fab fa-pinterest-p"></i></a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| <!-- =============== 1.9 Contact Area End ====================--> | ||
| <!-- =============== 1.9 Footer Area Start ====================--> | ||
| <footer> | ||
| <p>Copyright © 2019 <a href="#" class="navbar-brand"">Impace Wall</a> All Rights Reserved.</p> | ||
| </footer> | ||
|
|
||
|
|
||
|
|
||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> | ||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> | ||
| <script src="script.js"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,34 @@ | ||
| jQuery(function($) { | ||
| $(window).on('scroll', function() { | ||
| if ($(this).scrollTop() >= 200) { | ||
| $('.navbar').addClass('fixed-top'); | ||
| } else if ($(this).scrollTop() == 0) { | ||
| $('.navbar').removeClass('fixed-top'); | ||
| } | ||
| }); | ||
|
|
||
| function adjustNav() { | ||
| var winWidth = $(window).width(), | ||
| dropdown = $('.dropdown'), | ||
| dropdownMenu = $('.dropdown-menu'); | ||
|
|
||
| if (winWidth >= 768) { | ||
| dropdown.on('mouseenter', function() { | ||
| $(this).addClass('show') | ||
| .children(dropdownMenu).addClass('show'); | ||
| }); | ||
|
|
||
| dropdown.on('mouseleave', function() { | ||
| $(this).removeClass('show') | ||
| .children(dropdownMenu).removeClass('show'); | ||
| }); | ||
| } else { | ||
| dropdown.off('mouseenter mouseleave'); | ||
| } | ||
| } | ||
|
|
||
| $(window).on('resize', adjustNav); | ||
|
|
||
| adjustNav(); | ||
| }); | ||
|
|
Oops, something went wrong.