-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
156 lines (143 loc) · 7.09 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
---
layout: home
title: Home
slug: home
lead: Define and deploy applications with easy. Any application, any stack, and cloud provider. Colaborate with others and manager your cloud resrouces on one platform.
base_url: "./"
---
<main id="content" role="main">
<div class="jumbotron hero" id="home">
<div class="container">
<div class="col-lg-12 text-center">
<h2 class="home-lead">Cloud Applications. Simple. Boom. Done.</h2>
<h3 class="home-sub">Easily develop, deploy and manage applications for any cloud.</h3>
<div class="sign-up-container">
<!-- <button type="button" class="btn btn-danger btn-lg btn-home hidden-xs" href=""><span class="fa fa-github"></span> SIGN UP WITH GITHUB</button>
<span class="divider hidden-xs">Or</span>
<input class="form-control input-lg input-home" placeholder="Enter Email Address"></input> -->
<button class="btn btn-primary btn-lg btn-home" href="#sign-up-modal" data-toggle="modal" data-target="#sign-up-modal">TRY FOR FREE</button>
<h5 class="sub text-center">No credit card required • No commitment</h5>
</div>
</div>
</div>
</div>
<div id="animation-wrapper">
<section id="pick-your-boxes">
<div class="inner">
<div class="copy">
<h2>Pick Your Boxes</h2>
<p>Boxes are fully configured application components made available as a service. Just visit your local service catalog to get started.</p>
</div>
<div class="static-illustration"></div>
<div class="boxes hidey">
<div class="box ruby"></div>
<div class="box mongo"></div>
<div class="box mysql"></div>
<div class="box newrelic"></div>
<div class="box jenkins"></div>
<div class="box node"></div>
<div class="box angular"></div>
<div class="box linux"></div>
<div class="box postgres"></div>
<div class="box rabbitmq"></div>
<div class="box chef"></div>
<div class="box apache"></div>
</div>
</div>
</section>
<section id="stack-your-boxes">
<div class="inner">
<div class="copy">
<h2>Stack Your Boxes</h2>
<p>Stack your boxes to create a multi-tier application architecture. It's that simple.</p>
</div>
<div class="static-illustration"></div>
</div>
</section>
<section id="deploy-applications">
<div class="inner">
<div class="copy">
<h2>Deploy Applications</h2>
<p>Get your applications running in no time on the provider of your choice. Keep your applications cloud agnostic and your options open.</p>
</div>
<div class="static-illustration"></div>
<div class="cloud c1"></div>
<div class="cloud c2"></div>
<div class="cloud c3"></div>
<div class="cloud c4"></div>
<div class="cloud c5"></div>
<div class="cloud c6 front"></div>
<div class="cloud c7 front"></div>
<div class="cloud c8 front"></div>
<div class="cloud c9 front"></div>
<div id="shuttle">
<div class="nose"></div>
</div>
</div>
</section>
</div>
<div class="jumbotron not-convinced-block">
<div class="container text-center">
<h2 class="jumbo-not-convinced">Boom. Application Deployed.</h2>
<h3 class="home-sub hidden-xs">DevOps At Your Fingertips.</h3>
<button type="button" class="btn btn-primary btn-lg btn-convinced" href="#sign-up-modal" data-toggle="modal" data-target="#sign-up-modal">TRY FOR YOURSELF</button>
<div class="not-convinced-more">
<h4 class="sub hidden-xs">Learn More Bellow.</h4>
<span class="glyphicon glyphicon-chevron-down not-convinced-down"></span>
</div>
</div>
</div>
<div class="jumbotron jumbotron-home-special">
<div class="container elasticbox-special padding-4x">
<h2 class="text-center lead-color">What makes ElasticBox special?</h2>
<h3 class="col-md-8 col-md-offset-2 lead text-center">Imagine a single place for all your cloud application development needs. Build better applications faster with ElasticBox.</h3>
<div class="row">
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6 col-xs-6">
</div>
<div class="col-lg-5 col-md-6 col-sm-6 col-xs-6">
</div>
</div>
<div class="row padding-4x">
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6">
<h3 class="lead-color">Use The Tools You Trust.</h3>
<p class="lead">Manage all your app configurations, dependencies and variables using the tools and scripts you trust. Use ElasticBox to maintain your CM scripts (Chef, Docker, Puppet) or standard scripting language scripts (bash, PowerShell).</p>
<a class="more" href="">Learn More</a>
</div>
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6">
<img class="img-responsive" id="img-dev-workflow" src="https://dl.dropboxusercontent.com/u/11221717/eb-special-dev-workflow.png"></img>
</div>
</div>
<div class="row padding-4x">
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6">
<img class="img-responsive" id="img-any-cloud" src="https://dl.dropboxusercontent.com/u/11221717/any-cloud-special.png"></img>
</div>
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6">
<h3 class="lead-color">Pick A Cloud. Any Cloud.</h3>
<p class="lead">Get the best from your cloud, optimize and scale your application. Run your applications on AWS, vSphere, Google Compute or any public, private and hybrid cloud that fits the bill. Set up load balancers, auto-scaling, and advanced configuration options to scale as you need.</p>
<a class="more" href="">Learn More</a>
</div>
</div>
<div class="row padding-4x">
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6">
<h3 class="lead-color">Collaborate And Innovate</h3>
<p class="lead">Collaborate with teams or individual developers to get your applications to production faster. Detailed collaboration and permission options mean you can work together, in a secure manner.</p>
<a class="more" href="">Learn More</a>
</div>
<div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6">
<img class="img-responsive" id="img-colab-innovate" src="https://dl.dropboxusercontent.com/u/11221717/eb-special-collaboration.png"></img>
</div>
</div>
</div>
</div>
<div id="container-enterprise">
<div class="container text-center padding-4x split">
<div class="row">
<div class="col-lg-10 col-lg-offset-1 padding-4x">
<h2>For Enterprises</h2>
<p class="lead text-center">ElasticBox is all you need to innovate rapidly as an enterprise. Give your developers the tools they need to develop complex applications and give IT operations the platform they need to deploy and manage applications in any cloud.</p>
<button class="btn btn-lg btn-split btn-primary">LEARN MORE</button>
</div>
</div>
</div>
</div>
</main>