docs: update opengraph image for main landing pages

Set the default image and explicitly set it for main pages. Lint pre-rendered html for _index.html Signed-off-by: Justin Garrison <[email protected]>
siderolabs · Jul 2, 2024 · 93df234 · 93df234
1 parent d9d62d4
commit 93df234
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 30 deletions.
diff --git a/website/config.toml b/website/config.toml
@@ -95,7 +95,7 @@ copyright = "Sidero Labs, Inc."
 # privacy_policy = "https://policies.google.com/privacy"
 
 # First one is picked as the Twitter card image if not set on page.
-# images = ["images/project-illustration.png"]
+images = ["/images/talos-dev-banner.png"]
 
 # Menu title if your navbar has a versions selector to access old versions of your site.
 # This menu appears only if you have at least one [params.versions] set.

diff --git a/website/content/_index.html b/website/content/_index.html
@@ -1,30 +1,33 @@
 +++
 title = "Talos Linux"
+images = ["images/talos-dev-banner.png"]
 +++
 
-<meta name="twitter:card" content="summary_large_image">
-<meta name="twitter:site" content="@SideroLabs">
-<meta name="twitter:title" content="Talos Linux">
-<meta name="twitter:description" content="Talos Linux is Linux designed for Kubernetes – secure, immutable, and minimal.">
-<meta name="twitter:image" content="https://www.talos.dev/images/logo.svg">
+<meta name="twitter:card" content="summary_large_image" />
+<meta name="twitter:site" content="@SideroLabs" />
+<meta name="twitter:title" content="Talos Linux" />
+<meta name="twitter:description"
+  content="Talos Linux is Linux designed for Kubernetes – secure, immutable, and minimal." />
+<meta name="twitter:image" content="https://www.talos.dev/images/talos-dev-banner.png" />
 
-{{< blocks/cover title="Talos Linux" image_anchor="top" color="orange" >}}
+{{< blocks/cover title="Talos Linux" image_anchor="top" color="orange">}}
   <div class="mx-auto">
     <div class="col-12 text-center">
-      <img width="250" class="" src="/images/logo.svg">
+      <img width="250" class="" src="/images/logo.svg" />
     </div>
-    <br/>
+    <br />
     <h3 class="display-4 text-center mb-3">The Kubernetes Operating System</h3>
   </div>
-  {{< /blocks/cover >}}
+  {{< /blocks/cover>}}
 
     <section class="">
       <div class="container">
         <div class="row align-items-center justify-content-center">
           <div class="col-12 col-lg-6">
             <h1 class="display-1 text-center mb-5">What is Talos Linux?</h1>
             <p class="">
-              Talos Linux is Linux designed for Kubernetes – secure, immutable, and minimal.
+              Talos Linux is Linux designed for Kubernetes – secure, immutable, and
+              minimal.
             </p>
             <ul class="">
               <li class="">
@@ -34,16 +37,16 @@ <h1 class="display-1 text-center mb-5">What is Talos Linux?</h1>
                 All system management is done via an API. No SSH, shell or console
               </li>
               <li class="">
-                Production ready: supports some of the largest Kubernetes clusters in the world
-              </li>
-              <li class="">
-                Open source project from the team at Sidero Labs
+                Production ready: supports some of the largest Kubernetes clusters
+                in the world
               </li>
+              <li class="">Open source project from the team at Sidero Labs</li>
             </ul>
             <div class="row align-items-center">
               <div class="col-8">
                 <p class="my-5 h5">
-                  It only takes 3 minutes to launch a Talos cluster on your laptop inside Docker.
+                  It only takes 3 minutes to launch a Talos cluster on your laptop
+                  inside Docker.
                 </p>
               </div>
               <div class="col-4 text-center">
@@ -81,8 +84,8 @@ <h3 class="display-4 text-center mb-3">Predictability</h3>
           <div class="col-12 col-lg-4">
             <h3 class="display-4 text-center mb-3">Evolvability</h3>
             <p class="">
-              Talos simplifies your architecture, increases your agility, and
-              always delivers current stable Kubernetes and Linux versions.
+              Talos simplifies your architecture, increases your agility, and always
+              delivers current stable Kubernetes and Linux versions.
             </p>
           </div>
         </div>
@@ -106,17 +109,13 @@ <h3 class="display-4 text-center mb-3">Minimal</h3>
           </div>
           <div class="col-12 col-lg-4 mb-3">
             <h3 class="display-4 text-center mb-3">Hardened</h3>
-            <p class="text-center">
-              Hardened by design:
-            </p>
+            <p class="text-center">Hardened by design:</p>
             <ul class="pl-4">
               <li>
                 Built with the Kernel Self Protection Project configuration
                 recommendations.
               </li>
-              <li>
-                All access to the API is secured with Mutual TLS.
-              </li>
+              <li>All access to the API is secured with Mutual TLS.</li>
               <li>
                 Settings and configuration described in the CIS guidelines are
                 applied by default.
@@ -127,7 +126,7 @@ <h3 class="display-4 text-center mb-3">Hardened</h3>
             <h3 class="display-4 text-center mb-3">Immutable</h3>
             <p class="text-center">
               Talos improves security further by mounting the root filesystem as
-              read-only and removing host-level access tools such as a shell and SSH.
+              read-only and removing any host-level such as a shell and SSH.
             </p>
           </div>
           <div class="col-12 col-lg-4 mb-3">
@@ -151,15 +150,20 @@ <h3 class="display-4 text-center mb-3">Current</h3>
       <div class="container">
         <div class="row mb-5">
           <div class="col-12 text-center">
-            <img width="142" class="" src="/images/certified-kubernetes-color.png" alt="Certified Kubernetes">
+            <img width="142" class="" src="/images/certified-kubernetes-color.png" alt="Certified Kubernetes" />
           </div>
         </div>
         <div class="row">
           <div class="col-12 text-center">
-            <img width="250" class="" src="/images/cncf-color.png" alt="Certified Kubernetes">
-            <p class="my-3"> We are a <a class="" href="https://cncf.io/"> Cloud Native Computing Foundation </a>
-              member. </p>
+            <img width="250" class="" src="/images/cncf-color.png" alt="Certified Kubernetes" />
+            <p class="my-3">
+              We are a
+              <a class="" href="https://cncf.io/">
+                Cloud Native Computing Foundation
+              </a>
+              member.
+            </p>
           </div>
         </div>
       </div>
-    </section>
+    </section>
diff --git a/website/content/v1.7/_index.md b/website/content/v1.7/_index.md
@@ -2,6 +2,7 @@
 title: Welcome
 no_list: true
 linkTitle: "Documentation"
+images: ["images/talos-dev-banner.png"]
 cascade:
   type: docs
 lastRelease: v1.7.0

diff --git a/website/content/v1.8/_index.md b/website/content/v1.8/_index.md
@@ -2,6 +2,7 @@
 title: Welcome
 no_list: true
 linkTitle: "Documentation"
+images: ["images/talos-dev-banner.png"]
 cascade:
   type: docs
 lastRelease: v1.8.0-alpha.0

diff --git a/website/static/images/talos-dev-banner.png b/website/static/images/talos-dev-banner.png