-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
133 lines (129 loc) · 7.43 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase.js"></script>
<link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/rawline" type="text/css" />
<title>Enlighten Up</title>
</head>
<body>
<div class="container">
<div class="jumbotron">
<h2 class="text-center">Enlighten up!</h2>
<h4 class="text-center">A current news source that also provides relevant comic relief.</h4>
</div>
</div>
<div class="row">
<div class="col-med-6" id="left">
<div id="tableContainer" class="container">
<div class="panel panel-default-request">
<div class="panel-heading panel-heading-custom-request">
<h3 class="panel-title">Request</h3>
</div>
<div class="panel-body">
<div class="modal fade" id="#myModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Please enter a search term, or hit "Suprise me." </p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<form>
<div class="form-group">
<label for="Name"></label>
<input type="text" class="form-control" id="trainName" placeholder="Search for a Topic">
<br>
<button type="button" id="update" class="btn btn-info">I Know What I Want</button>
<button type="button" id="random" class="btn btn-info">Surprise Me</button>
</div>
</form>
</div>
</div>
</div>
<div id="tableContainer" class="container">
<div class="panel panel-default-reality">
<div class="panel-heading panel-heading-custom-reality">
<h3 class="panel-title">Reality</h3>
</div>
<div class="new"><a class="panel-body" id="newsDrop" target="_blank"></a></div>
</div>
</div>
</div>
<div class="col-med-6" id="right">
<div id="tableContainer-relief" class="container">
<div class="panel-default-relief">
<div class="panel-heading panel-heading-custom-relief">
<h3 class="panel-title">Relief</h3>
</div>
<div class="panel-body-relief">
<div class="container">
<div class="row">
<ul>
<div class="col-lg-4">
<div class="card" style="width: 26rem;">
<div class="card-body">
<p class="card-title"><b>MEMES</b></p>
<div class="card-img-bottom" id="memes-display">
<img class="card-img-bottom" id="memes" src="https://camo.githubusercontent.com/b8b6fb20143f25818214397a4f864f3b74f1602c/68747470733a2f2f6d656d6567656e2e6c696e6b2f62757a7a2f6d656d65732f6d656d65735f657665727977686572652e6a70673f77617465726d61726b3d6e6f6e65"
alt="Card image cap" style="width: 26rem;"></div>
</div>
</div>
</div>
</ul>
<ul>
<div class="col-lg-4">
<div class="card" style="width: 26rem;">
<div class="card-body">
<p class="card-title"><b>DAD JOKES</b></p>
<div class="card-img-bottom" id="dadjoke-display">
<img class="card-img-bottom" id="dadjoke" src="https://uploads-cdn.thgblogs.com/wp-content/uploads/sites/463/2015/08/26035300/01-dunphy.jpg"
alt="Card image cap" style="width: 26rem;"></div>
</div>
</div>
</div>
</ul>
<ul>
<div class="col-lg-4">
<div class="card" style="width: 26rem;">
<div class="card-body">
<p class="card-title"><b>GIFS</b></p>
<div class="card-img-bottom" id="gif-display" style="width: 26rem;"><img class="card-img-bottom" id="gifs" src="https://i.imgur.com/BIT4TTM.gif"
alt="Card image cap" style="width: 26rem;"></div>
</div>
</div>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="imageholder">
<img class="zenImage" src="zenbud.png" alt="Zen Bud">
</div>
<div class="copy" id="names">© Ezdehar Jaber, Will Nolan, Nicole Penmer, Kerrick Woyshner</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="app.js"></script>
</body>
</html>