refactor: Apply changes from design review

britneywwc · Jan 29, 2025 · 01cc02c · 01cc02c
1 parent 5fb50d4
commit 01cc02c
Showing 1 changed file with 53 additions and 35 deletions.
diff --git a/templates/kubernetes/index.html b/templates/kubernetes/index.html
@@ -51,7 +51,11 @@
       <hr class="p-rule" />
       <div class="col">
         <div class="p-section--shallow">
-          <h2>Why choose Canonical Kubernetes Platform?</h2>
+          <h2>
+            Why choose
+            <br />
+            Canonical Kubernetes Platform?
+          </h2>
         </div>
       </div>
       <div class="col">
@@ -219,7 +223,11 @@ <h4 class="p-heading--5">Kubernetes clusters with Kubeadm</h4>
       <hr class="p-rule" />
       <div class="col">
         <div class="p-section--shallow u-hide--large">
-          <h2>Public cloud Kubernetes powered by Ubuntu</h2>
+          <h2>
+            Public cloud Kubernetes
+            <br />
+            powered by Ubuntu
+          </h2>
         </div>
         <div class="p-image-container u-hide--small u-hide--medium">
           {{ image(url="https://assets.ubuntu.com/v1/5a2779e1-public%20cloud.png",
@@ -234,7 +242,11 @@ <h2>Public cloud Kubernetes powered by Ubuntu</h2>
       </div>
       <div class="col">
         <div class="p-section--shallow u-hide--medium u-hide--small">
-          <h2>Public cloud Kubernetes powered by Ubuntu</h2>
+          <h2>
+            Public cloud Kubernetes
+            <br />
+            powered by Ubuntu
+          </h2>
         </div>
         <p>Cloud-tailored experience, optimized kernels, unlimited options</p>
         <hr class="p-rule--muted u-no-margin--bottom" />
@@ -257,52 +269,52 @@ <h2>Public cloud Kubernetes powered by Ubuntu</h2>
           <div class="p-logo-section__items">
             <div class="p-logo-section__item">
               {{ image(url="https://assets.ubuntu.com/v1/15f4f759-aws-logo.png",
-                        alt="AWS",
-                        width="151",
-                        height="312",
-                        hi_def=True,
-                        loading="lazy",
-                        attrs={"class": "p-logo-section__logo"},) | safe
+                            alt="AWS",
+                            width="151",
+                            height="312",
+                            hi_def=True,
+                            loading="lazy",
+                            attrs={"class": "p-logo-section__logo"},) | safe
               }}
             </div>
             <div class="p-logo-section__item">
               {{ image(url="https://assets.ubuntu.com/v1/f1ec4ff5-microsoft-azure-logo [DEPRECATED] .png",
-                        alt="Microsoft Azure",
-                        width="272",
-                        height="312",
-                        hi_def=True,
-                        loading="lazy",
-                        attrs={"class": "p-logo-section__logo"},) | safe
+                            alt="Microsoft Azure",
+                            width="272",
+                            height="312",
+                            hi_def=True,
+                            loading="lazy",
+                            attrs={"class": "p-logo-section__logo"},) | safe
               }}
             </div>
             <div class="p-logo-section__item">
               {{ image(url="https://assets.ubuntu.com/v1/6c959a61-google-cloud-stacked-logo [DEPRECATED] .png",
-                        alt="Google Cloud",
-                        width="189",
-                        height="312",
-                        hi_def=True,
-                        loading="lazy",
-                        attrs={"class": "p-logo-section__logo"},) | safe
+                            alt="Google Cloud",
+                            width="189",
+                            height="312",
+                            hi_def=True,
+                            loading="lazy",
+                            attrs={"class": "p-logo-section__logo"},) | safe
               }}
             </div>
             <div class="p-logo-section__item">
               {{ image(url="https://assets.ubuntu.com/v1/4a30e5f7-ibm-cloud-logo.png",
-                        alt="IBM Cloud",
-                        width="437",
-                        height="312",
-                        hi_def=True,
-                        loading="lazy",
-                        attrs={"class": "p-logo-section__logo"},) | safe
+                            alt="IBM Cloud",
+                            width="437",
+                            height="312",
+                            hi_def=True,
+                            loading="lazy",
+                            attrs={"class": "p-logo-section__logo"},) | safe
               }}
             </div>
             <div class="p-logo-section__item">
               {{ image(url="https://assets.ubuntu.com/v1/dbab531e-oracle-cloud-logo.png",
-                        alt="Oracle Cloud",
-                        width="387",
-                        height="312",
-                        hi_def=True,
-                        loading="lazy",
-                        attrs={"class": "p-logo-section__logo"},) | safe
+                            alt="Oracle Cloud",
+                            width="387",
+                            height="312",
+                            hi_def=True,
+                            loading="lazy",
+                            attrs={"class": "p-logo-section__logo"},) | safe
               }}
             </div>
           </div>
@@ -316,7 +328,11 @@ <h2>Public cloud Kubernetes powered by Ubuntu</h2>
       <hr class="p-rule" />
       <div class="col">
         <div class="p-section--shallow">
-          <h2>Integrated cluster management platforms</h2>
+          <h2>
+            Integrated
+            <br />
+            cluster management platforms
+          </h2>
         </div>
         <div class="u-hide--medium u-hide--small">
           <p>Remove the toil of Kubernetes cluster management</p>
@@ -510,7 +526,9 @@ <h4 class="p-text--small-caps">What's included</h4>
               <div class="col">
                 <div class="p-section--shallow">
                   <h3 class="js-discoverer-text">Kubernetes Discoverer</h3>
-                  <p class="u-text--muted js-discoverer-description">Three-day training and 2-week deployment of reference K8s architecture, including:</p>
+                  <p class="u-text--muted js-discoverer-description">
+                    Three-day training and 2-week deployment of reference K8s architecture, including:
+                  </p>
                 </div>
                 <p>
                   <span class="p-heading--5">Discoverer</span>