This repository has been archived by the owner on Dec 10, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
158 lines (143 loc) · 7.63 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Seattle Police Department</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css"
integrity="sha512-rO2SXEKBSICa/AfyhEK5ZqWFCOok1rcgPYfGOqtX35OyiraBg6Xa4NnBJwXgpIRoXeWjcAmcQniMhp22htDc6g=="
crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
crossorigin="anonymous" />
<link rel="stylesheet" href="css/main.css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet">
<style>
</style>
</head>
<body>
<div class="fixed-side-navbar">
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link" href="#home"><span>Home</span></a></li>
<li class="nav-item"><a class="nav-link" href="#data"><span>Data</span></a></li>
<li class="nav-item"><a class="nav-link" href="#survey"><span>Survey</span></a></li>
</ul>
</div>
<div class="header-content" id="home">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<a href="https://www.seattle.gov"><img class="img-fluid" style="height: 70px;" src="img/seattlelogo.png" alt="city of seattle"></a>
</div>
</div>
</div>
<div class="spd-content intro-content d-flex justify-content-center align-items-center" id="home">
<div>
<div class="text-center pb-5">
<div class="home-content">
<template class="datetime">
<div class="text-muted text-uppercase font-weight-600 data-update-datetime my-4">
updated <%= date%>, at <%= time%>
</div>
</template>
<div class="text-capitalize text-black">
<h1 class="page-title">open budget seattle</h1>
</div>
<div class="px-2 px=md-0">
<p class="text-dark">Open Budget Seattle is part of the City of Seattle's commitment to transparency, data
and dialogue.</p>
</div>
<!-- <a class="btn btn-outline-primary rounded-0 text-btn font-weight-bold" href="#survey">Take the Survey</a> -->
<a class="btn btn-outline-primary rounded-0 text-btn font-weight-bold" href="#data">Review Our Data</a>
</div>
</div>
<div class="row mt-5 py-5 border-top border-dark">
<div class="col-md-6 text-center border-right border-dark">
<h2 class="text-black">$6.5 Billion</h2>
<p class="text-capitalize text-dark">Total 2020 City of Seattle Adopted Budget</p>
<span class="badge badge-danger" style="font-size:100%"> <i class="fa fa-caret-up" aria-hidden="true"></i> $600M</span>
</div>
<div class="col-md-6 text-center">
<h2 class="text-black">$409 Million</h2>
<p class="text-capitalize text-dark">Total 2020 SPD Adopted budget</p>
<h3 class="badge badge-danger" style="font-size:100%"><i class="fa fa-caret-up" aria-hidden="true"></i> $10.5M</h3>
</div>
</div>
</div>
</div>
<div class="service-content" id="data">
<div class="container py-5">
<div class="row">
<div class="col-md-12">
<div class="d-flex">
<h1 class="text-white">2020 SPD Budget by <span id="chart-title">Bureau</span></h1>
<div class="ml-auto">
<a href="data.csv" download="data.csv" class="btn btn-light mt-2">Export as CSV</a>
</div>
</div>
<p class="text-light">We invite you to explore our presentation of the budget and functions of the Seattle Police Department. Please <a href="#survey">take our survey</a> once you've looked through this information</p>
<div class="treemap mb-5"></div>
<div class="data-table mt-5">
<script type="text/html" id="datatable">
<table class="table table-dark table-striped table-hover">
<thead>
<tr>
<th>Department</th>
<th>Budget Allocation</th>
</tr>
</thead>
<tbody>
<% _.each(data, function(row){ %>
<tr id='row-<%= row["name"].replace(/[^A-Z0-9]/ig, "_") %>'>
<td><%= row['name']%></td>
<td><%= formatter.format(+row['budget']) %></td>
</tr>
<% }) %>
</tbody>
</table>
</script>
</div>
</div>
</div>
</div>
</div>
<div class="spd-content contact-content" id="survey">
<div class="survey-form-header d-flex flex-row justify-content-center"></div>
<div class="d-flex flex-row justify-content-center">
<iframe width="100%" height= "2300" src= "https://forms.office.com/Pages/ResponsePage.aspx?id=RR7meOtrCUCPmTWdi1T0G2nWDV3OT45PsIrgvGUyNe5UNDgwNDUxMlYyQjI0MFBPMFlMWVpEMkNFRS4u&embed=true" frameborder= "0" marginwidth= "0" marginheight= "0" style= "border: none; max-width:100%;max-height:2300px " allowfullscreen webkitallowfullscreen mozallowfullscreen msallowfullscreen> </iframe>
<!-- <iframe
src="https://docs.google.com/forms/d/e/1FAIpQLSeaJ2tAwYENDxtW97GK3rDyr0MRu9MgLGjCiqqkU9qB4x7AcA/viewform?usp=sf_link"
width="100%" height="5200" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe> -->
</div>
</div>
<footer class="px-4">
<div class="container text-light">
<div class="text-center pt-4">
<a href="https://www.seattle.gov"><img clas="img-fluid" width="80" src="img/footer_logo.png" alt="logo"></a>
</div>
<div class="text-center py-2"><i>Copyright © 1995-2020 City of Seattle</i></div>
<div class="text-center py-2" id="footerLinks">
<span class="px-4 border-light border-right"><a href="https://www.seattle.gov/digital">Our Digital Properties</a></span>
<span class="px-4 border-light border-right"><a href="https://www.seattle.gov/tech/initiatives/privacy/about-the-privacy-program">Privacy Policy</a></span>
<span class="px-4 border-light border-right"><a href="https://www.seattle.gov/civilrights/civil-rights/title-vi-notice-of-nondiscrimination">Notice of Nondiscrimination</a></span>
<span class="px-4"><a href="https://www.seattle.gov/americans-with-disabilities-act">ADA Notice</a></span>
</div>
</div>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.bundle.min.js"
integrity="sha512-Oy5BruJdE3gP9+LMJ11kC5nErkh3p4Y0GawT1Jrcez4RTDxODf3M/KP3pEsgeOYxWejqy2SPnj+QMpgtvhDciQ=="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.16.0/d3.min.js"
integrity="sha512-FHsFVKQ/T1KWJDGSbrUhTJyS1ph3eRrxI228ND0EGaEp6v4a/vGwPWd3Dtd/+9cI7ccofZvl/wulICEurHN1pg=="
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/combine/npm/lodash,npm/g1"></script>
<script src="js/treemap.js"></script>
<script src="js/dt.js"></script>
<script src="js/main.js"></script>
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans:400,700,800,600,300" media=all />
</body>
</html>