Last active
December 12, 2015 02:39
-
-
Save jesseclay/4700737 to your computer and use it in GitHub Desktop.
Mainpage from my first Cardinal Webdev project!
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> | |
| <head> | |
| <title>Welcome to PassFly!</title> | |
| <link rel="stylesheet" type="text/css" href="css/main.css"> | |
| <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <link href="http://netdna.bootstrapcdn.com/font-awesome/3.0.2/css/font-awesome.css" rel="stylesheet"> | |
| <link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'> | |
| <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/redmond/jquery-ui.css"> | |
| <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script> | |
| <script src="js/airports.js"></script> | |
| <script src="js/home.js"></script> | |
| <style type="text/css"> | |
| body { | |
| background-image: url(http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/paper_fibers_@2X.png) | |
| } | |
| @media (min-width: 1200px) { | |
| } | |
| #account-nav { | |
| min-width: 500px; | |
| } | |
| #account-nav .btn { | |
| float: right; | |
| margin: 5px; | |
| } | |
| #content-wrapper { | |
| clear: both; | |
| width: 500px; | |
| position: relative; | |
| margin: 0 auto; | |
| } | |
| #plane { | |
| z-index: -1; | |
| } | |
| #account-nav .btn, #content-wrapper .btn { | |
| font-family: 'Open Sans', sans-serif; | |
| background-color: hsl(207, 80%, 63%); | |
| background-repeat: repeat-x; | |
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1f7fd", endColorstr="#55a8ec"); | |
| background-image: -khtml-gradient(linear, left top, left bottom, from(#f1f7fd), to(#55a8ec)); | |
| background-image: -moz-linear-gradient(top, #f1f7fd, #55a8ec); | |
| background-image: -ms-linear-gradient(top, #f1f7fd, #55a8ec); | |
| background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f1f7fd), color-stop(100%, #55a8ec)); | |
| background-image: -webkit-linear-gradient(top, #f1f7fd, #55a8ec); | |
| background-image: -o-linear-gradient(top, #f1f7fd, #55a8ec); | |
| background-image: linear-gradient(#f1f7fd, #55a8ec); | |
| border-color: #55a8ec #55a8ec hsl(207, 80%, 54.5%); | |
| color: #333; | |
| text-shadow: 0 1px 1px rgba(255, 255, 255, 0.56); | |
| -webkit-font-smoothing: antialiased; | |
| font-weight: bold; | |
| font-size: 1em; | |
| padding: 3px 6px; | |
| } | |
| #title { | |
| text-align: center; | |
| font-size: 4em; | |
| padding-top: 30px; | |
| font-family: 'Playball', cursive; | |
| } | |
| #loginbox { | |
| background-image: url(http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/retina_wood_@2X.png); | |
| text-align: center; | |
| -webkit-border-radius: 100px; | |
| -moz-border-radius: 100px; | |
| border-radius: 100px; | |
| } | |
| #fly-button.btn { | |
| text-align: center; | |
| margin: 15px; | |
| font-size: 1.4em; | |
| padding: 5px 10px; | |
| } | |
| .form-search { | |
| padding: 90px 30px; | |
| margin-top: 50px; | |
| font-family: 'Playball', cursive; | |
| } | |
| #plane { | |
| position: absolute; | |
| left: -350px; | |
| top: 200px; | |
| height: 300px; | |
| } | |
| #icon { | |
| height: 10px; | |
| } | |
| #search { | |
| height: 40px; | |
| margin: 0 auto; | |
| width: 400px; | |
| text-align: center; | |
| font-size: 1.2em; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="account-nav"> | |
| <button class="btn btn-mini btn-primary" type="button">Sign In</button> | |
| <button class="btn btn-mini btn-primary" type="button">Sign Up</button> | |
| </div> | |
| <div id="content-wrapper"> | |
| <img src="http://thenounproject.com/noun/paper-airplane/#icon-No1373" id="plane"> | |
| <h1 id="title">Welcome To PassFly!</h1> | |
| <div id="loginbox"> | |
| <form class="form-search"> | |
| <h2>Where are you flying from?</h2> | |
| <input type="text" class="input-medium search-query" id="search" placeholder="Enter your airport here, e.g. SFO, JFK, etc..."> | |
| <button id="fly-button" type="submit" class="btn">Fly <i class="icon-plane"></i></button> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| <script type="text/javascript"> | |
| $(function() { | |
| var airports = AIRPORT_DB; | |
| airports = airports.filter(function(element) { | |
| return element["abbreviation"] != "N/A" && element["name"] != ""; | |
| }); | |
| airports = airports.map(function(element) { | |
| var name = element["name"]; | |
| var words = name.split(" "); | |
| words = words.map(function(word) { | |
| if (word.length < 2) return word; | |
| return word.substring(0, 1) + word.substring(1).toLowerCase(); | |
| }); | |
| return words.join(" ") + " (" + element["abbreviation"] + ")"; | |
| }); | |
| $("#search").autocomplete({ | |
| source: airports | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment