-
Notifications
You must be signed in to change notification settings - Fork 23
/
index.html
221 lines (203 loc) · 11.5 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
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>GoGo - Free Bootstrap template for chat bot landing page</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="src/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.min.css">
<link rel="stylesheet" href="src\font-awesome\css\font-awesome.min.css">
<link href="https://fonts.googleapis.com/css?family=Oxygen:300, 400|Ubuntu:300i,400" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-default navbar-transparent" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/"><img src="img/logo.png"></a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse navbar-right">
<ul class="nav navbar-nav">
<li><a href="#">Features</a></li>
<li><a href="#">FAQ</a></li>
<li><a href="#">Testimonials</a></li>
<li><a href="#" class="btn btn-primary btn-nav">GET STARTED</a></li>
</ul>
</div>
<!-- /.navbar-right -->
</div>
</nav>
<!-- End Of Navigation Bar -->
<div class="jumbotron l-section-full-height header">
<div class="container">
<div class="row">
<div class="col-md-7">
<h1>A bot that make you smile more often</h1>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p><a class="btn btn-primary-border btn-lg" href="#" role="button">GET STARTED</a></p>
</div>
<div class="col-md-4 col-md-offset-1 hidden-sm hidden-xs">
<img src="img/hero.png" alt="" class="img-responsive">
</div>
</div>
</div>
</div>
<div class="l-section features">
<div class="container">
<div class="row">
<div id="feature-carousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#feature-carousel" data-slide-to="0" class="active"></li>
<li data-target="#feature-carousel" data-slide-to="1"></li>
<li data-target="#feature-carousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner text-center" role="listbox">
<div class="item active">
<img src="img/slider.jpg" class="l-img-center">
<div class="carousel-caption-bottom">
<h1 class="text-primary text-margin-bottom-x">Personalize your experience</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit minus repellat odio inventore nulla facilis dolores quasi vitae nisi deleniti, neque, excepturi rerum aperiam cumque animi! Voluptatum suscipit, sint quasi!</p>
</div>
</div>
<div class="item">
<img src="img/slider-2.jpg" class="l-img-center">
<div class="carousel-caption-bottom">
<h1 class="text-primary text-margin-bottom-x">No more app to install</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam nesciunt vitae nobis repudiandae velit praesentium voluptatem recusandae, eius veniam molestias ex magni molestiae asperiores ab quisquam a voluptatum. Enim, libero.</p>
</div>
</div>
<div class="item">
<img src="img/slider-3.jpg" class="l-img-center">
<div class="carousel-caption-bottom">
<h1 class="text-primary text-margin-bottom-x">Health care in pocket</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam nesciunt vitae nobis repudiandae velit praesentium voluptatem recusandae, eius veniam molestias ex magni molestiae asperiores ab quisquam a voluptatum. Enim, libero.</p>
</div>
</div>
</div>
</div>
<!-- End of carousel-->
</div>
</div>
</div>
<!-- End of features -->
<div class="l-section intro gray-bg">
<div class="container">
<div class="row">
<div class="col-md-5">
<blockquote class="gogo-quote">
<h2 class="text-primary">So they said think Before smiling? not anymore.</h2>
</blockquote>
</div>
<div class="col-md-7">
<h1 class="text-primary text-margin-bottom-x">A brief introduction to gogo</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>
</div>
</div>
</div>
</div>
<!-- End of intro -->
<div class="l-section faq blue-bg">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="text-white text-center">Frequently asked question</h1>
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h3 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-controls="collapseOne"><i class="fa fa-caret-right" aria-hidden="true"></i> Does it store my private data?</a>
</h3>
</div>
<div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingTwo">
<h3 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-controls="collapseTwo"><i class="fa fa-caret-right" aria-hidden="true"></i> How many time in a day do I need to smile?</a>
</h3>
</div>
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
<div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingThree">
<h3 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-controls="collapseThree"><i class="fa fa-caret-right" aria-hidden="true"></i> Smiling or laughing, which is more beneficial?</a>
</h3>
</div>
<div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
<div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingFour">
<h3 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-controls="collapseFour"><i class="fa fa-caret-right" aria-hidden="true"></i> Ok but I don’t need bot my wife know everything!</a>
</h3>
</div>
<div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">
<div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
</div>
</div>
</div>
</div>
<!-- End of accordion -->
</div>
</div>
</div>
</div>
<!-- End of FAQ -->
<footer class="l-section gray-bg text-center gray-bg">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="text-primary text-margin-bottom-x">Ready to start now?</h1>
<p>Lorem ipsum dolor sit amet consectetur voluptatem sequi nesciunt neque. Adipisicing elit sed do eiusmod tempor incididunt dolores. Eos qui ratione voluptatem sequi nesciunt neque porro quisquam.</p>
<a href="#" class="btn btn-warning btn-lg t-margin-bt-6x">GET STARTED</a>
<ul class="social-link inline t-margin-bt-1x">
<li><a href="#" class="fb"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#" class="tw"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
<li><a href="#" class="gp"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
<li><a href="#" class="lin"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
<p class="small text-muted">© The Smiling Bot 2016</p>
</div>
</div>
</div>
</footer>
<!-- End of footer -->
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="src/bootstrap/js/bootstrap.min.js"></script>
<script src="js/script.min.js"></script>
</body>
</html>