Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
Bootstrap Wireframe
- Loading branch information
Showing
1 changed file
with
112 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,112 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Week 10 Landing Page</title> | ||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> | ||
<style> | ||
.border border-dark { | ||
border: solid; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<div class="container-fluid px-5"> | ||
<!-- Content here --> | ||
|
||
<div class="row"> | ||
<div id="axit-nav" class="col-lg-6 border border-dark"> | ||
<h3>AXIT</h3> | ||
</div> | ||
<div class="col-sm border border-dark"> | ||
Features | ||
</div> | ||
<div class="col-sm border border-dark"> | ||
About | ||
</div> | ||
<div class="col-sm border border-dark"> | ||
Pricing | ||
</div> | ||
<div class="col-sm border border-dark"> | ||
Reviews | ||
</div> | ||
<div class="col-sm border border-dark pe-4"> | ||
Contact | ||
</div> | ||
</div> | ||
|
||
|
||
<div class="row" id="main"> | ||
<div class="col-sm border border-dark py-5" id="left"> | ||
<h1>AXIT</h1> | ||
<h2>MODERN AXURE TEMPLATE FOR BEAUTIFUL PROTOTYPES</h2> | ||
<hr class="w-25"> | ||
<p>Lorem ipsum dolor sit amet consectetur adipscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo.</p> | ||
<button class="mb-1">Download</button> | ||
</div> | ||
<div class="col-sm border border-dark py-5"> | ||
<div class="row d-flex justify-content-center align-items-baseline align-content-start border border-dark"> | ||
<div class="d-flex p-2 justify-content-center w-75 border border-dark"> | ||
<div class="w-50"><h5>Try Your Free Trial Today</h5></div> | ||
|
||
</div> | ||
<div class="d-flex p-2 flex-column justify-content-center w-75 border border-dark align-items-center"> | ||
<div class="border-bottom border-dark w-50"><p>Name</p></div> | ||
</div> | ||
<div class="d-flex p-2 flex-column justify-content-center w-75 border border-dark align-items-center"> | ||
<div class="border-bottom border-dark w-50"><p>Email</p></div> | ||
</div> | ||
<div class="d-flex p-2 flex-column justify-content-center w-75 border border-dark align-items-center"> | ||
<div class="border-bottom border-dark w-50"><p>Password</p></div> | ||
</div> | ||
<div class="d-flex p-2 justify-content-center w-75 border border-dark"> | ||
<div><p>Get Started</p></div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="row border border-dark"> | ||
<div class="col-lg-4 border border-dark"> | ||
<h6>Social Media</h6> | ||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenan euismod bibendum laoreet.</p> | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
<div class="col-sm d-sm-none d-none d-md-block border border-dark"> | ||
Logo | ||
</div> | ||
</div> | ||
<div class="border border-dark d-flex justify-content-center"> | ||
<div class="row border border-dark w-50"> | ||
<div class="col-sm border border-dark">Logo</div> | ||
<div class="col-sm border border-dark">Logo</div> | ||
<div class="col-sm border border-dark">Logo</div> | ||
<div class="col-sm border border-dark">Logo</div> | ||
<div class="col-sm border border-dark">Logo</div> | ||
<div class="col-sm border border-dark">Logo</div> | ||
<div class="col-sm border border-dark">Logo</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script> | ||
</body> | ||
</html> |