-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
164 lines (139 loc) · 10.4 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
159
160
161
162
163
164
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<head>
<title>Home</title>
<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin="" />
<link rel="stylesheet" href="./css/main.css">
<!-- JavaScript libraries (custom are at the bottom)-->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js" integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" crossorigin=""></script>
</head>
<body>
<nav class="navbar navbar-expand-lg fixed-top navbar-dark bg-dark">
<a class="navbar-brand" href="index.html">Purple Line | Plan Integration Tool</a>
<button class="navbar-toggler" 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>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="map.html">Map</a>
</li>
<li class="nav-item">
<a class="nav-link" href="tutorial.html">Tutorial</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
</div>
</nav>
<div id="content" class="container-fluid text-dark">
<div class="row">
<div class="col-10 offset-1">
<div class="jumbotron my-5">
<h1>Welcome to the Purple Line Corridor.</h1>
<p>
The Purple Line is a light rail project in the Washington, DC metropolitan region. It will extend across the region from Bethesda Metro Station to New Carrollton Metro Station, connecting suburbs of DC, and multiple lines of the metro system. The construction
of this major transit connection will bring investment to the area around it—the Purple Line Corridor. This web-based tool will help the many different organizations, agencies, and businesses investing in the Corridor by providing
access to the system of plans that affect the area. Learn more below!
</p>
<a href="map.html" target="blank"><button class="btn btn-dark">View Map</button></a>
</div>
</div>
</div>
<div class="row">
<div class="col-10 offset-1">
<div class="accordion" id="accordionExample">
<div class="card">
<div class="card-header" id="headingOne">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
System of Plans
</button>
</h2>
</div>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body">
The investment occurring along the Purple Line Corridor should be understood as a system of plans: there are many plans—from public agencies, advocacy groups, private businesses, and more—for the Purple Line corridor. The content of these plans, like
new policies, development objectives, tax credits, or advocacy goals, depend on one another. For instance, a developer’s decision to invest in a project might hinge on the tax credits available to them in a certain area,
or whether a powerful local advocacy group plans to support or fight the project. By viewing and exploring these plans as a system, you can strategize your own plans with as much information as possible. </div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Plan Integration Tool
</button>
</h2>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
<div class="card-body">
To facilitate viewing and exploring plans in the Purple Line Corridor as a system of plans, we have created the Plan Integration Tool. The tool is a web-based map connected to a database that contains plans and their content. The tool lets you, the user,
search for plans or plan content based on criteria that fit your needs and display it on the map. The primary audience for this tool is people who themselves are making plans in the Purple Line Corridor: this could be planners
from various state and local agencies, community groups, advocacy groups, developers, business groups, and others. By searching for plans and plan content that are relevant to the decisions at hand and viewing the results
on a map, the tool helps provide the information needed to make these decisions. </div>
</div>
</div>
<div class="card">
<div class="card-header" id="headingThree">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Purple Line Corridor Coalition
</button>
</h2>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
<div class="card-body">
The Plan Integration Tool is a project from the Purple Line Corridor Coalition (PLCC). PLCC, formed in 2013, is a multi-sector collaborative led and administered by the University of Maryland’s National Center for Smart Growth (NCSG) in partnership with
a coalition of community organizations, state and local governments, nonprofits, philanthropies, and businesses. PLCC led the creation of the Community Development Agreement for the Purple Line Corridor which articulates
a collective vision for vibrant economic and community development along the 16-mile corridor. PLCC’s mission is to ensure the Purple Line light rail creates a place of opportunity for all who live, work and invest in the
corridor through a commitment to increasing access via public transportation to housing choices, job and business opportunities, and communities that are vibrant and sustainable. </div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="myModal">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Under Construction</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Like the Purple Line itself, this project is under construction.</p>
<p>
If you have suggestions for how to improve the tool, you can email the developer,
<strong><a href="mailto:[email protected]" target="blank">Cyrus Chimento</a></strong>. The project is also on <strong><a href="https://github.com/cyrchi/geog657-final" target="blank">GitHub</a></strong>; feel free to open
a pull request if you see something that could use improving!
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-dark" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<footer id="footer" class="bg-dark text-light pt-3 pr-3">
<p>© Cyrus Chimento | 2020</p>
</footer>
<script src="./js/home.js"></script>
</body>
</html>