mirror of https://github.com/crossplane/docs.git
Add mobile images
This commit is contained in:
Michael Goff
parent
7ff40de488
commit
a141b663b4
|
|
@ -35,16 +35,15 @@
|
|||
}
|
||||
|
||||
.hero {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
|
||||
div,
|
||||
img {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,6 +15,28 @@
|
|||
/*** Vars ***/
|
||||
@import "vars";
|
||||
|
||||
/* Add *-gt-hidden */
|
||||
@media (min-width: $lg-width) {
|
||||
[class*="lg-gt-hidden"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (min-width: $md-width) {
|
||||
[class*="md-gt-hidden"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (min-width: $sm-width) {
|
||||
[class*="sm-gt-hidden"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (min-width: $xs-width) {
|
||||
[class*="xs-gt-hidden"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: $body-font;
|
||||
src: url("../fonts/Avenir-Roman.woff") format("woff");
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 652 KiB |
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 493 KiB |
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 462 KiB |
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 403 KiB |
143
index.html
143
index.html
|
|
@ -1,12 +1,13 @@
|
|||
---
|
||||
stylesheet: index
|
||||
---
|
||||
|
||||
{% include values.inc %}
|
||||
|
||||
<div id="jumbotron">
|
||||
<div>
|
||||
<div class="grid">
|
||||
<div class="col col-5_md-12 main">
|
||||
<div class="col-5_md-12 main">
|
||||
<div>
|
||||
<h1>The open source multicloud control plane.</h1>
|
||||
<p>
|
||||
|
|
@ -18,8 +19,11 @@ stylesheet: index
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-7 hero md-hidden">
|
||||
<img class="img" src="/images/hero.svg" />
|
||||
<div class="col-7_md-12_md-first hero">
|
||||
<div>
|
||||
<img class="img md-hidden" src="/images/hero.svg" />
|
||||
<img class="img md-gt-hidden" src="/images/hero-mobile.svg" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -50,10 +54,14 @@ stylesheet: index
|
|||
</div>
|
||||
<div class="col-9_md-12 footer">
|
||||
<p>
|
||||
Additional managed services including serverless, analytics, big data, machine
|
||||
learning and others are coming soon.
|
||||
Additional managed services including serverless, analytics, big data,
|
||||
machine learning and others are coming soon.
|
||||
</p>
|
||||
<p>
|
||||
<a href="{{githubLink}}"
|
||||
>Help support these features and add new ones</a
|
||||
>
|
||||
</p>
|
||||
<p><a href="{{githubLink}}">Help support these features and add new ones</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -107,16 +115,16 @@ stylesheet: index
|
|||
<h3>Advanced workload scheduling.</h3>
|
||||
<p>
|
||||
Crossplane includes an extensible workload scheduler that can factor
|
||||
availability, reliability, cost, and performance while deploying workloads and
|
||||
their resources.
|
||||
availability, reliability, cost, and performance while deploying
|
||||
workloads and their resources.
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-4_md-6_sm-12 feature">
|
||||
<h3>Open source that doesn’t have an agenda.</h3>
|
||||
<p>
|
||||
Crossplane is open source software released under the Apache 2.0
|
||||
license. Crossplane is a community driven effort to define a
|
||||
control plane that can span multiple cloud providers, many regions and
|
||||
license. Crossplane is a community driven effort to define a control
|
||||
plane that can span multiple cloud providers, many regions and
|
||||
offerings.
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -145,7 +153,12 @@ stylesheet: index
|
|||
<div id="use-cases">
|
||||
<div>
|
||||
<div class="grid">
|
||||
<div class="col-6 md-hidden img"><img src="/images/feature-1.svg" /></div>
|
||||
<div class="col-6_md-12 img">
|
||||
<img class="md-hidden" src="/images/feature-1.svg" /><img
|
||||
class="md-gt-hidden"
|
||||
src="/images/feature-1-mobile.svg"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6_md-12">
|
||||
<h2>Utilize multiple cloud providers at a single time.</h2>
|
||||
<p>
|
||||
|
|
@ -155,6 +168,8 @@ stylesheet: index
|
|||
<img src="/images/quad-white-medium.svg" />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="col-6_md-12">
|
||||
<h2>Migrate managed services across multiple clouds.</h2>
|
||||
<p>
|
||||
|
|
@ -165,8 +180,20 @@ stylesheet: index
|
|||
<img src="/images/quad-white-medium.svg" />
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-6 md-hidden img"><img src="/images/feature-2.svg" /></div>
|
||||
<div class="col-6 md-hidden img"><img src="/images/feature-3.svg" /></div>
|
||||
<div class="col-6_md-12_md-first img">
|
||||
<img class="md-hidden" src="/images/feature-2.svg" /><img
|
||||
class="md-gt-hidden"
|
||||
src="/images/feature-2-mobile.svg"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="col-6_md-12 img">
|
||||
<img class="md-hidden" src="/images/feature-3.svg" /><img
|
||||
class="md-gt-hidden"
|
||||
src="/images/feature-3-mobile.svg"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6_md-12">
|
||||
<h2>Automate all of your tasks across multiple clouds.</h2>
|
||||
<p>
|
||||
|
|
@ -185,32 +212,63 @@ stylesheet: index
|
|||
<div>
|
||||
<div class="grid-center">
|
||||
<div class="testimonial col-4_md-6_sm-12">
|
||||
<h3>“Crossplane has an opportunity to change the cloud industry as we know it”</h3>
|
||||
<p>“Our customers are increasingly looking for a way to deploy their code across multiple cloud environments. The choices available today are too complex and vendor driven but with Crossplane the ability to orchestrate clouds becomes simple. We look forward to collaborating with them on this vision and as the first complex app running on Crossplane.”</p>
|
||||
<h3>
|
||||
“Crossplane has an opportunity to change the cloud industry as
|
||||
we know it”
|
||||
</h3>
|
||||
<p>
|
||||
“Our customers are increasingly looking for a way to deploy
|
||||
their code across multiple cloud environments. The choices available
|
||||
today are too complex and vendor driven but with Crossplane the
|
||||
ability to orchestrate clouds becomes simple. We look forward to
|
||||
collaborating with them on this vision and as the first complex app
|
||||
running on Crossplane.”
|
||||
</p>
|
||||
<div class="signature">
|
||||
<div class="name">Sid Sijbrandij</div>
|
||||
<div class="title">CEO and Co-Founder of GitLab</div>
|
||||
<a href="https://gitlab.com"><img src="/images/gitlab.svg" /></a>
|
||||
<a href="https://gitlab.com"><img src="/images/gitlab.svg"/></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="testimonial col-4_md-6_sm-12">
|
||||
<h3>“We share the vision of having truly cloud agnostic, managed services and Crossplane is an important step forward in this direction”</h3>
|
||||
<p>“Crossplane will make it possible for organizations to take deeper ownership of where they want to run their services and how they manage their application data. Kudos to the Upbound team for architecting and delivering this critical, open source and community driven component of the cloud neutral future.”</p>
|
||||
<div class="signature">
|
||||
<div class="name">Spencer Kimball</div>
|
||||
<div class="title">CEO and Founder of Cockroach Labs</div>
|
||||
<a href="https://www.cockroachlabs.com/"><img src="/images/cockroachlabs.svg" /></a>
|
||||
</div>
|
||||
<h3>
|
||||
“We share the vision of having truly cloud agnostic, managed
|
||||
services and Crossplane is an important step forward in this
|
||||
direction”
|
||||
</h3>
|
||||
<p>
|
||||
“Crossplane will make it possible for organizations to take
|
||||
deeper ownership of where they want to run their services and how they
|
||||
manage their application data. Kudos to the Upbound team for
|
||||
architecting and delivering this critical, open source and community
|
||||
driven component of the cloud neutral future.”
|
||||
</p>
|
||||
<div class="signature">
|
||||
<div class="name">Spencer Kimball</div>
|
||||
<div class="title">CEO and Founder of Cockroach Labs</div>
|
||||
<a href="https://www.cockroachlabs.com/"
|
||||
><img src="/images/cockroachlabs.svg"
|
||||
/></a>
|
||||
</div>
|
||||
<div class="testimonial col-4_md-6_sm-12">
|
||||
<h3>“We created Crossplane to empower organizations to use the best of all the clouds.”</h3>
|
||||
<p>“Having a control plane that is able to schedule and orchestrate portable workloads across cloud providers, regions, and on-premises while still using best-of-breed managed services allows organizations to improve availability, geographic presence, as well as optimize for cost.”</p>
|
||||
<div class="signature">
|
||||
<div class="name">Bassam Tabbara</div>
|
||||
<div class="title">CEO and Founder of Upbound</div>
|
||||
<a href="https://upbound.io"><img src="/images/upbound.svg" /></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="testimonial col-4_md-6_sm-12">
|
||||
<h3>
|
||||
“We created Crossplane to empower organizations to use the best
|
||||
of all the clouds.”
|
||||
</h3>
|
||||
<p>
|
||||
“Having a control plane that is able to schedule and orchestrate
|
||||
portable workloads across cloud providers, regions, and on-premises
|
||||
while still using best-of-breed managed services allows organizations
|
||||
to improve availability, geographic presence, as well as optimize for
|
||||
cost.”
|
||||
</p>
|
||||
<div class="signature">
|
||||
<div class="name">Bassam Tabbara</div>
|
||||
<div class="title">CEO and Founder of Upbound</div>
|
||||
<a href="https://upbound.io"><img src="/images/upbound.svg"/></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -220,7 +278,8 @@ stylesheet: index
|
|||
<div class="col-10_sm-12">
|
||||
<h2>Learn more and get involved with the community</h2>
|
||||
<p>
|
||||
Join the conversation and help shape the evolution of crossplane. Here are a few ways to get started.
|
||||
Join the conversation and help shape the evolution of crossplane. Here
|
||||
are a few ways to get started.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -233,7 +292,12 @@ stylesheet: index
|
|||
<p>
|
||||
Join the Crossplane team and community members in our Slack group.
|
||||
</p>
|
||||
<button class="grey" onclick="window.location.href= '{{slackLink}}';">Join Slack</button>
|
||||
<button
|
||||
class="grey"
|
||||
onclick="window.location.href= '{{slackLink}}';"
|
||||
>
|
||||
Join Slack
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -260,14 +324,21 @@ stylesheet: index
|
|||
<img src="/images/forum.svg" />
|
||||
<h3>Forum</h3>
|
||||
<p>Chat about your use case with others on the Crossplane forum.</p>
|
||||
<button class="grey" onclick="window.location.href = '{{forumLink}}';">Visit Forum</button>
|
||||
<button
|
||||
class="grey"
|
||||
onclick="window.location.href = '{{forumLink}}';"
|
||||
>
|
||||
Visit Forum
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="join">
|
||||
You can also join us every other week for our <a href="{{communityMeetingLink}}">community meeting</a> call to discuss Crossplane
|
||||
You can also join us every other week for our
|
||||
<a href="{{communityMeetingLink}}">community meeting</a> call to discuss
|
||||
Crossplane
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue