Skip to content

GitLab

Commit 833b6d48 authored by Daniel W Bond's avatar Daniel W Bond
Browse files

didn't intend to start doing this, but fixed spacing and separated out layout files

parent fd28168f
Hide whitespace changes
Inline Side-by-side
templates/base.html deleted 100644 → 0
View file @ fd28168f
<!DOCTYPE html>
<html>
{% block head %}
<head>
{% include 'head.html' %}
</head>
{% endblock %}
<body>
<div class="holder">
{% block nav %}
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">what's open</a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<div class="navbar-form navbar-right" role="search">
<div class="form-group">
<input id="searchBar" type="text" class="form-control" placeholder="Search">
</div>
</div>
<ul class="nav navbar-nav navbar-right">
<li>
<a id="about-link">
<span id="about-link-text">About</span><img id="about-close-nav" src="{{ STATIC_URL }}img/close.png">
</a>
</li>
<li class="dropdown" style="display:none;">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Select Campus <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Fairfax</a></li>
<li><a href="#">Arlington</a></li>
<li><a href="#">Prince William</a></li>
</ul>
</li>
</ul>
</div>
</nav>
{% endblock %}
<div id="about-body">
<div class="container" id="about-container">
{% include 'about.html' %}
</div>
</div>
<div id="info-body">
<div class="container" id="info-container">
<div class="row" id="info-row">
<a id="info-close"><img src="{{ STATIC_URL }}img/close.png"></a>
<div class="col-md-12" id="info-name"></div>
<div class="col-md-3" id="info-status"></div>
<div class="col-md-3" id="info-next"></div>
<div class="col-md-3" id="info-location"></div>
<div id="info-schedule"></div>
</div>
</div>
</div>
<div class="container main-container">
<div class="row">
<div class="col-md-12">
{% block content %}
{% endblock %}
</div>
</div>
</div>
{% block footer %}
<div id="footer">
<div class="footer-row">
<a class="gmu-brand" href="http://www.gmu.edu"><img src="{{ STATIC_URL }}img/gmurgb.png" class="gmu-logo"></a>
<div class="col-md-8 col-md-offset-2">
<p class="footer-text">A project of <a href="http://srct.gmu.edu">GMU SRCT</a>. <a href="http://opensource.org/licenses/MIT/">Some rights reserved</a>.<span id="footer-line">&nbsp;&nbsp;|&nbsp;&nbsp;</span><br class="visible-xs visible-sm"/> George Mason University <a href="http://dining.gmu.edu/">Dining Services</a>&nbsp;&nbsp;&nbsp; &nbsp;</p>
</div>
</div>
</div>
{% endblock %}
</div>
</body>
</html>
templates/head.html deleted 100644 → 0
View file @ fd28168f
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta name="description=" content="What's Open is a dynamic web application that lets you easily find out which on-campus locations are currently available. It's a simple alternative to searching for Mason's campus hours and filtering though them to figure out which ones are open.">
<link rel="icon" href="/favicon.ico">
<link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet">
<link href="{{ STATIC_URL }}css/style.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script>
<script src="{{ STATIC_URL }}js/bootstrap.min.js"></script>
<script src="{{ STATIC_URL }}js/grid.js"></script>
<script src="{{ STATIC_URL }}js/typeAhead.js"></script>
<script src="{{ STATIC_URL }}js/info.js"></script>
<script src="{{ STATIC_URL }}js/about.js"></script>
{% block title %}
<title>
What's Open - George Mason University
</title>
{% endblock %}
templates/layout/base.html 0 → 100644
View file @ 833b6d48
<!DOCTYPE html>
<html>
{% include 'layout/head.html' %}
<body>
<div class="holder">
{% include 'layout/navbar.html' %}
<div class="container main-container">
<div class="row">
<div class="col-md-12">
{% block content %}
{% endblock %}
</div>
</div>
</div>
<div id="footer">
{% include 'layout/footer.html' %}
</div>
</div>
</body>
</html>
templates/layout/footer.html 0 → 100644
View file @ 833b6d48
<div class="footer-row">
<a class="gmu-brand" href="http://www.gmu.edu"><img src="{{ STATIC_URL }}img/gmurgb.png" class="gmu-logo"></a>
<div class="col-md-8 col-md-offset-2">
<p class="footer-text">A project of <a href="http://srct.gmu.edu">GMU SRCT</a>. <a href="http://opensource.org/licenses/MIT/">Some rights reserved</a>.<span id="footer-line">&nbsp;&nbsp;|&nbsp;&nbsp;</span><br class="visible-xs visible-sm"/> George Mason University <a href="http://dining.gmu.edu/">Dining Services</a>&nbsp;&nbsp;&nbsp; &nbsp;</p>
</div>
</div>
templates/layout/head.html 0 → 100644
View file @ 833b6d48
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta name="description=" content="What's Open is a dynamic web application that lets you easily find out which on-campus locations are currently available. It's a simple alternative to searching for Mason's campus hours and filtering though them to figure out which ones are open.">
<link rel="icon" href="/favicon.ico">
<link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet">
<link href="{{ STATIC_URL }}css/style.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script>
<script src="{{ STATIC_URL }}js/bootstrap.min.js"></script>
<script src="{{ STATIC_URL }}js/grid.js"></script>
<script src="{{ STATIC_URL }}js/typeAhead.js"></script>
<script src="{{ STATIC_URL }}js/info.js"></script>
<script src="{{ STATIC_URL }}js/about.js"></script>
<title>
{% block title %}
What's Open - George Mason University
{% endblock %}
</title>
</head>
templates/layout/navbar.html 0 → 100644
View file @ 833b6d48
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class"navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">what's open</a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<div class="navbar-form navbar-right" role="search">
<div class="form-group">
<input id="searchBar" type="text" class="form-control" placeholder="Search">
</div>
</div>
<ul class="nav navbar-nav navbar-right">
<li>
<a id="about-link">
<span id="about-link-text">About</span><img id="about-close-nav" src="{{ STATIC_URL }}img/close.png">
</a>
</li>
<li class="dropdown" style="display:none;">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Select Campus <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Fairfax</a></li>
<li><a href="#">Arlington</a></li>
<li><a href="#">Prince William</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<!-- why is the about information all spread out? -->
<div id="about-body">
<div class="container" id="about-container">
{% include 'about.html' %}
</div>
</div>
<!-- what is this? -->
<div id="info-body">
<div class="container" id="info-container">
<div class="row" id="info-row">
<a id="info-close"><img src="{{ STATIC_URL }}img/close.png"></a>
<div class="col-md-12" id="info-name"></div>
<div class="col-md-3" id="info-status"></div>
<div class="col-md-3" id="info-next"></div>
<div class="col-md-3" id="info-location"></div>
<div id="info-schedule"></div>
</div>
</div>
</div>
templates/location_grid.html
View file @ 833b6d48
{% extends 'base.html' %} {% extends 'layout/base.html' %}
<!-- Grid with restaurants sorted by location --> <!-- Grid with restaurants sorted by location -->
<!-- New revisions pending major revisions (whoo JavaScript!) by Tyler --> <!-- New revisions pending major revisions (whoo JavaScript!) by Tyler -->
......
templates/restaurant_grid.html
View file @ 833b6d48
{% extends 'base.html' %} {% extends 'layout/base.html' %}
{% block campus %} {% block campus %}
......
website/static/css/style.css
View file @ 833b6d48
/*Bootstrap*/ /*Bootstrap*/
.navbar-default { .navbar-default {
background-color: rgba(252,252,255,0.96); background-color: rgba(252,252,255,0.96);
margin-bottom: 0; margin-bottom: 0;
} }
.navbar-toggle { .navbar-toggle {
background-color: white; background-color: white;
} }
.navbar-brand { .navbar-brand {
padding: 13px 18px; padding: 13px 18px;
font-size: 26px; font-size: 26px;
} }
.navbar-default .navbar-nav > .active > a { .navbar-default .navbar-nav > .active > a {
background: rgba(255,255,255,0.50); background: rgba(255,255,255,0.50);
} }
.navbar-default .navbar-nav > .active > a:hover { .navbar-default .navbar-nav > .active > a:hover {
background: rgba(255,255,255,0.50); background: rgba(255,255,255,0.50);
color: #000; color: #000;
} }
/*Styles*/ /*Styles*/
body, html { body, html {
height: 100%; height: 100%;
} }
a{ a{
color: #006633; color: #006633;
} }
a:hover{ a:hover{
color: Green; color: Green;
} }
a:visited{ a:visited{
color: #003C00; color: #003C00;
} }
.holder{ .holder{
min-height: 100%; min-height: 100%;
position: relative; position: relative;
} }
body { body {
background: url(/static/img/southside.jpg) center top no-repeat fixed; background: url(/static/img/southside.jpg) center top no-repeat fixed;
background-size: cover; background-size: cover;
padding-top: 50px; padding-top: 50px;
} }
.title{ .title{
text-align: center; text-align: center;
font-size: 50px; font-size: 50px;
font-weight: 900; font-weight: 900;
margin-top:30px; margin-top:30px;
line-height: 50px; line-height: 50px;
} }
#grid{ #grid{
display: none; display: none;
} }
#grid div[class*='span']{ #grid div[class*='span']{
margin-top:10px; margin-top:10px;
margin-bottom:10px; margin-bottom:10px;
line-height:1; line-height:1;
} }
.grid-box{ .grid-box{
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
cursor: pointer; cursor: pointer;
} }
.grid-box .restaurant{ .grid-box .restaurant{
text-align:center; text-align:center;
background-color: white; background-color: white;
padding: 10px 2px; padding: 10px 2px;
margin-top: 5px; margin-top: 5px;
margin-bottom: 5px; margin-bottom: 5px;
height: 50px; height: 50px;
font-size: 21px; font-size: 21px;
overflow-y: hidden; overflow-y: hidden;
} }
.opened{ .opened{
color:#141414; color:#141414;
} }
.restaurant.closing{ .restaurant.closing{
color: #FFCC33; color: #FFCC33;
} }
.restaurant.closed{ .restaurant.closed{
color: rgba(81,81,81,0.9); color: rgba(81,81,81,0.9);
background-color: rgba(255,255,255,0.65); background-color: rgba(255,255,255,0.65);
} }
.restaurant .building{ .restaurant .building{
font-size: 15px; font-size: 15px;
padding-left: 2px; padding-left: 2px;
} }
.search-row{ .search-row{
text-align: center; text-align: center;
padding-top: 15px; padding-top: 15px;
} }
ul.ui-autocomplete { ul.ui-autocomplete {
list-style: none; list-style: none;
visibility: hidden; visibility: hidden;
} }
.campusDropdown{ .campusDropdown{
font-size: 20px; font-size: 20px;
margin-top: 10px; margin-top: 10px;
} }
.gmu-brand { .gmu-brand {
padding: 0px 5px 0px 12px; padding: 0px 5px 0px 12px;
margin: none; margin: none;
display: block; display: block;
text-align: center; text-align: center;
} }
.gmu-logo { .gmu-logo {
width: 150px; width: 150px;
height: auto; height: auto;
} }
.main-container{ .main-container{
padding-bottom: 200px; padding-bottom: 200px;
margin-top: 20px; margin-top: 20px;
} }
#footer{ #footer{
background-color: rgba(252,252,255,0.96); background-color: rgba(252,252,255,0.96);
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
height: 165px; height: 165px;
text-align: center; text-align: center;
font-size: 15px; font-size: 15px;
} }
.footer-row { .footer-row {
margin: 0; margin: 0;
background-color: rgba(252,252,255,0.96);; background-color: rgba(252,252,255,0.96);;
} }
.footer-text{ .footer-text{
width:100%; width:100%;
text-align:center; text-align:center;
margin-top: 12px; margin-top: 12px;
} }
#footer-line { #footer-line {
display: none; display: none;
} }
#info-body { #info-body {
width: 100%; width: 100%;
background-color: #FFF; background-color: #FFF;
padding-top: 10px; padding-top: 10px;
padding-bottom: 10px; padding-bottom: 10px;
position: fixed; position: fixed;
top: 51px; top: 51px;
bottom: 0; bottom: 0;
z-index: 1030; z-index: 1030;
display: none; display: none;
overflow-y: scroll; overflow-y: scroll;
} }
#info-name { #info-name {
font-size: 22px; font-size: 22px;
margin-bottom: 5px; margin-bottom: 5px;
} }
#info-close, #about-close { #info-close, #about-close {
position: absolute; position: absolute;
right: 0; right: 0;
padding: 6px 19px 19px 19px; padding: 6px 19px 19px 19px;
cursor: pointer; cursor: pointer;
z-index: 10; z-index: 10;
opacity: 0.4; opacity: 0.4;
} }
#about-close-nav { #about-close-nav {
opacity: 0.5; opacity: 0.5;
padding: 2px 15px 0px 15px; padding: 2px 15px 0px 15px;
display: none; display: none;
} }
#info-close:hover, #about-close:hover, #about-close-nav:hover { #info-close:hover, #about-close:hover, #about-close-nav:hover {
opacity: 1; opacity: 1;
} }
#about-body{ #about-body{
position: fixed; position: fixed;
z-index: 1040; z-index: 1040;
top: 51px; top: 51px;
width: 100%; width: 100%;
bottom: 0; bottom: 0;
overflow: scroll; overflow: scroll;
display: none; display: none;
} }
#about-container { #about-container {
width: 100%; width: 100%;
overflow-y: auto; overflow-y: auto;
} }
.about-content { .about-content {
background-color: #FFF; background-color: #FFF;
padding-bottom: 20px; padding-bottom: 20px;
} }
#about-example{ #about-example{
background-color: rgba(255,255,255,0.4); background-color: rgba(255,255,255,0.4);
} }
.about-top-p{ .about-top-p{
margin-top: 20px; margin-top: 20px;
} }
#about-link{ #about-link{
cursor: pointer; cursor: pointer;
} }
.grid-blur{ .grid-blur{
opacity: 0.54; opacity: 0.54;
-webkit-filter: blur(3px); -webkit-filter: blur(3px);
-moz-filter: blur(3px); -moz-filter: blur(3px);
-o-filter: blur(3px); -o-filter: blur(3px);
-ms-filter: blur(3px); -ms-filter: blur(3px);
filter: blur(3px); filter: blur(3px);
} }
.main-container{ .main-container{
/* Transitions for .grid-blur */ /* Transitions for .grid-blur */
-webkit-transition: opacity 356ms ease-in-out, -webkit-filter 356ms ease-in-out; -webkit-transition: opacity 356ms ease-in-out, -webkit-filter 356ms ease-in-out;
-moz-transition: opacity 356ms ease-in-out, -moz-filter 356ms ease-in-out;; -moz-transition: opacity 356ms ease-in-out, -moz-filter 356ms ease-in-out;;
-o-transition: opacity 356ms ease-in-out, -o-filter 356ms ease-in-out;; -o-transition: opacity 356ms ease-in-out, -o-filter 356ms ease-in-out;;
-ms-transition: opacity 356ms ease-in-out, -ms-filter 356ms ease-in-out;