-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
49 lines (49 loc) · 1.85 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Wikipedia Viewer App</title>
<link href='https://fonts.googleapis.com/css?family=Slabo+27px' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- bootstrap css cdn -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- screen.css file -->
<link rel="stylesheet" href="./css/screen.css">
<!-- jquery and bootstrap js files cdn -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<!-- inside body -->
<div class="container-fluid">
<div class="row" id="heading">
<div class="col-md-6 col-md-push-3 col-xs-6 col-xs-push-3">
<h1 class="text-center">The Wikipedia Viewer</h1>
<!-- continued here -->
<div class="text-center" id="random">
<a href="http://en.wikipedia.org/wiki/Special:Random" target="_blank">
<h2>Random articles <i class="fa fa-random fa-lg"></i></h2>
</a>
<h2>OR</h2>
</div>
<!-- form for search input -->
<form class="form" action="javascript:void(0);">
<div class="input-group">
<input type="text" name="query" id="query" class="form-control input-lg" placeholder="Search">
<div class="input-group-addon btn" id="search">
<i class="fa fa-search"></i>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- container div to render the search results from Wikipedia -->
<div class="container">
<div id="res">
</div>
</div>
<br>
<h5 class="text-center">by <a href="http://howtocoder.com" target="_blank">HowToCoder</a></h5>
<script src="./js/script.js"></script>
</body>
</html>