-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
83 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,83 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
|
||
<head> | ||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> | ||
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.14.7/dist/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> | ||
<link rel="stylesheet" href="style.css"> | ||
</head> | ||
|
||
<body> | ||
<nav class="navbar navbar-expand-lg navbar-light navbar-bg"> | ||
<a class="navbar-brand" href="#"> | ||
<img src="https://assets.ccbp.in/frontend/responsive-website/landing-section-design-logo-img.png" class="Design-logo" /> | ||
</a> | ||
<button class="navbar-toggler bg-white" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> | ||
<span class="navbar-toggler-icon"></span> | ||
</button> | ||
<div class="collapse navbar-collapse" id="navbarNavAltMarkup"> | ||
<div class="navbar-nav ml-auto"> | ||
<a class="nav-item nav-link active" href="#"> | ||
<p class="font-text">Home</p> <span class="sr-only">(current)</span> | ||
</a> | ||
<a class="nav-item nav-link" href="#"> | ||
<p class="font-text">Features</p> | ||
</a> | ||
<a class="nav-item nav-link" href="#"> | ||
<p class="font-text">Pricing</p> | ||
</a> | ||
<a class="nav-item nav-link disabled" href="#"> | ||
<p class="font-text">Blog</p> | ||
</a> | ||
<a class="nav-item nav-link disabled" href="#"> | ||
<p class="font-text">Contacts</p> | ||
</a> | ||
</div> | ||
</div> | ||
</nav> | ||
<div class="container-fluid"> | ||
<div class="row"> | ||
<div class="bng-img"> | ||
<div class="col-12 col-md-12 col-lg-12 col-xl-12"> | ||
<div class="text-center"> | ||
<h1 class="main-heading mb-4"> The most <span style="color:#ffdda6">flexible</span> web design tool </h1> | ||
<p class="Description mb-4"> We've done it carefully and simply, Combined with the ingredients makes for beautiful landings. It is the tool you need to speed up your design process. </p> | ||
<!-- Button trigger modal --> | ||
<button type="button" class="btn-2" data-toggle="modal" data-target="#exampleModal"> | ||
Sign Up | ||
</button> | ||
<!-- Modal --> | ||
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> | ||
<div class="modal-dialog" role="document"> | ||
<div class="modal-content"> | ||
<div class="modal-header"> | ||
<h5 class="modal-title" id="exampleModalLabel">Login Page</h5> | ||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> | ||
<span aria-hidden="true">×</span> | ||
</button> | ||
</div> | ||
<div class="modal-body pt-4 pb-4"> | ||
<label class="mb-3 ml-4"> Username </label> | ||
<input type="text" class="mb-3 ml-2 p-1"> <br /> | ||
<label class="mb-3"> Email Address </label> | ||
<input type="email" class="mb-3 ml-2 p-1"> <br /> | ||
<label class="mb-3 ml-4"> Mobile No </label> | ||
<input type="text" class="mb-3 ml-2 p-1"> | ||
</div> | ||
<div class="modal-footer"> | ||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> | ||
<button type="button" class="btn btn-primary"> Save </button> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</body> | ||
|
||
</html> |