-
-
Save codecademydev/932aeae7ad4a295cd7f8c047945211d4 to your computer and use it in GitHub Desktop.
Codecademy export
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
| <!doctype html> | |
| <html> | |
| <head> | |
| <link rel="stylesheet" href="https://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css"> | |
| <link href='https://fonts.googleapis.com/css?family=Oxygen:300,400,700' rel='stylesheet' type='text/css'> | |
| <link rel="stylesheet" type="text/css" href="style.css"> | |
| </head> | |
| <body> | |
| <div class="jumbotron"> | |
| <div class="row"> | |
| <div class="col-md-2 pull-left"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/logo.svg"> | |
| </div> | |
| <div class="pull-right"> | |
| <ul> | |
| <li><a href="#"> Login</a></li> | |
| <li><a href="#"> Sign Up</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="container"> | |
| <div class="header"> | |
| </div> | |
| <div class="main"> | |
| <h1>Watch your favorite movies, instantly.</h1> | |
| <a href="#">Learn More</a> | |
| <form class="form-inline" role="form"> | |
| <div class="form-group"> | |
| <input type="text" class="form-control" id="search" placeholder="Browse the collection"> | |
| </div> | |
| <button type="submit" class="btn btn-submit">Search</button> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="supporting"> | |
| <div class="container"> | |
| <h2>A world of movies at your fingertips.</h2> | |
| <h3>Choose from the latest titles, with new movies added every day.</h3> | |
| <div class="row"> | |
| <div class="col-md-8"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/the-avengers.jpg"></div> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/harry-potter.jpg"></div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/frozen.jpg"></div> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/iron-man.jpg"></div> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/lord-of-the-rings.jpg"></div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/lord-of-the-rings.jpg"></div> | |
| <div class="col-md-8"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/skyfall.jpg"></div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/frozen.jpg"></div> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/pirates-of-the-caribbean.jpg"></div> | |
| <div class="col-md-4"> | |
| <img src="https://s3.amazonaws.com/codecademy-content/projects/bolt-network/toy-story-3.jpg"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="feature"> | |
| <div class="container"> | |
| <h2>Available everywhere</h2> | |
| <h3>Start watching on one device, and pick up where you left off on another device.</h3> | |
| </div> | |
| </div> | |
| <div class="footer"> | |
| <div class="container"> | |
| </div> | |
| </div> | |
| </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
| html, body { | |
| font-family: "Oxygen", sans-serif; | |
| font-weight: 300; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| .jumbotron{ | |
| background-color:black; | |
| height:400px; | |
| } | |
| .jumbotron img{ | |
| width:200px; | |
| } | |
| .pull-right{ | |
| position:relative; | |
| margin-right:10px; | |
| margin-top:30px; | |
| } | |
| .pull-right ul{ | |
| margin-top:-25px; | |
| } | |
| .main h1{ | |
| color:white; | |
| padding:15px; | |
| } | |
| .main form{ | |
| padding:20px; | |
| } | |
| .main a{ | |
| padding:10px; | |
| } | |
| .main{ | |
| text-align:center; | |
| } | |
| .pull-roght ul{ | |
| margin-left:50px; | |
| } | |
| .pull-right li{ | |
| list-style:none; | |
| color:white; | |
| display:inline; | |
| padding:10px; | |
| } | |
| .jumbotron a{ | |
| color:#1a1aff; | |
| border:1px solid #1a1aff; | |
| padding:10px; | |
| } | |
| .jumbotron a:hover{ | |
| background-color: #5f91ec; | |
| color:white; | |
| text-decoration:none; | |
| } | |
| .container { | |
| max-width: 970px; | |
| } | |
| .form-group{ | |
| background-color:black; | |
| } | |
| .supporting { | |
| position:relative; | |
| background: url("http://wallpapercave.com/wp/3jQbonO.jpg"); | |
| text-align:center; | |
| padding:100px; | |
| top:-30px; | |
| } | |
| .supporting h2{ | |
| font-size:400%; | |
| color:#0099ff; | |
| } | |
| .supporting h3{ | |
| color:white; | |
| } | |
| .btn{ | |
| color:#1a1aff; | |
| border:1px solid #1a1aff; | |
| padding:10px; | |
| background-color:black; | |
| position:relative; | |
| left:30px; | |
| } | |
| #search{ | |
| background-color:black; | |
| border:0 0 0 1px solid black; | |
| } | |
| .feature{ | |
| text-align:center; | |
| background:url("https://s3.amazonaws.com/codecademy-content/projects/bolt-network/feature.jpg"); | |
| height:500px; | |
| text-align:center; | |
| } | |
| .feature h1{ | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment