templates/investor_results.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SWEatshop.tech</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400" rel="stylesheet">
<link rel="stylesheet" href="/static/css/styles.processed.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.min.js" integrity="sha384-Plbmg8JY28KFelvJVai01l8WyZzrYWG825m+cZ0eDDS1f7d/js6ikvy1+X+guPIB" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.js"></script>
<link rel="shortcut icon" href="/static/img/favicon.ico">
</head>
<body class="gradient-bg">
<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse-opacity">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="/index.html"><img alt="Brand" src="/static/img/sweatshop-logo.png" style="width: 200px;"></a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="/index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/about.html">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/companies.html">Companies</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/people.html">People</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/investors.html">Investors</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/schools.html">Schools</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/visualization.html">Visualization</a>
</li>
<li><a href="#search"><img src="http://www.freeiconspng.com/uploads/search-icon-png-4.png" style="height: 35px;"></a></li>
</ul>
</div>
</nav>
<div style="min-height:89vh">
<h1 class="cover-heading">Search Results</h1>
<div class="container" style="color: white;">
<div class="tab">
<a href="/search/person/{{keyword}}"><button class="tablinks">People</button></a>
<a href="/search/company/{{keyword}}"><button class="tablinks">Companies</button></a>
<button class="tablinks active">Investors</button>
<a href="/search/school/{{keyword}}"><button class="tablinks">Schools</button></a>
<div style="float: right;" id="multi-filters">
<a href="?"><button class="tablinks" data-filter="AND">AND</button></a>
<a href="?multi=OR"><button class="tablinks" data-filter="OR">OR</button></a>
</div>
</div>
<div id="Investors" class="tabcontent" style="display: block">
<div class="pag-container">{{ pagination.links }}</div>
{% for org in results %}
<div class="card" style="background-color: #333; border-color: #333; color: #eee;">
<a href="http://sweatshop.tech/investor/{{org.idnum}}" style="color: #eee;">
<div class="card-block">
<div class="row">
<div class="col-4 results-image">
<img src="{{org.image_url}}" alt="Company Logo" /></div>
<div class="col-8" style="text-align: left;">
<br/>
<h3>{{highlight_keys(org.name, keyword) | safe}}</h3><br/>
<b>Location: </b>{{highlight_keys(org.location, keyword) | safe}}<br/>
<b>Country: </b>{{highlight_keys(org.country, keyword) | safe}}<br/>
<b>Website: </b><a href="{{org.website}}" target="_blank">{{highlight_keys(org.website, keyword) | safe}}</a><br/>
<b>Description: </b>{{highlight_keys_desc(org.description, keyword) | safe}}<br/>
</div>
</div>
</div>
</a>
</div>
{% endfor %}
<div class="pag-container">{{ pagination.links }}</div>
<button-text>{{ pagination.info }}</button-text>
</div>
</div>
<script>
function getParameterByName(name) {
var url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
var multiVal = getParameterByName('multi');
if(!multiVal)
multiVal = 'AND'
var multis = $('#multi-filters').children('a');
for (var i in multis) {
var but = $(multis[i]).children('button')[0];
if (but.attributes['data-filter'].value == multiVal)
$(but).addClass('active');
}
</script>
</div>
<div class="outro">
© SWEatshop 2017
</div>
</body>
<div id="search">
<button type="button" class="close">×</button>
<form action="/search" method="get">
<input type="search" name="query" value="" placeholder="type keyword(s) here" />
<button type="submit" class="btn btn-primary">Search</button>
</form>
</div>
<script>
$(function () {
$('a[href="#search"]').on('click', function(event) {
event.preventDefault();
$('#search').addClass('open');
$('#search > form > input[type="search"]').focus();
});
$('#search, #search button.close').on('click keyup', function(event) {
if (event.target == this || event.target.className == 'close' || event.keyCode == 27) {
$(this).removeClass('open');
}
});
});
</script>
</html>