Make the home page into reusable and translatable blocks (#10071)

* Make navigation and UI strings i18n friendly

This commit

* Extracts most UI strings into i18n bundles so they can be translated
* Makes a proper Hugo menu out of the hardcoded menu that is shown on smaller screens
* Changes the language selector logic to navigate to the current page in the other language if possible (e.g. the translation). If not possible, it takes you to the home page for that language.

For testing, this commit also adds Norwegian as a new language. This is turned off.

* Make the home page into reusable and translatable blocks

This commit adds a set of block type shortcodes that is then used to build the home page.

* These shortcodes gets common image resources from a new headless bundle. These resources can be inherited or overridden by translations.
* The hardcoded case studies section on the home page is replaced with a query and a loop.
* The hardcoded feature list on the home page is replaed qith a query and a loop.
This commit is contained in:
Bjørn Erik Pedersen
2018-09-14 23:47:24 +02:00
committed by k8s-ci-robot
parent 0df6621652
commit 1b5ff98a44
49 changed files with 501 additions and 2181 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

+3
View File
@@ -0,0 +1,3 @@
---
headless: true
---
+40 -161
View File
@@ -6,178 +6,57 @@ cid: home
{{< deprecationwarning >}}
<!-- OCEAN NODES -->
<section id="oceanNodes">
<main>
<div class="image-wrapper"><img src="images/flower.png"></div>
<div class="content">
<h3><a href="/docs/concepts/overview/what-is-kubernetes/">Kubernetes</a> is an open-source system for automating deployment, scaling, and management of containerized applications.</h3>
<p>It groups containers that make up an application into logical units for easy management and discovery. Kubernetes builds
upon <a href="http://queue.acm.org/detail.cfm?id=2898444">15 years of experience of running production workloads at Google</a>,
combined with best-of-breed ideas and practices from the community.</p>
</div>
</main>
<main>
<div class="image-wrapper"><img src="images/scalable.png"></div>
<div class="content">
<h4>Planet Scale</h4>
<p>Designed on the same principles that allows Google to run billions of containers a week, Kubernetes can scale without increasing your ops team.</p>
</div>
</main>
<main>
<div class="image-wrapper"><img src="images/blocks.png"></div>
<div class="content">
<h4>Never Outgrow</h4>
<p>Whether testing locally or running a global enterprise, Kubernetes flexibility grows with you to deliver your applications consistently and easily no matter how complex your need is.</p>
</div>
</main>
<main>
<div class="image-wrapper"><img src="images/suitcase.png"></div>
<div class="content">
<h4>Run Anywhere</h4>
<p>Kubernetes is open source giving you the freedom to take advantage of on-premises, hybrid, or public cloud infrastructure, letting you effortlessly move workloads to where it matters to you.</p>
</div>
</main>
</section>
{{< blocks/section id="oceanNodes" >}}
{{% blocks/feature image="flower" %}}
### [Kubernetes]({{< relref "/docs/concepts/overview/what-is-kubernetes" >}}) is an open-source system for automating deployment, scaling, and management of containerized applications.
<section id="video">
<div class="light-text">
<h2>The Challenges of Migrating 150+ Microservices to Kubernetes</h2>
It groups containers that make up an application into logical units for easy management and discovery. Kubernetes builds upon [15 years of experience of running production workloads at Google](http://queue.acm.org/detail.cfm?id=2898444), combined with best-of-breed ideas and practices from the community.
{{% /blocks/feature %}}
{{% blocks/feature image="scalable" %}}
#### Planet Scale
Designed on the same principles that allows Google to run billions of containers a week, Kubernetes can scale without increasing your ops team.
{{% /blocks/feature %}}
{{% blocks/feature image="blocks" %}}
#### Never Outgrow
Whether testing locally or running a global enterprise, Kubernetes flexibility grows with you to deliver your applications consistently and easily no matter how complex your need is.
{{% /blocks/feature %}}
{{% blocks/feature image="suitcase" %}}
#### Run Anywhere
Kubernetes is open source giving you the freedom to take advantage of on-premises, hybrid, or public cloud infrastructure, letting you effortlessly move workloads to where it matters to you.
{{% /blocks/feature %}}
{{< /blocks/section >}}
{{< blocks/section id="video" background-image="kub_video_banner_homepage" >}}
<div class="light-text">
<h2>The Challenges of Migrating 150+ Microservices to Kubernetes</h2>
<p>By Sarah Wells, Technical Director for Operations and Reliability, Financial Times</p>
<button id="desktopShowVideoButton" onclick="kub.showVideo()">Watch Video</button>
<br>
<br>
<br>
<a href="https://events.linuxfoundation.cn/events/kubecon-cloudnativecon-china-2018/" button id= "desktopKCButton">Attend KubeCon in Shanghai on Nov. 13-15, 2018</a>
<a href="https://www.lfasiallc.com/events/kubecon-cloudnativecon-china-2018/" button id="desktopKCButton">Attend KubeCon in Shanghai on Nov. 13-15, 2018</a>
<br>
<br>
<br>
<br>
<a href="https://events.linuxfoundation.org/events/kubecon-cloudnativecon-north-america-2018/" button id= "desktopKCButton">Attend KubeCon in Seattle on Dec. 11-13, 2018</a>
</div>
<button id="mobileShowVideoButton" onclick="kub.showVideo()"></button>
</section>
<section id="features">
<main>
<h3 class="center">Kubernetes Features</h3>
<div class="feature-box">
<div>
<h4><a href="/docs/concepts/configuration/manage-compute-resources-container/">Automatic binpacking</a></h4>
<p>Automatically places containers based on their resource requirements and other constraints, while not
sacrificing availability. Mix critical and best-effort workloads in order to drive up utilization and save even more resources.</p>
</div>
<div>
<h4><a href="/docs/concepts/workloads/controllers/replicationcontroller/#what-is-a-replicationcontroller">Self-healing</a></h4>
<p>Restarts containers that fail, replaces and reschedules containers when nodes die, kills containers
that don't respond to your user-defined health check, and doesn't advertise them to clients until they are ready to serve.</p>
</div>
</div>
<div class="feature-box">
<div>
<h4><a href="/docs/tasks/run-application/horizontal-pod-autoscale/">Horizontal scaling</a></h4>
<p>Scale your application up and down with a simple command, with a UI, or automatically based on CPU usage.</p>
</div>
<div>
<h4><a href="/docs/concepts/services-networking/service/">Service discovery and load balancing</a></h4>
<p>No need to modify your application to use an unfamiliar service discovery mechanism. Kubernetes gives
containers their own IP addresses and a single DNS name for a set of containers, and can load-balance across them.</p>
</div>
</div>
<div class="feature-box">
<div>
<h4><a href="/docs/concepts/workloads/controllers/deployment/#what-is-a-deployment">Automated rollouts and rollbacks</a></h4>
<p>Kubernetes progressively rolls out changes to your application or its configuration, while monitoring
application health to ensure it doesn't kill all your instances at the same time. If something goes
wrong, Kubernetes will rollback the change for you. Take advantage of a growing ecosystem of deployment solutions.</p>
</div>
<div>
<h4><a href="/docs/concepts/configuration/secret/">Secret</a> and <a href="/docs/tasks/configure-pod-container/configure-pod-configmap/">configuration</a> management</h4>
<p>Deploy and update secrets and application configuration without rebuilding your image and without
exposing secrets in your stack configuration.</p>
</div>
</div>
<div class="feature-box">
<div>
<h4><a href="/docs/concepts/storage/persistent-volumes/">Storage orchestration</a></h4>
<p>Automatically mount the storage system of your choice, whether from local storage, a public cloud provider
such as <a href="https://cloud.google.com/storage/">GCP</a> or <a href="https://aws.amazon.com/products/storage/">AWS</a>, or a network storage system such as NFS, iSCSI,
Gluster, Ceph, Cinder, or Flocker.</p>
</div>
<div>
<h4><a href="/docs/concepts/workloads/controllers/jobs-run-to-completion/">Batch execution</a></h4>
<p>In addition to services, Kubernetes can manage your batch and CI workloads, replacing containers that fail, if desired.</p>
</div>
</div>
</main>
</section>
<section id="talkToUs">
<main>
<h3>Case Studies</h3>
<div id="caseStudiesWrapper">
<div>
<p>Sling TV: Marrying Kubernetes and AI to Enable Proper Web Scale</p>
<a href="/case-studies/slingtv">Read more</a>
</div>
<div>
<p>Using OpenTracing to Help Pinpoint the Bottlenecks</p>
<a href="/case-studies/workiva">Read more</a>
</div>
<div>
<p>Pinning Its Past, Present, and Future on Cloud Native</p>
<a href="/case-studies/pinterest">Read more</a>
</div>
<div>
<p>Reinventing the Worlds Largest Education Company With Kubernetes</p>
<a href="/case-studies/pearson">Read more</a>
</div>
</div>
<!--<div id="bigSocial">-->
<!--&lt;!&ndash;<div>&ndash;&gt;-->
<!--&lt;!&ndash;<a href="https://youtu.be/OLwzSHBtxhI">Watch the video</a>&ndash;&gt;-->
<!--&lt;!&ndash;<p>Creating Next Generation Kubernetes Infrastructure at Viacom</p>&ndash;&gt;-->
<!--&lt;!&ndash;</div>&ndash;&gt;-->
<!--<div>-->
<!--<p>Using Kubernetes to reinvent the world's largest educational company</p>-->
<!--<a href="/case-studies/pearson/">Read more</a>-->
<!--</div>-->
<!--<div>-->
<!--<p>Kubernetes at Box: Microservices at Maximum Velocity</p>-->
<!--<a href="https://blog.box.com/blog/kubernetes-box-microservices-maximum-velocity/">Read more</a>-->
<!--</div>-->
<!--<div>-->
<!--<p>Inside eBay's shift to Kubernetes and containers atop OpenStack</p>-->
<!--<a href="http://www.nextplatform.com/2015/11/12/inside-ebays-shift-to-kubernetes-and-containers-atop-openstack/">Read the story</a>-->
<!--</div>-->
<!--<div>-->
<!--<p>Migrating from a homegrown 'cluster' to Kubernetes</p>-->
<!--<a href="https://www.youtube.com/watch?v=6XGUTu3WhBw">Watch the video</a>-->
<!--</div>-->
<!--</div>-->
<h5 style="text-align: center"><a href="/case-studies/" style="color: #3371E3; font-weight: 400">View all case studies</a></h5>
</main>
</section>
<section id="cncf">
<main>
<center>
<p style="font-size: 20px">We are a <a href="https://cncf.io/">CNCF</a> graduated project</p>
</center>
</main>
</section>
<a href="https://events.linuxfoundation.org/events/kubecon-cloudnativecon-north-america-2018/" button id="desktopKCButton">Attend KubeCon in Seattle on Dec. 11-13, 2018</a>
</div>
<div id="videoPlayer">
<iframe data-url="https://www.youtube.com/embed/H06qrNmGqyE?autoplay=1" frameborder="0" allowfullscreen></iframe>
<button id="closeButton"></button>
</div>
{{< /blocks/section >}}
{{< blocks/kubernetes-features >}}
{{< blocks/case-studies >}}
+8 -1
View File
@@ -1,3 +1,10 @@
---
title: Blog
title: Kubernetes Blog
linkTitle: Blog
menu:
main:
title: "Blog"
weight: 40
post: >
<p>Read the latest news for Kubernetes and the containers space in general, and get technical how-tos hot off the presses.</p>
---
+1
View File
@@ -1,5 +1,6 @@
---
title: Case Studies
linkTitle: Case Studies
bigheader: Kubernetes User Case Studies
abstract: A collection of users running Kubernetes in production.
layout: basic
+6
View File
@@ -1,6 +1,12 @@
---
title: "Community"
weight: 80
menu:
main:
title: "Community"
weight: 30
post: >
<p>If you need help, you can connect with other Kubernetes users and the Kubernetes authors, attend community events, and watch video presentations from around the web.</p>
---
This section of the Kubernetes documentation surfaces key topics imported from the [kubernetes/community](https://github.com/kubernetes/community) repo. It is the starting point for becoming a contributor -- improving docs, improving code, giving talks etc.
@@ -2,6 +2,10 @@
title: Managing Compute Resources for Containers
content_template: templates/concept
weight: 20
feature:
title: Automatic binpacking
description: >
Automatically places containers based on their resource requirements and other constraints, while not sacrificing availability. Mix critical and best-effort workloads in order to drive up utilization and save even more resources.
---
{{% capture overview %}}
@@ -3,6 +3,10 @@ reviewers:
- mikedanese
title: Secrets
content_template: templates/concept
feature:
title: Secret and configuration management
description: >
Deploy and update secrets and application configuration without rebuilding your image and without exposing secrets in your stack configuration.
weight: 50
---
@@ -2,6 +2,11 @@
reviewers:
- bprashanth
title: Services
feature:
title: Service discovery and load balancing
description: >
No need to modify your application to use an unfamiliar service discovery mechanism. Kubernetes gives containers their own IP addresses and a single DNS name for a set of containers, and can load-balance across them.
content_template: templates/concept
weight: 10
---
@@ -5,6 +5,11 @@ reviewers:
- thockin
- msau42
title: Persistent Volumes
feature:
title: Storage orchestration
description: >
Automatically mount the storage system of your choice, whether from local storage, a public cloud provider such as <a href="https://cloud.google.com/storage/">GCP</a> or <a href="https://aws.amazon.com/products/storage/">AWS</a>, or a network storage system such as NFS, iSCSI, Gluster, Ceph, Cinder, or Flocker.
content_template: templates/concept
weight: 20
---
@@ -3,6 +3,11 @@ reviewers:
- bgrant0607
- janetkuo
title: Deployments
feature:
title: Automated rollouts and rollbacks
description: >
Kubernetes progressively rolls out changes to your application or its configuration, while monitoring application health to ensure it doesn't kill all your instances at the same time. If something goes wrong, Kubernetes will rollback the change for you. Take advantage of a growing ecosystem of deployment solutions.
content_template: templates/concept
weight: 30
---
@@ -4,6 +4,10 @@ reviewers:
- soltysh
title: Jobs - Run to Completion
content_template: templates/concept
feature:
title: Batch execution
description: >
In addition to services, Kubernetes can manage your batch and CI workloads, replacing containers that fail, if desired.
weight: 70
---
@@ -3,6 +3,12 @@ reviewers:
- bprashanth
- janetkuo
title: ReplicationController
feature:
title: Self-healing
anchor: How a ReplicationController Works
description: >
Restarts containers that fail, replaces and reschedules containers when nodes die, kills containers that don't respond to your user-defined health check, and doesn't advertise them to clients until they are ready to serve.
content_template: templates/concept
weight: 20
---
+7 -1
View File
@@ -8,7 +8,13 @@ cid: userJourneys
css: /css/style_user_journeys.css
js: /js/user-journeys/home.js, https://use.fontawesome.com/4bcc658a89.js
display_browse_numbers: true
linkTitle: "Home"
linkTitle: Documentation
main_menu: true
weight: 10
menu:
main:
title: "Documentation"
weight: 20
post: >
<p>Learn how to use Kubernetes with the use of walkthroughs, samples, and reference documentation. You can even <a href="/editdocs/" data-auto-burger-exclude>help contribute to the docs</a>!</p>
---
@@ -4,6 +4,11 @@ reviewers:
- jszczepkowski
- directxman12
title: Horizontal Pod Autoscaler
feature:
title: Horizontal scaling
description: >
Scale your application up and down with a simple command, with a UI, or automatically based on CPU usage.
content_template: templates/concept
weight: 90
---
@@ -2,6 +2,12 @@
title: Hello Minikube
content_template: templates/tutorial
weight: 5
menu:
main:
title: "Get Started"
weight: 10
post: >
<p>Ready to get your hands dirty? Build a simple Kubernetes cluster that runs "Hello World" for Node.js.</p>
---
{{% capture overview %}}
@@ -10,8 +10,6 @@ weight: 10
<body>
<link href="./public/css/styles.css" rel="stylesheet">
<div class="layout" id="top">
<main class="content">
+3
View File
@@ -0,0 +1,3 @@
---
headless: true
---
+63
View File
@@ -0,0 +1,63 @@
---
title: "Produksjonsklar kontainer-orkestrering"
abstract: "Automatisert kontainer-deployment og -administrasjon"
cid: home
---
{{< deprecationwarning >}}
{{< blocks/section id="oceanNodes" >}}
{{% blocks/feature image="flower" %}}
### Kubernetes
Litt tekst om Kubernetes.
{{% /blocks/feature %}}
{{% blocks/feature image="scalable" %}}
#### Skalberbar
Litt tekst om skalerberhet.
{{% /blocks/feature %}}
{{% blocks/feature image="blocks" %}}
#### Vokser med deg
Litt tekst.
{{% /blocks/feature %}}
{{% blocks/feature image="suitcase" %}}
#### Kjør overalt
Litt tekst.
{{% /blocks/feature %}}
{{< /blocks/section >}}
{{< blocks/section id="video" background-image="kub_video_banner_homepage" >}}
<div class="light-text">
<h2>Om å flytte 150+ microservicer til Kubernetes</h2>
<p>Av Sarah Wells, teknisk direktør for Operations and Reliability, Financial Times</p>
<button id="desktopShowVideoButton" onclick="kub.showVideo()">Se video</button>
<br>
<br>
<br>
<a href="https://www.lfasiallc.com/events/kubecon-cloudnativecon-china-2018/" button id="desktopKCButton">KubeCon i Shanghai 13.-15. november, 2018</a>
<br>
<br>
<br>
<br>
<a href="https://events.linuxfoundation.org/events/kubecon-cloudnativecon-north-america-2018/" button id="desktopKCButton">KubeCon i Seattle 11.-13. desember, 2018</a>
</div>
<div id="videoPlayer">
<iframe data-url="https://www.youtube.com/embed/H06qrNmGqyE?autoplay=1" frameborder="0" allowfullscreen></iframe>
<button id="closeButton"></button>
</div>
{{< /blocks/section >}}
{{< blocks/kubernetes-features >}}
{{< blocks/case-studies >}}
+4
View File
@@ -0,0 +1,4 @@
---
title: Eksempler på Kubernetes-bruk
---