From 7816c80924a1c274fece3274ccea2995e8ea1e6d Mon Sep 17 00:00:00 2001
From: Anna Artemova <annartmva@gmail.com>
Date: Fri, 5 Jul 2024 20:33:13 +0400
Subject: [PATCH] feat: update label on hero section on main page

Signed-off-by: Anna Artemova <annartmva@gmail.com>
---
 docs/assets/scss/home/hero.scss    | 17 ++++++++++++++---
 docs/content/en/_index.html        | 16 ++++++++++++++--
 docs/static/svgs/logos/cillium.svg | 16 ++++++++++++++++
 3 files changed, 44 insertions(+), 5 deletions(-)
 create mode 100644 docs/static/svgs/logos/cillium.svg

diff --git a/docs/assets/scss/home/hero.scss b/docs/assets/scss/home/hero.scss
index 86f9388a342..0a0eea08888 100644
--- a/docs/assets/scss/home/hero.scss
+++ b/docs/assets/scss/home/hero.scss
@@ -33,18 +33,29 @@
 
   &__label {
     display: inline-flex;
+    flex-wrap: wrap;
     align-items: center;
     margin-top: 54px;
     padding: 5px 10px;
     font-size: 14px;
     line-height: 1.375;
-    color: #58595E;
+    color: #58595e;
     background: #fff;
     box-shadow: 0 3px 6px rgba(0, 102, 102, 0.12);
     border-radius: 6px;
 
+    & > span {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+
+      &:not(:last-child) {
+      padding-right: 4px;
+      }
+    }
+
     img {
-      margin: 0 6px 0 -4px;
+      margin: 0 3px;
     }
 
     @media (max-width: $desktop) {
@@ -58,12 +69,12 @@
     }
 
     @media (max-width: $mobile) {
+      justify-content: center;
       margin-top: 18px;
       padding: 5px;
 
       img {
         max-width: 20px;
-        margin: 0 2px 0 -2px;
       }
     }
   }
diff --git a/docs/content/en/_index.html b/docs/content/en/_index.html
index 0637a4c7cf4..34928854464 100644
--- a/docs/content/en/_index.html
+++ b/docs/content/en/_index.html
@@ -9,9 +9,21 @@
         <div class="container">
             <div class="hero__intro">
                 <span class="hero__label">
-                    <img src="/svgs/logos/cncf-logo.svg" width="26" height="26" loading="eager" alt="" />
                     <span>
-                        We are a proud <b>CNCF project</b>
+                        <span>
+                        Tetragon is a <b>sub-project under</b>
+                    </span>
+                    <img src="/svgs/logos/cillium.svg" width="20" height="20" loading="eager" alt="" />
+                    <span>
+                            <b>Cillium</b>
+                    </span>
+                    </span>
+                    <span>
+                        <span>and a proud</span>
+                    <img src="/svgs/logos/cncf-logo.svg" width="20" height="20" loading="eager" alt="" />
+                    <span>
+                        <b>CNCF project</b>
+                        </span>
                     </span>
                 </span>
                 <h1 class="title title--xl">
diff --git a/docs/static/svgs/logos/cillium.svg b/docs/static/svgs/logos/cillium.svg
new file mode 100644
index 00000000000..0115fc81562
--- /dev/null
+++ b/docs/static/svgs/logos/cillium.svg
@@ -0,0 +1,16 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.448 7.44531H8.52582L7.05859 10.0297L8.51891 12.5875H11.4472L12.9075 10.0297L11.4476 7.44531M11.0579 11.8862H8.90781L7.83717 10.0228L8.90896 8.13973H11.0595L12.1309 10.0228L11.0587 11.8866" fill="#141A1F"/>
+<path d="M7.83691 10.0264L8.90832 11.8833H11.0588L12.1371 10.0264L11.0588 8.11719H8.90832L7.83691 10.0264Z" fill="#E83030"/>
+<path d="M11.448 12.9336H8.52582L7.05859 15.511L8.51891 18.0689H11.4472L12.9075 15.511L11.4476 12.9336M11.0575 17.3941H8.90781L7.83717 15.5306L8.90896 13.6476H11.0595L12.1309 15.5306L11.0587 17.3945" fill="#141A1F"/>
+<path d="M7.83691 15.508L8.90832 17.3911H11.0588L12.1371 15.508L11.0588 13.625H8.90832L7.83691 15.508Z" fill="#6B91C7"/>
+<path d="M11.448 1.92969H8.52582L7.05859 4.51406L8.52582 7.07191H11.4541L12.9144 4.51406L11.448 1.92969ZM11.0579 6.37057H8.90781L7.83717 4.50714L8.90896 2.60489H11.0595L12.1309 4.48792L11.0587 6.37057" fill="#141A1F"/>
+<path d="M7.83691 4.51425L8.90832 6.37154H11.0588L12.1371 4.51425L11.0588 2.60547H8.90832L7.83691 4.51425Z" fill="#F9C31F"/>
+<path d="M16.2028 10.207H13.3041L11.8438 12.7914L13.3041 15.3493H16.2324L17.6927 12.7914L16.2028 10.207ZM15.8127 14.6591H13.663L12.5912 12.7952L13.663 10.9122H15.8131L16.8849 12.7952L15.8127 14.6591Z" fill="#141A1F"/>
+<path d="M12.585 12.7994L13.6721 14.6632H15.8165L16.914 12.7994L15.8165 10.8906H13.6721L12.585 12.7994Z" fill="#795AA5"/>
+<path d="M16.2028 4.69531H13.3041L11.8438 7.25316L13.3041 9.81102H16.2324L17.6927 7.25316L16.2028 4.69531ZM15.8127 9.14273H13.663L12.5912 7.27891L13.663 5.39588H15.8131L16.8849 7.27891L15.8127 9.14273Z" fill="#141A1F"/>
+<path d="M12.585 7.27872L13.6548 9.16713H15.8165L16.914 7.3037L15.8165 5.39453H13.6548L12.585 7.27872Z" fill="#F17423"/>
+<path d="M6.67028 10.207H3.76695L2.30664 12.7914L3.76695 15.3493H6.69526L8.15558 12.7914L6.67028 10.207ZM6.28023 14.6548H4.15586L3.08445 12.791L4.15586 10.908H6.30636L7.37815 12.791L6.28023 14.6548Z" fill="#141A1F"/>
+<path d="M3.08398 12.792L4.15578 14.6554H6.28015L7.37769 12.7916L6.28015 10.8828H4.15578L3.08398 12.792Z" fill="#97C639"/>
+<path d="M6.67028 4.69531H3.76695L2.30664 7.25316L3.76695 9.81102H6.69526L8.15558 7.25316L6.67028 4.69531ZM6.28023 9.14312H4.15586L3.08445 7.2793L4.15586 5.39626H6.30636L7.37815 7.2793L6.28023 9.14312Z" fill="#141A1F"/>
+<path d="M3.08398 7.27988L4.15578 9.1437H6.28015L7.37769 7.27988L6.28015 5.37109H4.15578L3.08398 7.27988Z" fill="#C9DB70"/>
+</svg>