feat: update label on hero section on main page

Signed-off-by: Anna Artemova <annartmva@gmail.com>
cilium · Jul 9, 2024 · 7816c80 · 7816c80
1 parent 8cb39f4
commit 7816c80
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 5 deletions.
diff --git 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
@@ -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