-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
465 lines (433 loc) · 21.4 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
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
<!DOCTYPE html>
<!--[if IE 8]>
<html lang="en" class="ie8">
<![endif]-->
<!--[if IE 9]>
<html lang="en" class="ie9">
<![endif]-->
<!--[if !IE]><!-->
<html lang="en">
<!--<![endif]-->
<head>
<title>djanta - web digitalization, Infrasture deployment and mobile app</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="djanta Insights designs and builds epic Android, iOS, Web apps and infrastructure automation, saltstack, docker, puppet, vagrant.">
<link rel="shortcut icon" href="djanta.png">
<!--link href="https://fonts.googleapis.com/css?family=Roboto:400,300,500,300italic,400italic,500italic,700,700italic" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,400italic,700,700italic" rel="stylesheet" type="text/css"-->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="assets/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/plugins/font-awesome/css/font-awesome.css">
<link id="theme-style" rel="stylesheet" href="assets/css/styles.css">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- ******HEADER****** -->
<header id="header" class="header">
<div class="container">
<h1 class="logo">
<a class="scrollto" href="#hero">
<span class="logo-icon-wrapper"><img class="logo-icon" src="assets/images/logo-icon.svg" alt="icon"></span>
<span class="text"><span class="highlight">djanta</span></span></a>
</h1>
<nav class="main-nav navbar-right" role="navigation">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar-collapse" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="nav-item"><a class="scrollto" href="#features">Work</a></li>
<li class="active nav-item"><a class="scrollto" href="#about">Why we’re here</a></li>
<li class="nav-item"><a class="scrollto" href="#testimonials">Who are we?</a></li>
<li class="nav-item"><a class="scrollto" href="#team">Team</a></li>
<li class="nav-item"><a class="scrollto" href="#contact">Let's talk</a></li>
</ul>
</div>
</nav>
</div>
</header>
<div id="hero" class="hero-section">
<div id="hero-carousel" class="hero-carousel carousel carousel-fade slide" data-ride="carousel" data-interval="10000">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item item-1 active">
<div class="item-content container">
<div class="item-content-inner">
<h2 class="heading">DJANTA is the perfect front-end <br class="hidden-xs"> app developers</h2>
<p class="intro">We helps companies to build beautiful and user-friendly web apps quickly and easily!</p>
</div>
</div>
</div>
<div class="item item-2">
<div class="item-content container">
<div class="item-content-inner">
<h2 class="heading">Angular Lover?</h2>
<p class="intro">DJANTA also comes with an Angular JS version. It empowers developers to create UI
components with very little code. Feeding data into DJANTA Angular JS generic directives is quick and easy.</p>
</div>
</div>
</div>
<div class="item item-3">
<div class="item-content container">
<div class="item-content-inner">
<h2 class="heading">Ready to build outstanding apps?</h2>
<p class="intro">Hire DJANTA today and it will supercharge your development. It's a must-have for any developers who are serious about building great products!</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="features" class="features-section">
<div class="container text-center">
<h2 class="section-title">High quality, always.</h2>
<p class="intro">
We’ve designed and built some of beautiful and easy-to-use apps over the last three years,
from iPhone and Android mobile apps to Node and AngularJS (1/2) Web apps. We’ve also added an Infrastructure Automation (IA)
to our repertoire…and in every case we start by learning our client infrastructure and obsess over things all the way through shipping and afterward.
</p>
<div class="tabbed-area row">
<!-- Nav tabs -->
<ul class="feature-nav nav nav-pill nav-stacked text-left col-md-4 col-sm-6 col-xs-12 col-md-push-8 col-sm-push-6 col-xs-push-0" role="tablist">
<li role="presentation" class="active">
<a href="#feature-1" aria-controls="feature-1" role="tab" data-toggle="tab">
<i class="fa fa-magic"></i>20+ Use Case-based App Pages</a>
</li>
<li role="presentation"><a href="#feature-2" aria-controls="feature-2" role="tab" data-toggle="tab">
<i class="fa fa-cubes"></i>100+ Components and Widgets</a>
</li>
<li role="presentation"><a href="#feature-3" aria-controls="feature-3" role="tab" data-toggle="tab">
<i class="fa fa-bar-chart"></i>Useful Chart Libraries</a>
</li>
<li role="presentation"><a href="#feature-4" aria-controls="feature-4" role="tab" data-toggle="tab">
<i class="fa fa-star"></i>AngularJS Version Included</a>
</li>
<li role="presentation"><a href="#feature-6" aria-controls="feature-6" role="tab" data-toggle="tab"><i
class="fa fa-tablet"></i>Fully Responsive</a></li>
</ul>
<!-- Tab panes -->
<div class="feature-content tab-content col-md-8 col-sm-6 col-xs-12 col-md-pull-4 col-sm-pull-6 col-xs-pull-0">
<div role="tabpanel" class="tab-pane fade in active" id="feature-1">
<a href="http://wrapbootstrap.com/preview/WB051SCJ1?ref=3wm" target="_blank">
<img class="img-responsive" src="assets/images/feature-1_1.png" alt="screenshot"></a>
</div>
<div role="tabpanel" class="tab-pane fade" id="feature-2">
<a href="http://wrapbootstrap.com/preview/WB051SCJ1?ref=3wm" target="_blank">
<img class="img-responsive" src="assets/images/feature-2_2.png" alt="screenshot"></a>
</div>
<div role="tabpanel" class="tab-pane fade" id="feature-3">
<a href="http://wrapbootstrap.com/preview/WB051SCJ1?ref=3wm" target="_blank">
<img class="img-responsive" src="assets/images/feature-3_3.png" alt="screenshot"></a>
</div>
<div role="tabpanel" class="tab-pane fade" id="feature-4">
<a href="http://wrapbootstrap.com/preview/WB051SCJ1?ref=3wm" target="_blank">
<img class="img-responsive" src="assets/images/feature-4_4.png" alt="screenshot"></a>
</div>
<div role="tabpanel" class="tab-pane fade" id="feature-6">
<a href="http://wrapbootstrap.com/preview/WB051SCJ1?ref=3wm" target="_blank">
<img class="img-responsive" src="assets/images/feature-6.png" alt="screenshot"></a>
</div>
</div>
</div>
</div>
</div>
<div id="about" class="about-section">
<div class="container text-center">
<h2 class="section-title">Passionate about product.</h2>
<p class="intro">
We are product pros with decades of experience shipping user-friendly apps for successful companies.
We started to bring that experience to the agency world. We love the craft of software and we don't follow the
traditional "outsider" agency model. <br /><br />
You bring your existing team (if you have one). Our senior practitioners will jump right in at your speed or level
up your team if they’re more on the junior side. We pride ourselves on fitting in and working closely with your
team to deliver great products. That’s our passion.
</p>
<h2 class="section-title">How we factory the modern app and provide IA tools?</h2>
<p class="intro">
We use modern front-end technologies and is packed with useful components and widgets to speed up your app development.
</p>
<ul class="technologies list-inline">
<li><img src="assets/images/logo-bootstrap.svg" alt="Bootstrap"></li>
<li><img src="assets/images/logo-angular.svg" alt="Angular"></li>
<li><img src="assets/images/logo-html5.svg" alt="HTML5"></li>
<li><img src="assets/images/logo-css3.svg" alt="CSS3"></li>
<li><img src="assets/images/logo-less.svg" alt="Less"></li>
<li><img src="assets/images/logo-jquery.svg" alt="jQuery"></li>
</ul>
<div class="items-wrapper row">
<div class="item col-mg-4 col-sm-4 col-sm-12">
<div class="item-inner">
<div class="figure-holder">
<img class="figure-image" src="assets/images/figure-1.png" alt="image">
</div>
<h3 class="item-title">UX-Centered Design</h3>
<div class="item-desc">Bespoke UX/UI design to enhance your app's user experience. Let AppKit take care of the design so you can develop without design resources.</div>
</div>
</div>
<div class="item col-mg-4 col-sm-4 col-sm-12">
<div class="item-inner">
<div class="figure-holder">
<img class="figure-image" src="assets/images/figure-2.png" alt="image">
</div>
<h3 class="item-title">Supercharge App Development</h3>
<div class="item-desc">AppKit provides developers with a ready-made front-end solution so you can concentrate on making your app’s back-end robust and awesome. It empowers small teams to create big things.</div>
</div>
</div>
<div class="item col-mg-4 col-sm-4 col-sm-12">
<div class="item-inner">
<div class="figure-holder">
<img class="figure-image" src="assets/images/figure-3.png" alt="image">
</div>
<h3 class="item-title">Mobile First</h3>
<div class="item-desc">
Built on the popular Bootstrap framework, so the design is “Mobile First” and fully responsive. For a
startup, building an HTML5 webapp which also works across mobile devices is the most cost-effective way to
get your product off the ground.
</div>
</div>
</div>
</div>
</div>
</div>
<!--div id="testimonials" class="testimonials-section">
<div class="container">
<h2 class="section-title text-center">Many Happy Customers</h2>
<div class="item center-block">
<div class="profile-holder">
<img class="profile-image" src="assets/images/profile-1.png" alt="profile">
</div>
<div class="quote-holder">
<blockquote class="quote">
<p>Testimonial goes here Donec felis odio, sagittis eu cursus ac, porttitor eu purus. In a bibendum dui.
Nullam id est sed felis rutrum tincidunt eu nec nisi morbi euismod semper neque sed lobortis.</p>
<div class="quote-source">
<span class="name">@JohnK,</span>
<span class="meta">San Francisco</span>
</div>
</blockquote>
</div>
</div>
<div class="item item-reversed center-block">
<div class="profile-holder">
<img class="profile-image" src="assets/images/profile-2.png" alt="profile">
</div>
<div class="quote-holder">
<blockquote class="quote">
<p>Testimonial goes here fermentum sed pharetra in, aliquet sodales quam. Ut sed turpis quis orci viverra
aliquet interdum ut ipsum. </p>
<div class="quote-source">
<span class="name">@LisaWhite,</span>
<span class="meta">London</span>
</div>
</blockquote>
</div>
</div>
<div class="item center-block">
<div class="profile-holder">
<img class="profile-image" src="assets/images/profile-3.png" alt="profile">
</div>
<div class="quote-holder">
<blockquote class="quote">
<p>Testimonial goes here vestibulum non hendrerit lorem, luctus tincidunt erat. Sed pharetra aliquam posuere.
Pellentesque sollicitudin.</p>
<div class="quote-source">
<span class="name">@MattH,</span>
<span class="meta">Berlin</span>
</div>
</blockquote>
</div>
</div>
<div class="item item-reversed center-block">
<div class="profile-holder">
<img class="profile-image" src="assets/images/profile-4.png" alt="profile">
</div>
<div class="quote-holder">
<blockquote class="quote">
<p>Testimonial goes here lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget
dolor. Aenean massa. Cum sociis natoque penatibus et magnis</p>
<div class="quote-source">
<span class="name">@RyanW,</span>
<span class="meta">Paris</span>
</div>
</blockquote>
</div>
</div>
</div>
</div-->
<div id="testimonials" class="testimonials-section">
<div class="container">
<h2 class="section-title text-center">Our Philosophy</h2>
<div class="item center-block">
<h2 class="section-title text-left">STRONG OPINIONS, LOOSELY HELD</h2>
<div class="quote-holder">
<blockquote class="quote">
<p>
We have experiences and skills (and opinions!) about building products. We’ll give you our opinion on how to
build, but we know enough to be flexible in every situation.
</p>
</blockquote>
</div>
</div>
<div class="item item-reversed center-block">
<h2 class="section-title text-right">TECHNOLOGY IS AN ENABLER</h2>
<div class="quote-holder">
<blockquote class="quote">
<p>
Technology enables great experiences. We like and use technology but we have tried hard to not fall in love with it.
We don’t prescribe a single technology and use that on all projects because that it ultimately limiting.
Instead, we assess each situation and its constraints to determine which technology is most appropriate for the job.
</p>
</blockquote>
</div>
</div>
<div class="item center-block">
<h2 class="section-title text-left">CUSTOMERS DETERMINE HAPPINESS</h2>
<div class="quote-holder">
<blockquote class="quote">
<p>
We’re not happy until our client *and their customers* are happy. While we strive to make all of our
clients happy (100% of our clients are referrals) we keep pushing until we know that the end users are happy as well.
</p>
</blockquote>
</div>
</div>
<div class="item item-reversed center-block">
<h2 class="section-title text-right">DEPENDABLE, HONEST, & TRUSTWORTHY</h2>
<div class="quote-holder">
<blockquote class="quote">
<p>
These are the qualities we admire in others and hold as ideals for ourselves.
When we were hiring agencies in our previous careers we wanted these qualities and so we strive every day to deliver them.
</p>
</blockquote>
</div>
</div>
<div class="item center-block">
<h2 class="section-title text-left">THERE IS NO B TEAM</h2>
<div class="quote-holder">
<blockquote class="quote">
<p>
Every member of the DJANTA team is passionate about building products and has vast experience doing so.
We couldn’t live with ourselves if we dropped our high bar of quality. When you hire DJANTA you hire the very
best product folks we can find.
</p>
</blockquote>
</div>
</div>
</div>
</div>
<!--div class="team-section" id="team">
<div class="container text-center">
<h2 class="section-title">Our Team</h2>
<p class="intro">See who are behind DJANTA success</p>
<div class="story">
<p>
DJANTA is created by Stanislas K.A and Gabriel Sanders. Stanislas and Gab got to know each other since they're kids
and reconected after awhile spending some time over sea. They firmly believe with the right resource,
solopreneurs and small teams can execute beautiful products too. Thus they made AppKit to help developers and
startups make outstanding products - the internet has made it possible for the "small guys" to compete directly
with the "big guys".</p>
</div>
<div class="members-wrapper row">
<div class="item col-md-6 col-sm-6 col-xs-12">
<div class="item-inner">
<div class="profile">
<img class="profile-image" src="assets/images/team-1.png" alt="Xiaoying Riley"/>
</div>
<div class="member-content">
<h3 class="member-name">Stanislas K.A</h3>
<div class="member-title">Lazy Java & Tech Trouver</div>
<ul class="social list-inline">
<li>
<a class="twitter" href="https://twitter.com/3rdwave_themes" target="_blank">
<i class="fa fa-twitter"></i>
</a>
</li>
<li>
<a class="facebook" href="https://www.facebook.com/3rdwavethemes/" target="_blank">
<i class="fa fa-facebook"></i>
</a>
</li>
<li>
<a class="github" href="https://github.com/xriley" target="_blank">
<i class="fa fa-github"></i>
</a>
</li>
<li>
<a class="dribbble" href="https://dribbble.com/Xiaoying" target="_blank">
<i class="fa fa-dribbble"></i></a>
</li>
<li><a class="linkedin" href="https://uk.linkedin.com/in/xiaoying" target="_blank"><i
class="fa fa-linkedin"></i></a></li>
</ul>
<div class="member-desc">
<p>
Xiaoying is the UX/UI designer behind AppKit. She loves designing and making Bootstrap themes/templates
for developers and startups. You can find her sharing useful UX and webdev related content on <a
href="https://twitter.com/3rdwave_themes" target="_blank">Twitter</a> and <a
href="https://www.facebook.com/3rdwavethemes/" target="_blank">Facebook</a>. Follow her if you like
what she does!</p>
</div>
</div>
</div>
</div>
<div class="item col-md-6 col-sm-6 col-xs-12">
<div class="item-inner">
<div class="profile">
<img class="profile-image" src="assets/images/team-2.png" alt="Tom Najdek"/>
</div>
<div class="member-content">
<h3 class="member-name">Gabriek Sanders</h3>
<div class="member-title">Full-Stack Developer</div>
<ul class="social list-inline">
<li><a class="twitter" href="http://twitter.com/tnajdek" target="_blank"><i class="fa fa-twitter"></i></a>
</li>
<li><a href="https://www.doppnet.com/" target="_blank"><i class="fa fa-globe"></i></a></li>
<li><a class="github" href="https://github.com/tnajdek" target="_blank"><i class="fa fa-github"></i></a>
</li>
</ul>
<div class="member-desc">
<p>Tom takes care of everything on the programming end making the interface rich and flexible. He is a
full-stack developer specialising in building large, scalable and user-friendly web apps. Follow him on
<a href="https://twitter.com/tnajdek" target="_blank">Twitter</a> for fresh developer tips and check out
his <a href="https://github.com/tnajdek" target="_blank">Github</a> for useful open-source tools.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div-->
<div id="contact" class="contact-section">
<div class="container text-center">
<h2 class="section-title">Contact Us</h2>
<div class="contact-content">
<p>PARTNER WITH US AND WE'LL BUILD SOMETHING GREAT.</p>
</div>
<a class="btn btn-cta btn-primary" href="mailto:office@djanta.net?subject=Hire US">Get in Touch</a>
</div>
</div>
<footer class="footer text-center">
<div class="container">
<!--/* This template is released under the Creative Commons Attribution 3.0 License. Please keep the attribution link below when using for your own project. Thank you for your support. :) If you'd like to use the template without the attribution, you can check out other license options via our website: themes.3rdwavemedia.com */-->
<small class="copyright">Made with <i class="fa fa-heart"></i> by <a href="#" arget="_blank">djanta</a> in California</small>
</div><!--//container-->
</footer>
<!-- Javascript -->
<script type="text/javascript" src="assets/plugins/jquery-1.12.3.min.js"></script>
<script type="text/javascript" src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/plugins/jquery-scrollTo/jquery.scrollTo.min.js"></script>
<script type="text/javascript" src="assets/js/main.js"></script>
</body>
</html>