Merge remote-tracking branch 'origin/2023-website-restyle'

# Conflicts: # _includes/callout/callout-release.html
Noovolari · Sep 4, 2023 · 605136f · 605136f
2 parents fd53229 + 16d3772
commit 605136f
Show file tree

Hide file tree

Showing 19 changed files with 955 additions and 13 deletions.
diff --git a/_data/footer.yml b/_data/footer.yml
@@ -22,12 +22,12 @@ menu:
     subcategories:
       - subtitle: "Getting Started"
         subhref: "https://docs.leapp.cloud/latest/installation/install-leapp/"
-      #- subtitle: "Enterprise"
-      #  subhref: "/solutions/enterprise"
+      - subtitle: "Personal"
+        subhref: "/solutions/personal"
       - subtitle: "For Business"
         subhref: "/solutions/business"
-      #- subtitle: "Pricing"
-      #  subhref: "/pricing"
+      - subtitle: "Pricing"
+        subhref: "/solutions/personal#pricing"
       - subtitle: "Support"
         subhref: "/support"
 

diff --git a/_data/herounit/herounit_personal.yml b/_data/herounit/herounit_personal.yml
@@ -0,0 +1,13 @@
+title: We make Leapp
+subtitle: We are <a href="https://medium.com/leapp-cloud/road-to-noovolari-89df7704e315" target="_blank" rel="noopener">Noovolari</a>
+button: Download now for free!
+link: 'https://github.com/Noovolari/leapp/releases/latest'
+image: leapp-hero
+image_title: Leapp Header
+col_left_title: "CENTRALIZE AND PROTECT YOUR CLOUD ACCESS"
+col_left_subtitle: "<p>Lock your Leapp Client and protect your Cloud access.</p><p>Create a backup and <b>move freely across multiple devices</b></p>"
+article_title: "CENTRALIZE AND PROTECT YOUR CLOUD ACCESS"
+primary_cta: "Get Started"
+primary_cta_url: "/download/desktop-app"
+secondary_cta:
+secondary_cta_url:
diff --git a/_data/menu-header.yml b/_data/menu-header.yml
@@ -27,8 +27,15 @@ menu:
   - title: "Docs"
     href: "https://docs.leapp.cloud"
 
-  - title: "For Business"
-    href: "/solutions/business"
+  - title: "Solutions"
+    subcategories:
+      - subtitle: "For Business"
+        subhref: "/solutions/business"
+      - subtitle: "Personal"
+        subhref: "/solutions/personal"
+
+  - title: "Pricing"
+    href: "/solutions/personal#pricing"
 
 
 cta:

diff --git a/_data/steps/steps_personal.yml b/_data/steps/steps_personal.yml
@@ -0,0 +1,37 @@
+title:
+step:
+  - title: BACKUP YOUR ACCESS CONFIGURATION
+    content: "<p>Login securely on every device with Leapp.</p><p><b>Access to any Cloud account from any workstation, within a single click.</b></p>"
+    video:
+    autoplay: true
+    controls: false
+    muted: true
+    image: "steps/step1-personal.png"
+    avatar_image: "illustrations/30.svg"
+    color: pink
+    step_url: "https://docs.leapp.cloud/latest/leapp-pro/getting-started/sign-in/"
+    anchor: cloud-access
+
+  - title: YOUR LEAPP CONFIGURATION EVERYWHERE
+    content: "<p><b>Use your Cloud Operations on every workstation by logging into Leapp Pro.</b><p>Bring your configuration wherever you need.</p>"
+    video:
+    autoplay: true
+    controls: false
+    muted: true
+    image: "steps/step2-personal.png"
+    avatar_image: "illustrations/32.svg"
+    color: yellow
+    step_url: "https://docs.leapp.cloud/latest/leapp-pro/synchronization/"
+    anchor: cloud-operations
+
+  - title: PASSWORD PROTECTED ENVIRONMENT
+    content: "<p>Protect your environment with a login and encrypt your data with an <b>end-to-end encryption strategy.</b></p>"
+    video:
+    autoplay: true
+    controls: false
+    muted: true
+    image: "steps/step3-personal.png"
+    avatar_image: "illustrations/31.svg"
+    color: green
+    step_url: "https://docs.leapp.cloud/latest/leapp-pro/security-and-password/"
+    anchor: cloud-security
diff --git a/_includes/callout/callout-home.html b/_includes/callout/callout-home.html
@@ -2,10 +2,10 @@
     <img src="{{site.url}}{{site.baseurl}}/assets/img/Leapp_Icon.png" alt="logo" title="logo" />
 </div>
 <div class="c-text">
-    <span><strong>Announcing Leapp Team.</strong><br> Your all-in-one solution to assign IAM Cloud access across teams.</span>
+    <span><strong>Announcing Leapp Pro.</strong><br> Centralize and protect your Cloud Access.</span>
 </div>
 <div class="c-link">
-    <a href="/team" target="_blank" id="rebranding_link">
+    <a href="/solutions/personal" target="_blank" id="rebranding_link" style="font-size: 18px">
         <span class="desktop check-it-out">Take me there!</span>
         <img src="{{site.url}}{{site.baseurl}}/assets/img/arrow-right.png" width="36" alt="">
     </a>

diff --git a/_includes/callout/callout-release.html b/_includes/callout/callout-release.html
@@ -1,9 +1,9 @@
 
 <div class="c-text" style="font-size: 18px">
-    <span><strong>Announcing Leapp Team.</strong><br> Your all-in-one solution to assign IAM Cloud access across teams.</span>
+    <span><strong>Announcing Leapp Pro.</strong><br> Centralize and protect your Cloud Access.</span>
 </div>
 <div class="c-link">
-    <a href="{{site.url}}{{site.baseurl}}/solutions/business" target="_blank" id="rebranding_link" style="font-size: 18px">
+    <a href="{{site.url}}{{site.baseurl}}/solutions/personal" target="_blank" id="rebranding_link" style="font-size: 18px">
         <span class="desktop check-it-out">Take me there!</span>
         <img src="{{site.url}}{{site.baseurl}}/assets/img/arrow-right.png" width="36" alt="">
     </a>

diff --git a/_includes/hero-unit-personal.html b/_includes/hero-unit-personal.html
@@ -0,0 +1,22 @@
+<section id="hero-unit" class="home ovh">
+    <div class="container">
+        <div class="hero-unit-col-container">
+            <div class="col">
+                <div class="title">{{site.data.herounit.[page.hero_data].col_left_title}}</div>
+                <div class="subtitle">{{site.data.herounit.[page.hero_data].col_left_subtitle}}</div>
+
+                <div id="hero-button">
+                    {% if site.data.herounit.[page.hero_data].secondary_cta %}
+                        <a href="{{site.data.herounit.[page.hero_data].secondary_cta_url}}" class="btn btn-outline-primary d-inline-block mt-2" id="hero-join">{{site.data.herounit.[page.hero_data].secondary_cta}}</a>
+                    {% endif %}
+                    <a href="{{site.data.herounit.[page.hero_data].primary_cta_url}}" class="btn btn-secondary d-inline-block mt-2" target="_blank" id="download-from-hero" onclick="leapp?.sendEvent('Download-From-Hero', this)">{{site.data.herounit.[page.hero_data].primary_cta}}</a>
+                </div>
+
+            </div>
+            <div class="col text-center desktop">
+                <img height="584" src="{{site.url}}{{site.baseurl}}/assets/img/hero-claim-pro.png" alt="video tag not supported" title="video tag not supported" />
+            </div>
+        </div>
+        <img class="mobile m-auto mb-2 w-100 h-auto" src="{{site.url}}{{site.baseurl}}/assets/img/hero-claim-pro.png" alt="video tag not supported" title="video tag not supported" />
+    </div>
+</section>
diff --git a/_includes/pricing.html b/_includes/pricing.html
@@ -0,0 +1,152 @@
+
+<div class="center-pricing">
+    <div id="pricing" class="pricing-anchor"></div>
+    <h4>PRICING</h4>
+    <br>
+    <h2>COMPARE OUR PLANS</h2>
+    <br>
+    <p>Integrate Leapp with your current access methodology.</p>
+    <br>
+    <div class="toggle-prices">
+        <label class="switch">
+            <input type="checkbox" checked>
+            <div class="slider" onclick="$('.price-value').toggleClass('hidden');">
+                <span>Monthly</span>
+                <span>Yearly (17% discount)</span>
+            </div>
+        </label>
+
+    </div>
+    <br>
+    <div class="best-discount-ever">EARLY PROMO (33% additional discount)</div>
+</div>
+
+
+<div class="plans-group-container">
+    <div class="plan plan-free">
+        <div class="plan-header">
+            <span>Community</span>
+            <p>Open-source version with local workspace</p>
+        </div>
+        <div class="plan-body">
+            <div class="price-container">
+                <span class="price-value">FREE</span>
+            </div>
+            <div class="cta-button free"><a href="https://github.com/Noovolari/leapp" target="_blank">VIEW REPOSITORY</a></div>
+            <div class="early-access-link">&nbsp;</div>
+            <ul class="plan-features">
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Open-source version with local workspace</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Local workspace with device encryption</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Automatic credentials management</span>
+                </li>
+            </ul>
+        </div>
+    </div>
+
+    <div class="plan plan-pro">
+        <div class="plan-header">
+            <span>Pro</span>
+            <p>Lock your Leapp Client and sync with unlimited devices</p>
+            <small class="lifetime-deal">LIFETIME&nbsp;DEAL</small>
+        </div>
+        <div class="plan-body">
+            <div class="price-container">
+                <span class="price-value pro">
+                  <small class="full-price">89$</small><small class="discounted-price">59$</small>
+                  <small class="micro-small">4.92$ per Month, billed yearly</small>
+                </span>
+                <span class="price-value pro hidden">
+                  <small class="full-price">8.99$</small><small class="discounted-price">5.99$</small>
+                  <small class="micro-small">Billed monthly</small>
+                </span>
+            </div>
+
+            <div class="cta-button pro"><a href="{{ site.url }}{{site.baseurl}}/download/desktop-app" target="_blank">GET THE APP</a></div>
+            <div class="early-access-link">&nbsp;</div>
+
+            <ul class="plan-features">
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span class="all-free-features">Lock your Leapp access with Username and Password</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Create an encrypted backup of your Configuration</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Bring your Leapp configuration on every device</span>
+                </li>
+            </ul>
+        </div>
+    </div>
+
+    <div class="plan plan-team" >
+        <div class="plan-header">
+            <span>Business</span>
+            <p>Collaborate with your team and centralize Cloud Access</p>
+        </div>
+        <div class="plan-body">
+            <div class="price-container">
+                <span class="price-value">Early access</span>
+            </div>
+            <div class="cta-button business"><a href="{{ site.url }}{{site.baseurl}}/solutions/business" target="_blank">GET EARLY ACCESS</a></div>
+            <div class="early-access-link">
+                <a href="" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/noovolari/leapp-demo?hide_landing_page_details=1&hide_gdpr_banner=1'});return false;">Or request a Demo Trial</a>
+            </div>
+            <ul class="plan-features">
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Team collaboration and management</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Leapp session sharing with team members</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Centralized point of access for the Company</span>
+                </li>
+            </ul>
+        </div>
+    </div>
+
+    <div class="plan plan-enterprise">
+        <div class="plan-header">
+            <span>Enterprise</span>
+            <p>Create and govern your Cloud Operations platform</p>
+        </div>
+        <div class="plan-body">
+            <div class="price-container">
+                <span class="price-value">Contact Sales</span>
+            </div>
+            <div class="cta-button enterprise" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/noovolari/leapp-demo?hide_landing_page_details=1&hide_gdpr_banner=1'});return false;">REQUEST A DEMO</div>
+            <div class="early-access-link">
+                <a href="" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/noovolari/leapp-demo?hide_landing_page_details=1&hide_gdpr_banner=1'});return false;">Or request a Demo Trial</a>
+            </div>
+            <ul class="plan-features">
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Standardized Leapp-only cloud Access</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Certified company plugins and auditing</span>
+                </li>
+                <li>
+                    <span class="check-mark-icon"><img src="{{ site.url }}{{site.baseurl}}/assets/img/CheckCircle.svg" alt="" title=""></span>
+                    <span>Report and security auditing and compliance</span>
+                </li>
+            </ul>
+        </div>
+    </div>
+</div>
+</div>
diff --git a/_includes/steps-personal.html b/_includes/steps-personal.html
@@ -0,0 +1,39 @@
+<section id="steps" class="ovh">
+    <div class="container" id="feature">
+        {% if {{site.data.steps.[page.steps_data].title}} != ""  %}
+            <h2 class="section-title ">{{site.data.steps.[page.steps_data].title}}</h2>
+        {% endif %}
+        <div class="steps-holder">
+            {% for step in {{site.data.steps.[page.steps_data].step}} %}
+                {% capture c %}{% cycle 'reverse', '' %}{% endcapture %}
+
+                {% assign indice = forloop.index %}
+                {% assign current = 'active' %}
+
+                <div class=" step mb-3 {{c}} step{{forloop.index}}" >
+                    <div class="anchor" id="{{step.anchor}}"></div>
+                    <div class="avatar">
+                        <img src="{{site.url}}{{site.baseurl}}/assets/img/{{step.avatar_image}}"/>
+                    </div>
+                    <div class="col asset">
+                        {% if step.video | strip_newlines != "" %}
+                            <div class="video">
+                                <video {% if step.controls == true %}controls="controls"{% endif %} {% if step.autoplay == true %}autoplay="autoplay"{% endif %} {% if step.muted == true %}muted="muted"{% endif %} loop="loop"><source src="{{site.url}}{{site.baseurl}}/assets/videos/{{step.video}}" type="video/mp4" /></video>
+                            </div>
+                        {% endif %}
+                        {% if step.image | strip_newlines != "" %}
+                            <div class="image mb-3">
+                                <img src="{{site.url}}{{site.baseurl}}/assets/img/{{step.image}}" alt="Step {{forloop.index}}">
+                            </div>
+                        {% endif %}
+                    </div>
+                    <div class="col content">
+                        <h2 class="{{step.color}}">{{ step.title }}</h2>
+                        {{step.content}}
+                        <a class="link-to-feature {{step.color}}" href="{{site_url}}{{step.step_url}}"> Explore! <i class="fa-solid fa-arrow-right"></i></a>
+                    </div>
+                </div>
+            {% endfor %}
+        </div>
+    </div>
+</section>
diff --git a/_layouts/personal.html b/_layouts/personal.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+{% include header.html %}
+
+<body>
+    {% include tagmanagerscript.html %}
+    {% include navbar.html %}
+    {% include hero-unit-personal.html %}
+    {% include steps-personal.html %}
+    {% include enterprise.html %}
+    {% include pricing.html%}
+    {% include footer.html %}
+</body>
+
+</html>
diff --git a/_pages/personal.markdown b/_pages/personal.markdown
@@ -0,0 +1,10 @@
+---
+title: Noovolari Leapp
+description: Manage your Cloud credentials locally and improve your workflow with the only open-source desktop app you’ll ever need.
+permalink: /solutions/personal
+layout: personal
+image: Leapp_Icon.png
+callout_content: callout/callout-home.html
+steps_data: steps_personal
+hero_data: "herounit_personal"
+---
diff --git a/assets/css/main.scss b/assets/css/main.scss
@@ -39,6 +39,7 @@
 @import "partials/download-content.scss";
 @import "partials/closed-beta-form-modal.scss";
 @import "partials/use-cases-section.scss";
+@import "partials/pricing.scss";
 @import "partials/media-query.scss";
 
 /** Reset some basic elements */