| @@ -1,173 +1,66 @@ | ||
|
|
||
| .vertical-center { | ||
| min-height: 100%; /* Fallback for browsers do NOT support vh unit */ | ||
| min-height: 100vh; /* These two lines are counted as one :-) */ | ||
|
|
||
| display: flex; | ||
| align-items: center; | ||
| } | ||
| .starter-template { | ||
| padding: 3rem 1.5rem; | ||
| text-align: center; | ||
| } | ||
| .pull-xs-right { | ||
| float: right!important; | ||
| } | ||
|
|
||
| .scroll-overflow{ | ||
| overflow-y: auto; | ||
| height: 100px; | ||
| max-height: 100px; | ||
| } | ||
|
|
||
| .scroll-overflow-large{ | ||
| overflow-y: scroll; | ||
| max-height: 700px; | ||
| } | ||
|
|
||
| .margin-top{ | ||
| margin-top: 40px; | ||
| } | ||
| .margin-bot{ | ||
| margin-bottom: 40px; | ||
| } | ||
| .margin-top-bot-5{ | ||
| margin-top: 5px; | ||
| margin-bottom: 5px; | ||
| } | ||
| .right { | ||
| text-align: right; | ||
| } | ||
|
|
||
| .left { | ||
| text-align: left; | ||
| } | ||
|
|
||
|
|
||
| .center { | ||
| text-align: center; | ||
| } | ||
|
|
||
|
|
||
| .navbar-static-top { | ||
| margin-bottom: 1px; | ||
| } | ||
|
|
||
|
|
||
| .navbar-default { | ||
| background-color: #000000; | ||
| border-color: #0; | ||
| color: white; | ||
| } | ||
|
|
||
|
|
||
| .hidden { | ||
| display: none; | ||
| } |
| @@ -1,48 +1,5 @@ | ||
|
|
||
| $(document).ready(function() { | ||
|
|
||
|
|
||
|
|
||
| @@ -1,76 +1,53 @@ | ||
| <!DOCTYPE html> | ||
| {% load staticfiles %} | ||
| <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, shrink-to-fit=no"> | ||
| <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> | ||
| <meta name="description" content=""> | ||
| <meta name="author" content=""> | ||
| <link rel="icon" href="../../favicon.ico"> | ||
|
|
||
| <title>Starter Template for Bootstrap</title> | ||
|
|
||
| <!-- Bootstrap core CSS --> | ||
| <link href="{% static 'bootstrap-3.3.6-dist/css/bootstrap.min.css' %}" rel="stylesheet"> | ||
|
|
||
| <!-- Custom styles for this template --> | ||
| <link href="{% static 'css/custom.css' %}" rel="stylesheet"> | ||
| </head> | ||
|
|
||
| <nav class="navbar navbar-default navbar-static-top navbar-color "> | ||
| <div class="container"> | ||
| <div class="navbar-header"> | ||
| <a class="navbar-brand" href="/main/">Name Logo</a> | ||
| </div> | ||
| {% block navbar %} | ||
| {% endblock %} | ||
| </div> | ||
| </nav> | ||
|
|
||
| <div> | ||
| {% block headers %} | ||
| {% endblock %} | ||
| </div> | ||
|
|
||
| <div> | ||
| {% block main %} | ||
| {% endblock %} | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| <!-- Bootstrap core JavaScript | ||
| ================================================== --> | ||
| <!-- Placed at the end of the document so the pages load faster --> | ||
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> | ||
| <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script> | ||
| <script src="{% static 'bootstrap-3.3.6-dist/js/bootstrap.min.js' %}"></script> | ||
| <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> | ||
| <script src="{% static 'bootstrap-3.3.6-dist/js/ie10-viewport-bug-workaround.js'}"></script> | ||
|
|
||
| </html> |
| @@ -0,0 +1,116 @@ | ||
| {% extends 'base.html' %} | ||
|
|
||
|
|
||
| {% block navbar %} | ||
| <div class="pull-xs-right"> | ||
| <a class="navbar-brand" href="login/">Login</a> | ||
| </div> | ||
| {% endblock %} | ||
|
|
||
|
|
||
|
|
||
| {% block main %} | ||
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> | ||
| {{ form.media }} | ||
| <div class="container marketing margin-top"> | ||
|
|
||
| <form class="col-md-8 col-md-offset-4" id="login_form" method="post" action="/main/addtrip/"> | ||
| {% csrf_token %} | ||
|
|
||
|
|
||
| <!-- username input--> | ||
| <div class="form-group left"> | ||
| <div class="col-md-4"> | ||
| <input id="id_name" name="name" type="text" placeholder="name" class="form-control"> | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
| <!-- Origin --> | ||
|
|
||
| <div class="form-group left"> | ||
| <label class="col-md-4 control-label" for="id_origin">Select Origin</label> | ||
| <div class="col-md-4"> | ||
| <select id="id_origin" name="origin" class="form-control"> | ||
| {% for location in locations %} | ||
| <option value="{{location}}">{{location}}</option> | ||
| {% endfor %} | ||
| </select> | ||
| </div> | ||
| </div> | ||
|
|
||
| <br> | ||
|
|
||
| <!-- Destination --> | ||
| <div class="form-group left"> | ||
| <label class="col-md-4 control-label" for="id_origin">Select Destination</label> | ||
| <div class="col-md-4"> | ||
| <select id="id_destination" name="destination" class="form-control"> | ||
| {% for location in locations%} | ||
| <option value="{{location}}">{{location}}</option> | ||
| {% endfor %} | ||
| </select> | ||
| </div> | ||
| </div> | ||
| <br> | ||
|
|
||
| <div class="col-md-8"> | ||
| {{ form.date }} | ||
| </div> | ||
| <br> | ||
|
|
||
|
|
||
| <!-- Select Type --> | ||
| <div class="form-group left"> | ||
| <label class="col-md-8 control-label" for="id_looktype"></label> | ||
| <div class="col-md-8"> | ||
| <select id="id_looktype" name="looktype" class="form-control"> | ||
| <option value="Driver">Driver</option> | ||
| <option value="Passenger">Passenger</option> | ||
| </select> | ||
| </div> | ||
| </div> | ||
| <br> | ||
|
|
||
| <!-- Select pass --> | ||
| <div class="form-group left"> | ||
| <label class="col-md-4 control-label" for="id_passengers">Passengers</label> | ||
| <div class="col-md-4"> | ||
| <select id="id_passengers" name="passengers" class="form-control"> | ||
| <option value=0>0</option> | ||
| <option value=1>1</option> | ||
| <option value=2>2</option> | ||
| <option value=3>3</option> | ||
| <option value=4>4</option> | ||
| <option value=5>5</option> | ||
| <option value=6>6</option> | ||
| </select> | ||
| </div> | ||
| </div> | ||
| <br> | ||
|
|
||
| <!-- MSG --> | ||
| <div class="form-group left"> | ||
| <label class="col-md-4 control-label" for="id_msg">Message</label> | ||
| <div class="col-md-8"> | ||
| <textarea id="id_msg" class="form-control" name="msg">default text</textarea> | ||
| </div> | ||
| </div> | ||
| <br> | ||
|
|
||
| <br> | ||
| <div class="margin-top"> | ||
| <input class=" btn btn-lg btn-default" type="submit" name="submit" value="Confirm"/> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
| </form> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
|
|
||
| {% endblock %} |
| @@ -1,17 +1,15 @@ | ||
| {% extends 'base.html' %} | ||
|
|
||
|
|
||
| {% block navbar %} | ||
| <div class="pull-xs-right"> | ||
| <a class="navbar-brand" href="login/">Login</a> | ||
| </div> | ||
| {% endblock %} | ||
|
|
||
| {% block main %} | ||
| <div class="container marketing centered"> | ||
| {{form}} | ||
| </div> | ||
|
|
||
| {% endblock %} |
| @@ -1,56 +1,79 @@ | ||
| {% extends 'base.html' %} | ||
|
|
||
| {% load staticfiles %} | ||
|
|
||
| {% block navbar %} | ||
| <div class="pull-xs-right"> | ||
| <a class="navbar-brand" href="login/">Login</a> | ||
| </div> | ||
| {% endblock %} | ||
|
|
||
| {% block headers %} | ||
| <body background="../../static/pics/Ferry.jpg"> </body> | ||
| <div class="container marketing margin-top margin-bot "> | ||
|
|
||
| <!-- Three columns of text below the carousel --> | ||
| <div class="row text-center"> | ||
| <div class="col-md-4"> | ||
| <img class="img-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140"> | ||
| <h2>Save money!</h2> | ||
| <p>Taking a car on the ferry is expensive. A driver can potentially save over $30 per trip.</p> | ||
| </div><!-- /.col-lg-4 --> | ||
| <div class="col-lg-4"> | ||
| <img class="img-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140"> | ||
| <h2>Save the environment!</h2> | ||
| <p>100 people carpooling can prevent 1,320 pounds of carbon monoxide from being released into the atmosphere in a single year.</p> | ||
| </div><!-- /.col-lg-4 --> | ||
| <div class="col-lg-4"> | ||
| <img class="img-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140"> | ||
| <h2>Faster than the bus!</h2> | ||
| <p>Riding the bus sucks. Get a faster, more comfortable ride for as little as $5-$10.</p> | ||
| </div><!-- /.col-lg-4 --> | ||
| </div><!-- /.row --> | ||
|
|
||
|
|
||
|
|
||
|
|
||
| {% endblock %} | ||
|
|
||
|
|
||
| <!--REGISTRATION --> | ||
| {% block main %} | ||
|
|
||
| <div class="container marketing centered"> | ||
| <form class = "form-horizontal col-md-5 col-md-offset-4" id="user_form" method="post" action="/main/" | ||
| enctype="multipart/form-data"> | ||
| {% csrf_token %} | ||
|
|
||
|
|
||
| <!-- username input--> | ||
| <div class="form-group"> | ||
| <div class="col-md-8"> | ||
| <input id="id_username" name="username" type="text" placeholder="Username" class="form-control input-md"> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- email input--> | ||
| <div class="form-group"> | ||
| <div class="col-md-8"> | ||
| <input id="id_email" name="email" type="text" placeholder="Email" class="form-control input-md"> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Password input--> | ||
| <div class="form-group"> | ||
| <div class="col-md-8"> | ||
| <input id="id_password" maxlength="128" name="password" type="password" placeholder="Password" class="form-control input-md"> | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| <div class="col-md-offset-2 "> | ||
| <input class=" btn btn-lg btn-default" type="submit" name="submit" value="Register"/> | ||
| </div> | ||
| </form> | ||
|
|
||
| </div> | ||
|
|
||
| {% endblock %} |
| @@ -1,12 +1,59 @@ | ||
| {% extends 'base.html' %} | ||
|
|
||
|
|
||
| {% block navbar %} | ||
| <div class="pull-xs-right"> | ||
| <a class="navbar-brand" href="logout/">Logout</a> | ||
| </div> | ||
| {% endblock %} | ||
| {% block main %} | ||
|
|
||
| <div class="container-fluid"> | ||
| <!-- search left side block --> | ||
| <div class="col-md-offset-2 col-md-2 sidebar"> | ||
| <ul class="nav nav-sidebar list-group-item"> | ||
| <span class="sr-only">(current)</span></a></li> | ||
| {% for trip in trips %} | ||
| <li ><a href="/main/userpage/?trip={{trip.key}}"> {{trip.name}}</a></li> | ||
| {% endfor %} | ||
| <li><a href="/main/addtrip/"> + Add New Trip</a></li> | ||
| </ul> | ||
|
|
||
|
|
||
| </div> | ||
|
|
||
| <!-- center block --> | ||
|
|
||
| <div class="col-md-5"> | ||
| <div class="row text-center margin-bot-19"> | ||
|
|
||
| {% if results %} | ||
|
|
||
| <ul class="list-group"> | ||
| {% for result in results %} | ||
| <li class="list-group-item left "> | ||
| <h4>{{result.user.username}}, {{result.looktype}}</h4> | ||
| <span>{{result.origin}}->{{result.destination}}, {{result.date}} </span> | ||
| <div> | ||
| <spam>{{result.msg}}</spam> | ||
| </div> | ||
| <div class="right"> | ||
| <button type="button" class="btn btn-default">Message</button> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| </li> | ||
| {% endfor %} | ||
| </ul> | ||
|
|
||
|
|
||
| {% endif %} | ||
|
|
||
|
|
||
|
|
||
|
|
||
| </div> | ||
|
|
||
|
|
||
| {% endblock %} |