mirror of https://github.com/crossplane/docs.git
Update messaging and content
Signed-off-by: Connor Chan <connorjosephchan@gmail.com>
This commit is contained in:
Connor Chan
parent
bb0a27fff6
commit
b28b4e6d04
|
|
@ -1,6 +1,6 @@
|
|||
# Crossplane Site
|
||||
|
||||
This is the the source for http://crossplane.io. It is rendered using [Jekyll](https://jekyllrb.com/) by [GitHub Pages](https://pages.github.com/). Docs from the main crossplane repo are published hear automatically during the main repo CI publish.
|
||||
This is the the source for http://crossplane.io. It is rendered using [Jekyll](https://jekyllrb.com/) by [GitHub Pages](https://pages.github.com/). Docs from the main crossplane repo are published here automatically during the main repo CI publish.
|
||||
|
||||
## To develop locally
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@
|
|||
<ul class="links">
|
||||
<li>
|
||||
<a href="{{githubLink}}">
|
||||
<img src="{{ "/images/quad-teal-small.svg" | relative_url }}" />
|
||||
<span class="md-hidden">Get Started on</span> GitHub
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
{% assign upboundLink = "https://upbound.io/" %}
|
||||
{% assign slackLink = "https://slack.crossplane.io/" %}
|
||||
{% assign githubLink = "https://github.com/crossplane/crossplane" %}
|
||||
{% assign twitterLink = "https://twitter.com/crossplane_io" %}
|
||||
|
|
|
|||
|
|
@ -43,9 +43,28 @@
|
|||
}
|
||||
|
||||
button {
|
||||
background-color: #3bbdc4;
|
||||
border-color: #3bbdc4;
|
||||
img {
|
||||
vertical-align: text-bottom;
|
||||
margin-right: 5px
|
||||
}
|
||||
|
||||
@media (max-width: $sm-width) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#getStarted {
|
||||
border-color: #3bbdc4;
|
||||
color: #3bbdc4;
|
||||
margin-right: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
#joinSlack {
|
||||
border-color: #FFF;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.hero {
|
||||
|
|
@ -87,52 +106,42 @@
|
|||
}
|
||||
}
|
||||
|
||||
#providers {
|
||||
#createdBy {
|
||||
background-color: $darkish-background-color;
|
||||
padding-top: 90px;
|
||||
padding-bottom: 30px;
|
||||
|
||||
.providers-row {
|
||||
display: flex;
|
||||
display: -ms-flexbox;
|
||||
justify-content: space-evenly;
|
||||
-ms-flex-pack: justify;
|
||||
-webkit-justify-content: space-evenly;
|
||||
flex-direction: row;
|
||||
-moz-flex-direction: row;
|
||||
-ms-flex-direction: row;
|
||||
-o-flex-direction: row;
|
||||
|
||||
@media (max-width: $md-width) {
|
||||
flex-direction: column;
|
||||
-moz-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
-o-flex-direction: column;
|
||||
}
|
||||
}
|
||||
position: relative;
|
||||
overflow: initial !important;
|
||||
|
||||
h2 {
|
||||
margin-top: 55px;
|
||||
margin-bottom: 30px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 35px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 50px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 14px;
|
||||
color: $dark-blue;
|
||||
text-decoration: none;
|
||||
font-size: 16px;
|
||||
color: $dark-text;
|
||||
|
||||
&:visited {
|
||||
color: $dark-blue;
|
||||
color: $dark-text;
|
||||
}
|
||||
}
|
||||
|
||||
#stacksImg {
|
||||
position: absolute;
|
||||
top: -10%;
|
||||
margin: 0 0 0 -82px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
margin: 15px auto;
|
||||
margin: 25px auto;
|
||||
}
|
||||
|
||||
.provider-wrap {
|
||||
|
|
@ -229,7 +238,7 @@
|
|||
padding-bottom: 65px;
|
||||
|
||||
a {
|
||||
color: #3bbdc4;
|
||||
color: #183d54;
|
||||
}
|
||||
|
||||
.grid {
|
||||
|
|
@ -264,26 +273,11 @@
|
|||
}
|
||||
|
||||
#useCases1 {
|
||||
padding-bottom: 0;
|
||||
padding-bottom: 100px;
|
||||
overflow: initial;
|
||||
|
||||
.abs-img-wrap {
|
||||
position: relative;
|
||||
height: 526px;
|
||||
|
||||
@media (max-width: $md-width) {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
|
||||
@media (max-width: $md-width) {
|
||||
position: static;
|
||||
top: auto;
|
||||
}
|
||||
}
|
||||
.grid > div > img {
|
||||
width: 100%
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -291,7 +285,6 @@
|
|||
padding-bottom: 100px;
|
||||
|
||||
h2 {
|
||||
font-size: 48px;
|
||||
line-height: 55px;
|
||||
margin-bottom: 65px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -264,6 +264,7 @@ body {
|
|||
text-decoration: none;
|
||||
color: $blue;
|
||||
font-size: 14px;
|
||||
font-weight: 900;
|
||||
|
||||
&:visited {
|
||||
color: $blue;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 56 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
|
|
@ -0,0 +1,11 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
|
||||
<g fill="none" fill-rule="evenodd">
|
||||
<g fill="#83E2CB" fill-rule="nonzero">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M0 15L7 15 7 22 0 22zM15 15L22 15 22 22 15 22zM0 0H7V7H0zM15 0L22 0 22 7 15 7z" transform="translate(-633 -2815) translate(633 2565) translate(0 250)"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 456 B |
|
|
@ -0,0 +1,22 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
||||
<g fill="none" fill-rule="evenodd">
|
||||
<g fill="#FFF" fill-rule="nonzero">
|
||||
<g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M4.258 2.129c0 1.145-.935 2.08-2.08 2.08-1.146 0-2.081-.935-2.081-2.08s.935-2.08 2.08-2.08h2.081v2.08zM5.306 2.129c0-1.145.936-2.08 2.081-2.08s2.08.935 2.08 2.08v5.21c0 1.145-.935 2.08-2.08 2.08s-2.08-.935-2.08-2.08v-5.21z" transform="translate(-335 -635) translate(315 625) translate(20 10) translate(0 10.484)"/>
|
||||
</g>
|
||||
<g>
|
||||
<path d="M7.387 4.258c-1.145 0-2.08-.935-2.08-2.08 0-1.146.935-2.081 2.08-2.081s2.08.935 2.08 2.08v2.081h-2.08zM7.387 5.306c1.145 0 2.08.936 2.08 2.081s-.935 2.08-2.08 2.08h-5.21c-1.145 0-2.08-.935-2.08-2.08s.935-2.08 2.08-2.08h5.21z" transform="translate(-335 -635) translate(315 625) translate(20 10)"/>
|
||||
</g>
|
||||
<g>
|
||||
<path d="M5.258 7.387c0-1.145.936-2.08 2.08-2.08 1.146 0 2.081.935 2.081 2.08s-.935 2.08-2.08 2.08h-2.08v-2.08zM4.21 7.387c0 1.145-.936 2.08-2.081 2.08s-2.08-.935-2.08-2.08v-5.21c0-1.145.935-2.08 2.08-2.08s2.08.935 2.08 2.08v5.21z" transform="translate(-335 -635) translate(315 625) translate(20 10) translate(10.484)"/>
|
||||
</g>
|
||||
<g>
|
||||
<path d="M2.129 5.258c1.145 0 2.08.936 2.08 2.08 0 1.146-.935 2.081-2.08 2.081S.049 8.484.049 7.34v-2.08h2.08zM2.129 4.21c-1.145 0-2.08-.936-2.08-2.081S.983.049 2.128.049h5.21c1.145 0 2.08.935 2.08 2.08s-.935 2.08-2.08 2.08h-5.21z" transform="translate(-335 -635) translate(315 625) translate(20 10) translate(10.484 10.484)"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
71
index.html
71
index.html
|
|
@ -14,8 +14,13 @@ stylesheet: index
|
|||
Crossplane is an open source Kubernetes add-on that supercharges your Kubernetes clusters enabling you to provision and manage
|
||||
infrastructure, services, and applications from kubectl.
|
||||
</p>
|
||||
<button onclick="window.location.href='{{ githubLink }}'">
|
||||
Get Started on GitHub
|
||||
<button id="getStarted" onclick="window.location.href='{{ githubLink }}'">
|
||||
<img src="{{ "/images/github-teal.svg" | relative_url }}" />
|
||||
<span>Get Started on GitHub</span>
|
||||
</button>
|
||||
<button id="joinSlack" onclick="window.location.href='{{ slackLink }}'">
|
||||
<img src="{{ "/images/slack-white.svg" | relative_url }}" />
|
||||
<span>Join Slack Channel</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -31,48 +36,37 @@ stylesheet: index
|
|||
<div id="useCases1" class="use-cases">
|
||||
<div>
|
||||
<div class="grid">
|
||||
<div class="col-6_md-12_md-first">
|
||||
<img src="{{ "/images/feature-4.png" | relative_url }}" srcset="{{ "/images/feature-4.png" | relative_url }} 1x, {{ "/images/feature-4@2x.png" | relative_url }} 2x, {{ "/images/feature-4@3x.png" | relative_url }} 3x"
|
||||
alt="Provision and manage cloud infrastructure" />
|
||||
</div>
|
||||
<div class="col-6_md-12">
|
||||
<h2>Provision and manage cloud infrastructure and services using kubectl</h2>
|
||||
<p>
|
||||
Crossplane extends your Kubernetes cluster, providing you with CRDs for any infrastructure or managed service. Define infrastructure configuration that can be versioned, managed,
|
||||
and deployed using your favorite tools and existing processes you've already integrated with your clusters.
|
||||
<img src="{{ "/images/quad-red-medium.svg" | relative_url }}" />
|
||||
<img src="{{ "/images/quad-teal-medium.svg" | relative_url }}" />
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-6_md-12_md-first img abs-img-wrap">
|
||||
<img src="{{ "/images/feature-4.png" | relative_url }}" srcset="{{ "/images/feature-4.png" | relative_url }} 1x, {{ "/images/feature-4@2x.png" | relative_url }} 2x, {{ "/images/feature-4@3x.png" | relative_url }} 3x"
|
||||
alt="Provision and manage cloud infrastructure" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="providers">
|
||||
<div id="createdBy">
|
||||
<div>
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<h2>Our community supports many flavors of infrastructure</h2>
|
||||
<img src="{{ "/images/stacks.png" | relative_url }}" srcset="{{ "/images/stacks.png" | relative_url }} 1x, {{ "/images/stacks@2x.png" | relative_url }} 2x, {{ "/images/stacks@3x.png" | relative_url }} 3x"
|
||||
alt="Stacks" id="stacksImg" />
|
||||
<h2>Created to power a more open cloud</h2>
|
||||
<p>
|
||||
Crossplane supports common infrastructure and enables anyone to easily add their own.
|
||||
We built Crossplane to help organizations build their clouds like the cloud vendors build theirs—with a control plane. Crossplane is a CNCF sandbox project which extends the Kubernetes
|
||||
API to manage and compose infrastructure. Operators can encapsulate policies, permissions, and other guardrails behind a custom API line generated by Crossplane while application developers
|
||||
can self-service from the API without needing to become an infrastructure expert.
|
||||
</p>
|
||||
<div class="providers-row">
|
||||
<div class="provider-wrapper">
|
||||
<img src="{{ "/images/google-cloud.svg" | relative_url }}" alt="google cloud" />
|
||||
</div>
|
||||
<div class="provider-wrapper">
|
||||
<img src="{{ "/images/aws.svg" | relative_url }}" alt="aws" />
|
||||
</div>
|
||||
<div class="provider-wrapper">
|
||||
<img src="{{ "/images/microsoft-azure.svg" | relative_url }}" alt="microsoft azure" />
|
||||
</div>
|
||||
<div class="provider-wrapper">
|
||||
<img src="{{ "/images/redhat.svg" | relative_url }}" alt="redhat" />
|
||||
<img class="img" src="{{ "/images/coming-soon.png" | relative_url }}" srcset="{{ "/images/coming-soon.png" | relative_url }} 1x, {{ "/images/coming-soon@2x.png" | relative_url }} 2x, {{ "/images/coming-soon@3x.png" | relative_url }} 3x" alt="Coming Soon" />
|
||||
</div>
|
||||
<div class="provider-wrapper">
|
||||
<img src="{{ "/images/alibaba-cloud.svg" | relative_url }}" alt="alibaba cloud" />
|
||||
</div>
|
||||
</div>
|
||||
<a href="{{ upboundLink }}">Learn more about how Upbound is helping build a more open cloud</a>
|
||||
<img src="{{ "/images/created-by.png" | relative_url }}" srcset="{{ "/images/created-by.png" | relative_url }} 1x, {{ "/images/created-by@2x.png" | relative_url }} 2x, {{ "/images/created-by@3x.png" | relative_url }} 3x"
|
||||
alt="Created By Upbound" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -80,6 +74,23 @@ stylesheet: index
|
|||
|
||||
<div id="useCases2" class="use-cases">
|
||||
<div>
|
||||
<div class="grid">
|
||||
<div class="col-6_md-12">
|
||||
<h2>There is a flavor of infrastructure for everyone on Crossplane</h2>
|
||||
<p>
|
||||
Crossplane supports infrastructure from all the major cloud providers and our community is constantly working on new Providers.
|
||||
You can always join our Slack channel if you are interested in contributing and our amazing community members would be happy to help you write your own Provider.
|
||||
</p>
|
||||
<p>
|
||||
<a href="{{ slackLink }}">Join the Crossplane Slack Channel</a>
|
||||
</p>
|
||||
<p><img src="{{ "/images/quad-red-medium.svg" | relative_url }}" /></p>
|
||||
</div>
|
||||
<div class="col-6_md-12 img">
|
||||
<img src="{{ "/images/flavors.png" | relative_url }}" srcset="{{ "/images/flavors.png" | relative_url }} 1x, {{ "/images/flavors@2x.png" | relative_url }} 2x, {{ "/images/flavors@3x.png" | relative_url }} 3x"
|
||||
alt="Logos for AWS, Google Cloud, Red Hat, Alibaba Cloud, Microsoft Azure" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="col-6_md-12 img">
|
||||
<img src="{{ "/images/feature-1.png" | relative_url }}" srcset="{{ "/images/feature-1.png" | relative_url }} 1x, {{ "/images/feature-1@2x.png" | relative_url }} 2x, {{ "/images/feature-1@3x.png" | relative_url }} 3x"
|
||||
|
|
@ -90,7 +101,7 @@ stylesheet: index
|
|||
<p>
|
||||
Build your own internal infrastructure abstractions on top of the CRDs Crossplane provides. Your custom APIs can include policy guardrails, hiding
|
||||
infrastructure complexity and making it safe for applications to consume.
|
||||
<img src="{{ "/images/quad-red-medium.svg" | relative_url }}" />
|
||||
<img src="{{ "/images/quad-teal-medium.svg" | relative_url }}" />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -120,7 +131,7 @@ stylesheet: index
|
|||
<p>
|
||||
Whether you're using a single Kubernetes cluster in EKS, AKS, GKE, ACK, PKS or a multi-cluster manager like Rancher or Anthos, Crossplane integrates nicely with all of them. Crossplane installs into any existing cluster exposing CRDs and a standard API across
|
||||
infrastructure and service providers making provisioning and management a breeze.
|
||||
<img src="{{ "/images/quad-red-medium.svg" | relative_url }}" />
|
||||
<img src="{{ "/images/quad-teal-medium.svg" | relative_url }}" />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue