-
Notifications
You must be signed in to change notification settings - Fork 0
/
senate-party-loyalty-starter-page.html
123 lines (118 loc) · 4.91 KB
/
senate-party-loyalty-starter-page.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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta tag ensures proper rendering and touch zooming, since Bootstrap 3 is mobile-first -->
<meta name="viewpoint" content="width=device-width, initial-scal=1, shrink-to-fit=no" charset="utf-8">
<!-- initial zoom level when page loaded -->
<link rel="stylesheet" type="text/css" href="assets/main.css">
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">TGIF</a>
</div>
<ul class="nav navbar-nav">
<li class="active"><a href="home-starter-page.html">Home</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Congress 113</a>
<ul class="dropdown-menu">
<li><a href="senate-starter-page.html">Senate</a></li>
<li><a href="house-starter-page.html">House</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Attendance</a>
<ul class="dropdown-menu">
<li><a href="senate-attendance-starter-page.html">Senate</a></li>
<li><a href="house-attendance-starter-page.html">House</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Party Loyalty</a>
<ul class="dropdown-menu">
<li><a href="senate-party-loyalty-starter-page.html">Senate</a></li>
<li><a href="house-party-loyalty-starter-page.html">House</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<header>
<div>
<h2>Party Loyalty</h2>
</div>
</header>
<!--Table container-->
<div>
<div class="container col-md-6">
<p class="container-fluid">Those who consider themselves to be strong partisans, strong Democrats and strong Republicans respectively, tend to be the most faithful in voting for their party's nominee for office and legislation that backs their party's agenda. </p>
</div>
<div class="table-responsive col-md-6">
<h2>Senate at a glance</h2>
<table class="table container-fluid">
<thead>
<tr>
<th>Party</th>
<th>Number of Reps</th>
<th>% Voted with Prty</th>
</tr>
</thead>
<tbody>
<tr>
<td>Republican</td>
<td class="totalRepublicans"></td>
<td class="totalRepublicansPercentage"></td>
</tr>
<tr>
<td>Democrat</td>
<td class="totalDemocrats"></td>
<td class="totalDemocratsPercentage"></td>
</tr>
<tr>
<td>Independent</td>
<td class="totalIndependents"></td>
<td class="totalIndependentsPercentage"></td>
</tr>
</tbody>
</table>
</div>
<div class="table-responsive col-md-6">
<h2>Least Loyal (Bottom 10% of Party)</h2>
<table class="table container-fluid" id="leastLoyal">
<thead>
<tr>
<th>Name</th>
<th>Number Party Votes</th>
<th>% Party Votes</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="table-responsive col-md-6">
<h2>Most Loyal (Top 10% of Party)</h2>
<table class="table container-fluid" id="mostLoyal">
<thead>
<tr>
<th>Name</th>
<th>Number Party Votes</th>
<th>% Party Votes</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<script type="text/javascript" src="assets/NYT-congress-113-senate.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/main.js"></script>
</body>
</html>