Merge pull request #360 from vania-pooh/master

Added "Why choose Aerokube" section

site/config.toml

@@ -1,7 +1,7 @@
 baseurl = "/"
 languageCode = "en-us"
 languageLang = "en"
-title = "Aerokube | Efficient Selenium Testing Infrastructure"
+title = "Aerokube | Efficient Browser Automation Infrastructure"
 
 enableRobotsTXT = true
 
@@ -11,4 +11,4 @@ enableRobotsTXT = true
 disableKinds = ["RSS", "taxonomy", "taxonomyTerm"]
 
 [params]
-description = "We deliver lightning fast and efficient Selenium testing infrastructure: Selenoid for Docker, Moon for Kubernetes and Browsers - online Selenium platform"
+description = "We deliver lightning fast and efficient browser automation infrastructure: Selenoid for Docker, Moon for Kubernetes and Moon Cloud - online browser automation platform. Our solutions support Selenium, Playwright, Cypress and Puppeteer out of the box."

site/data/meta.json

@@ -18,7 +18,7 @@
     },
     {
       "name": "Youtube",
-      "url": "https://www.youtube.com/channel/UC9HvE3FNfTvftzpvXi9c69g"
+      "url": "https://www.youtube.com/@aerokube"
     },
     {
       "name": "Mail us",
@@ -65,7 +65,7 @@
       "title": "Selenium: Securing Your Moon Cluster in Kubernetes and Openshift",
       "description": "This article describes how to enabled security features in Moon.",
       "url": "https://blog.aerokube.com/selenium-securing-your-moon-cluster-in-kubernetes-and-openshift-92bde882a240"
-    },      
+    },
     {
       "title": "Selenium: Moon Environment Provisioning",
       "description": "This article gives more light about new Moon context feature.",

site/layouts/index.html

@@ -1,5 +1,5 @@
 {{ define "main" }}
 {{ partial "hero" . }}
-{{ partial "videos" . }}
+{{ partial "why" . }}
 {{ partial "articles" . }}
 {{ end }}

site/layouts/partials/hero.html

@@ -1,8 +1,8 @@
 <div class="container hero">
     <div class="row justify-content-center text-center">
         <div class="col-12">
-            <h1 class="hero__heading-title">Simple and extremely efficient solutions<br />for your Selenium test infrastructure</h1>
-            <p class="hero__heading-description">Short way to efficient Selenium testing</p>
+            <h1 class="hero__heading-title">Simple and extremely efficient solutions<br />for your browser automation infrastructure</h1>
+            <p class="hero__heading-description">Short way to efficient browser automation</p>
         </div>
         <div class="col-12 d-none d-sm-none d-md-none d-lg-block">
             <img src="img/pipes.svg" alt="pipes">

site/layouts/partials/why.html

@@ -0,0 +1,21 @@
+<div class="why">
+    <div class="why__title-wrapper">
+        <div class="container">
+            <div class="row">
+                <div class="col-12 text-center">
+                    <h2 class="why__title">Why choose Aerokube</h2>
+                </div>
+            </div>
+            <div class="row">
+                <ul class="col-10 offset-1 why__steps">
+                    <li class="why__step"><strong>Experienced team.</strong> We have more than 10 years of experience with large scale browser automation infrastructure. Clusters that we manage have more than 5000 browsers running in parallel.</li>
+                    <li class="why__step"><strong>Reliable products.</strong> Creating solutions that work under any load is our top priority.</li>
+                    <li class="why__step"><strong>Powerful features.</strong> Our solutions support all popular browser automation frameworks: <a href="https://selenium.dev/" title="Selenium" target="_blank">Selenium</a>, <a href="https://playwright.dev/" title="Playwright" target="_blank">Playwright</a>, <a href="https://pptr.dev/" title="Puppeteer" target="_blank">Puppeteer</a> and <a href="https://cypress.io/" title="Cypress" target="_blank">Cypress</a>.</li>
+                    <li class="why__step"><strong>Easy to deploy and maintain.</strong> We provide ready-to-use manifests and instructions allowing to launch working infrastructure in minutes. Our infrastructure requires little or almost no maintenance.</li>
+                    <li class="why__step"><strong>Cost-efficient.</strong> Our solutions have low memory and CPU consumption. Built-in automated scaling feature dramatically lowers final cost of browser automation infrastructure.</li>
+                    <li class="why__step"><strong>Enterprise level security.</strong> Our solutions support enterprise technologies such as additional <a href="https://en.wikipedia.org/wiki/Transport_Layer_Security" title="TLS" target="_blank">TLS</a> certificates, private container registries, <a href="https://openid.net/connect/" title="OpenID Connect" target="_blank">OpenID Connect</a>, fine-grained authentication and authorization out of the box.</li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>

src/css/imports/style.scss

@@ -9,6 +9,10 @@ a, a:hover {
     color: inherit;
 }
 
+a[href] {
+    border-bottom: 1px dashed;
+}
+
 h1 {
     font-size: 2.111rem;
     line-height: 138%;
@@ -51,6 +55,9 @@ nav li {
     height: 80px;
 
     &__logo {
+
+        border-bottom-style: none !important;
+
         &-image {
             width: 40px;
             height: 40px;
@@ -141,6 +148,7 @@ nav li {
     }
 
     &__feature {
+        border-bottom-style: none !important;
         display: inline-block;
         height: 190px;
         padding: 42px 30px;
@@ -212,27 +220,50 @@ nav li {
     }
 }
 
-.videos {
+.why {
     margin-top: 103px;
 
     &__title-wrapper {
-        padding-top: 68px;
+        padding-top: 46px;
         padding-bottom: 46px;
         background-color: #F5F5F5;
     }
 
-    &__half-container {
+    &__title {
+        margin-bottom: 24px;
+    }
+
+    &__steps {
+        counter-reset: section;
+        list-style-type: none;
+        padding: 0 0 0 64px;
+    }
+
+    &__step {
+        background-color: white;
+        border: 2px solid rgba(23, 84, 237, 0.2);
+        border-radius: 4px;
         position: relative;
+        padding: 16px;
+        color: rgba(10, 34, 94, 1);
+        font-size: 18px;
+        margin-bottom: 16px;
 
         &::before {
-            content: '';
             position: absolute;
-            width: 100%;
-            height: 100px;
-            left: 0;
+            left: -64px;
             top: 0;
-            background-color: #F5F5F5;
-            z-index: 1;
+            vertical-align: middle;
+            font-family: 'Ubuntu Mono', monospace;
+            font-size: 46px;
+            font-weight: 700;
+            color: rgba(158, 165, 183, 1);
+            counter-increment: section;
+            content: counter(section);
+        }
+
+        a[href] {
+            border-bottom: 1px dashed;
         }
     }