-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·148 lines (125 loc) · 6.55 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
<!DOCTYPE html>
<html>
<head>
<title>Double Charged: Behind The Numbers</title>
<meta name="viewport" content="width=device-width; initial-scale=1; minimal-ui">
<!-- Facebook Open graph -->
<meta property="og:title" content="Double Charged: Behind The Numbers" />
<meta property="og:site_name" content="Youth Radio"/>
<meta property="og:description" content="In the juvenile justice system, young people charged with a crime can be subject to jail time, probation, and fines and fees. Youth Radio's Innovation Lab invites you to explore these stories to see how court-related debt can add up." />
<meta property="og:url" content="https://youthradio.org/double-charged-app/" />
<meta property="fb:app_id" content="829227193757174"/>
<meta property="og:image" content='images/fb-img.png'/>
<link rel="icon" href="images/whitelogo.png" type="image/png" />
<!-- Boostrap -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Stylesheets -->
<link rel="stylesheet" type="text/css" href="css/fonts.css">
<link rel="stylesheet" type="text/css" href="css/title_page.css">
<!-- Jquery -->
<script src="js/jquery-3.6.0.min.js"></script>
<!-- Js -->
<script type="text/javascript" src="js/title_page.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<!-- Social -->
<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=532380043535258&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
</script>
<!-- Main Container -->
<div class="container-fluid">
<div class="toLoad">
<!-- title -->
<div class="logo">
<img src="images/whitelogo.png">
</div>
<div class="row">
<div id="title" class="col-xs-10 col-sm-12">
<h1>Double Charged: Behind The Numbers</h1>
</div>
</div>
<!-- description -->
<div class="row">
<div class="col-xs-12" id="paragraph">
<p>In the juvenile justice system, young people charged with a crime can be subject to jail time, probation, and fines and fees. Youth Radio's <span class="team" data-toggle="modal" data-target="#bioModal" >Innovation Lab</span> invites you to explore these stories to see how court-related debt can add up. </p>
<div class="row">
<div class="col-xs-12 col-sm-3 social">
<p class="twitter"> <a href="https://twitter.com/share" class="twitter-share-button" data-text="Check out the new Double Charged App from @youthradio's Innovation Lab." data-related="youthradio" data-hashtags="doublecharged" data-url="http://bit.ly/YRdc-app" data-count="none">Tweet</a></p>
<div class="fb-share-button facebook" data-href="http://bit.ly/YRdc-app" data-width="50" data-type="button"></div>
</div>
</div>
</div>
</div>
<!-- Images -->
<div class="row">
<div class="images">
<div class="col-sm-4 text-center">
<a href="jeremy.html"><img src="images/f&f1.jpg"/></a>
<div>
<p class="name">Jeremy</p>
</div>
</div>
<div class="col-sm-4 text-center">
<a href="jason.html"><img src="images/f&f2.jpg"/></a>
<div>
<p class="name">Jason</p>
</div>
</div>
<div class="col-sm-4 text-center">
<a href="gina.html"><img src="images/f&f3.jpg"/></a>
<div>
<p class="name">Gina</p>
</div>
</div>
</div>
</div>
<footer>
<a href="https://youthradio.org/creative-studio/desk/innovation-lab" target="_blank">A project of Youth Radio's Innovation Lab.</a>
</footer>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="bioModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">The Team</h4>
</div>
<div class="modal-body">
<img src="images/christina.JPG" alt="Christina So from Youth Radio" class="img-circle bio_pic">
<p>Christina So is going to be a college freshman this fall. This session in the App Lab, she helped build the Double Charged app. Through Youth Radio and the Innovation Lab, Christina has discovered a new hobby: computer programming.</p>
<hr>
<img src="images/skylar.jpg" alt="Skylar Bryant from Youth Radio" class="img-circle bio_pic">
<p>Skylar Bryant brings his design skills and leadership to the Innovation Lab. This last session, his team developed interactive apps for mobile and web users in collaboration with Youth Radio's Newsroom. </p>
<hr>
<img src="images/alvaro.jpg" alt="Alvaro Magdaleno from Youth Radio" class="img-circle bio_pic">
<p>Alvaro Magdaleno will be attending Laney college in the fall. In this session at Youth Radio he helped create the Fines and Fees web app.</p>
<hr>
<img src="images/lo.jpg" alt="Lo Benichou from Youth Radio" class="img-circle bio_pic">
<p>Lo Benichou is a multimedia journalist and web developer. She is the lead developer at the Innovation Lab. Her purpose: to hack storytelling and journalism, and create beautiful interactive content for the world wide web.</p>
</div>
<div class="modal-header">
<h4 class="modal-title">Photo credits</h4>
</div>
<div class="modal-body">
<p><a href="http://commons.wikimedia.org/wiki/File%3AMembers_of_the_Auxillary_Security_Force%2C_Naval_Station_Ingleside%2C_Texas_train_how_to_properly_use_handcuffs_and_various_restraining_techniques%2C_April_16%2C_2003_030416-N-FH503-163.jpg" target="_blank">Wikimedia Commons/Chris Desmond</a></p>
<p> <a href="https://www.flickr.com/photos/shinealight/2114986957/in/photostream/" target="_blank"> Flickr/Shinealight </a> </p>
<p> <a href="https://www.flickr.com/photos/mikeschmid/236216358/" target="_blank"> Flickr/Mike Schmid </a></p>
<p> <a href="https://www.flickr.com/photos/bengarney/9594983998/" target="_blank"> Flickr/Ben Garney </a> </p>
<p> All other photos are property of Youth Radio.</p>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
</html>