WIP: Add event and solution page

content/events/_index.md

@@ -0,0 +1,3 @@
+---
+title: Events | AppsCode
+---

content/solutions/_index.md

@@ -0,0 +1,3 @@
+---
+title: Solutions | AppsCode
+---

data/events.json

@@ -0,0 +1,39 @@
+[
+  {   
+      "id":"1",
+      "date": "SEP 03 - 04, 2024",
+      "sort_date": "2024-09-03",
+      "title": "Container Days Conference",
+      "description": "The CDS family grows every year and you can't miss this fantastic learning experience on #Kubernetes, #CloudNative, #ContainerSecurity, #DevOps, #GitOps, #EdgeComputing #CloudComputing, #Cloud Containers and much more. Kubernauts from across the globe come to speak, network and exchange on the cloud native technologies hottest topics and trends.",
+      "meet_with_us": "https://appscode.com/contact/",
+      "event_details": "https://www.containerdays.io/containerdays-conference-2024/"
+  },
+  {   
+      "id":"2",
+      "date": "OCT 08 - 10, 2024",
+      "sort_date": "2024-10-08",
+      "title": "MWC Las Vegas",
+      "description": "Meet the experts with the solutions you need for today, and a hyperconnected tomorrow. At North America's premier event for the enterprise 5G ecosystem.",
+      "meet_with_us": "https://appscode.com/contact/",
+      "event_details": "https://www.mwclasvegas.com/"
+  },
+  {
+      "id":"3",
+      "date": "OCT 27 - 28, 2024",
+      "sort_date": "2024-10-27",
+      "title": "THE LARGEST OPEN SOURCE / WEB / TECH CONFERENCE ON THE U.S. EAST COAST",
+      "description": "",
+      "meet_with_us": "https://appscode.com/contact/",
+      "event_details": "https://2024.allthingsopen.org/"
+  },
+  {
+      "id":"4",
+      "date": "NOV 12 - 15, 2024",
+      "sort_date": "2024-11-12",
+      "title": "KubeCon North America",
+      "description": "The Cloud Native Computing Foundation’s flagship conference gathers adopters and technologists from leading open source and cloud native communities in Salt Lake City, Utah from November 12-15, 2024. Join our CNCF Graduated and Incubating Projects as the community gathers for four days to further the education and advancement of cloud native computing.",
+      "meet_with_us": "https://appscode.com/contact/",
+      "event_details": "https://events.linuxfoundation.org/kubecon-cloudnativecon-north-america/",
+      "show": true
+  }
+]

hugo_stats.json

@@ -73,6 +73,7 @@
       "arrow",
       "arrows",
       "back-button",
+      "badge",
       "bb-1",
       "bg-color-available",
       "bg-gradient-1",
@@ -95,6 +96,8 @@
       "ceo-image",
       "ceo-message",
       "ceo-message-wrapper",
+      "circle",
+      "circle-1",
       "circle-shape",
       "client-info",
       "client-thumb",
@@ -141,6 +144,8 @@
       "disaster-recovery",
       "dots-style",
       "embeded-console-button",
+      "event-wrapper",
+      "events-page",
       "fa",
       "fa-angle-down",
       "fa-angle-up",
@@ -194,13 +199,15 @@
       "has-text-right-tablet",
       "has-text-weight-light",
       "has-text-weight-semibold",
+      "has-text-white",
       "header--fixed",
       "header-items",
       "header-left",
       "header-right",
       "height-20",
       "height-40",
       "height-60",
+      "hero-area",
       "hero-area-1",
       "hero-area-2",
       "hero-area-button",
@@ -230,6 +237,7 @@
       "is-7",
       "is-8",
       "is-8-desktop",
+      "is-8-until-fullhd",
       "is-8-widescreen",
       "is-9",
       "is-active",
@@ -238,6 +246,7 @@
       "is-block",
       "is-centered",
       "is-checkradio",
+      "is-clickable",
       "is-danger",
       "is-ellipsis-2",
       "is-ellipsis-3",
@@ -254,6 +263,7 @@
       "is-full-touch",
       "is-fullwidth",
       "is-gap-4",
+      "is-gap-8",
       "is-gradient",
       "is-half-mobile",
       "is-half-tablet",
@@ -398,6 +408,7 @@
       "pr-20",
       "pr-40",
       "pr-60",
+      "primary-gradient",
       "product-description",
       "product-info",
       "product-logo",
@@ -432,11 +443,13 @@
       "single-brand",
       "single-card",
       "single-contact-info",
+      "single-event",
       "single-feature",
       "single-footer-widget",
       "single-input-form",
       "single-package-wrapper",
       "single-product",
+      "single-solution",
       "single-speaker",
       "single-testimonial-item",
       "single-training-image-wrapper",
@@ -450,6 +463,7 @@
       "social-connect-area",
       "social-link",
       "social-prove-brand-area",
+      "solution-page",
       "spam-message",
       "speaker-image",
       "speaker-info",

layouts/_default/events.html

@@ -0,0 +1,53 @@
+{{ define "header-bottom" }}
+<section></section>
+{{ end }}
+
+{{ define "main" }}
+
+<section class="events-page bg-gradient-1" style="background-image: url(../assets/images/gradient-bg.webp);">
+    <div class="container">
+        <div class="columns is-multiline">
+            <div class="owl-carousel event-wrapper">
+                {{ $currentDate := now.Format "2006-01-02" }}  <!-- Format current date -->
+
+                <!-- Get the latest event -->
+                {{ $sortedEvents := sort (where $.Site.Data.events "sort_date" "ge" $currentDate) "sort_date" "ase" }}
+                {{ range $event := $sortedEvents }}
+                <div class="single-event primary-gradient">
+                    <span class="circle circle-1"></span>
+                    <div class="is-flex is-justify-content-space-between">
+                        <span class="date">{{ $event.date }}</span>
+                        <span class="badge tag">UPCOMING</span>
+                    </div>
+                    <h2>{{ $event.title }}</h2>
+                    <p class="is-ellipsis-4">{{ $event.description }}</p>
+
+                    <div class="buttons is-gap-8">
+                        <a href="{{ $event.meet_with_us }}" class="button ac-button is-primary">Join with us</a>
+                        <a href="{{ $event.event_details }}" target="_blank" class="button ac-button is-transparent has-text-white">Event Details</a>
+                    </div>
+                </div>
+                {{ end }}
+            </div>
+        </div>
+        <!-- <div class="columns is-centered">
+            <div class="column is-full-mobile is-2-desktop">
+                <button class="button ac-button is-outlined is-fullwidth">View More</button>
+            </div>
+        </div> -->
+    </div>
+</section>
+
+{{ end }}
+
+{{ define "testimonial" }}
+<section></section>
+{{ end }}
+
+{{ define "customer-logos" }}
+<section></section>
+{{ end }}
+
+{{ define "cta-install" }}
+<section></section>
+{{ end }}

layouts/_default/solutions.html

@@ -0,0 +1,45 @@
+{{ define "header-bottom" }}
+<section></section>
+{{ end }}
+
+{{ define "main" }}
+<div class="solution-page bg-gradient-1" style="background-image: url(../assets/images/gradient-bg.webp);">
+    <section class="hero-area">
+        <div class="container">
+        <div class="columns is-centered">
+            <div class="column is-6-desktop is-8-until-fullhd has-text-centered">
+                <h1 class="is-gradient">AppsCode solutions Speed up your cloud journey</h1>
+            </div>
+        </div>
+        </div>
+    </section>
+
+    <!-- <p>{{ $.Site.Data.products.stash.website.domainKey }}</p> -->
+    {{ $productNames := slice "kubedb" "stash" "kubevault" "voyager" "configsyncer" "guard" }}
+
+    {{ $configParams := dict "siteName" .Site.Params }}
+
+    {{ range $productNames }}
+        {{ $productData := index $.Site.Data.products . }}
+        {{ partial "components/solution.html" (dict "ProductData" $productData "Config" $configParams) }}
+    {{ end }}
+
+
+
+
+
+</div>
+
+{{ end }}
+
+{{ define "testimonial" }}
+<section></section>
+{{ end }}
+
+{{ define "customer-logos" }}
+<section></section>
+{{ end }}
+
+{{ define "cta-install" }}
+<section></section>
+{{ end }}

layouts/partials/components/solution.html

@@ -0,0 +1,46 @@
+<section class="single-solution section-padding">
+  <div class="container">
+      <!-- <div class="columns is-centered">
+          <div class="column is-8">
+              <div class="section-title has-text-centered-tablet mb-0">
+                  <h2>{{ .tagline }}</h2>
+                  <p class="mb-0">{{ .summary }}</p>
+              </div>
+          </div>
+      </div> -->
+      <div class="columns is-multiline is-vcentered">
+          <div class="column is-full-touch is-4-desktop">
+              <div class="left-content">
+                  <img src="{{ .ProductData.logo.src }}" alt="{{ .ProductData.fullname}}">
+                  <h3>{{ .ProductData.tagline | plainify  }}</h3>
+                  <p>{{ .ProductData.summary | plainify}}</p>
+                  {{ $siteName := .Config.siteName }} 
+                  {{ $domainKey := .ProductData.website.domainKey }}
+                  <a href="{{index $siteName $domainKey}}" class="button ac-button is-primary">
+                    <span>Try {{ .ProductData.name }}</span>
+                    <span class="icon">
+                        <iconify-icon icon="heroicons:arrow-up-right-solid"></iconify-icon>
+                      </span>
+                  </a>
+              </div>
+          </div>
+
+          <div class="column is-full-touch is-8-desktop">
+              <div class="right-content">
+                  {{range $feature := .ProductData.features}}
+                  <a href="{{index $siteName $domainKey}}/features" class="single-card">
+                      <h5>{{$feature.title}}</h5>
+                      <p class="is-ellipsis-3">{{$feature.description}}</p>
+                        <button class="ac-button is-flex is-align-items-center is-gap-4 is-transparent is-clickable">
+                            <span>Read More</span> 
+                            <span class="icon">
+                                <iconify-icon icon="heroicons:arrow-up-right-solid"></iconify-icon>
+                              </span>
+                        </button>
+                  </a>
+                  {{end}}              
+              </div>
+          </div>
+      </div>
+  </div>
+</section>

layouts/partials/components/testimonial.html

@@ -4,12 +4,12 @@
     <div class="columns is-vcentered">
       <div class="column is-4">
         <div class="section-title">
-          <h2 class="is-gradient" data-aos="fade-up" data-aos-duration="500">What They Are <span
+          <h2 class="is-gradient">What They Are <span
               class="has-text-weight-light"> Talking About us</span></h2>
           <p data-aos="fade-up" data-aos-duration="700">Trusted by top engineers at the most ambitious companies</p>
         </div>
         <!-- arrows start  -->
-        <div class="arrows" data-aos="fade-up" data-aos-duration="900">
+        <div class="arrows">
           <button class="button arrow is-rounded customPrevBtn">
             <span class="icon">
               <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">

layouts/partials/footer/footer.html

@@ -119,6 +119,18 @@
                     <iconify-icon icon="heroicons:arrow-small-right" width="14" height="14"></iconify-icon>
                   </span>
                 </a></li>
+                <li><a href="/solutions" class="is-flex is-gap-4">
+                  <span>Solutions</span>
+                  <span class="is-flex is-align-items-center">
+                    <iconify-icon icon="heroicons:arrow-small-right" width="14" height="14"></iconify-icon>
+                  </span>
+                </a></li>
+                <li><a href="/events" class="is-flex is-gap-4">
+                  <span>Events</span>
+                  <span class="is-flex is-align-items-center">
+                    <iconify-icon icon="heroicons:arrow-small-right" width="14" height="14"></iconify-icon>
+                  </span>
+                </a></li>
                 <li><a href="{{.Site.Params.blog_url}}" class="is-flex is-gap-4">
                   <span>Blog</span>
                   <span class="is-flex is-align-items-center">

layouts/partials/helpers/style-bundle.html

@@ -16,8 +16,8 @@
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" media="print" onload="this.media='all'">
 
 <!-- Load custom CSS asynchronously -->
-<!-- <link rel="stylesheet" href="/assets/sass/main.css"> -->
+<link rel="stylesheet" href="/assets/sass/main.css">
 
-{{ with $style := resources.Get "/assets/sass/main.css" | resources.PostCSS | resources.Minify | resources.Fingerprint }}
+<!-- {{ with $style := resources.Get "/assets/sass/main.css" | resources.PostCSS | resources.Minify | resources.Fingerprint }}
 <link rel="stylesheet" href="{{ $style.RelPermalink }}" />
-{{ end }}
+{{ end }} -->

static/assets/js/main.js

@@ -122,6 +122,23 @@ Array.from(responsiveMenus).forEach((menu, idx) => {
 });
 
 
+$('.event-wrapper').owlCarousel({
+  loop:true,
+  nav:true,
+  autoplay:true,
+  responsive:{
+      0:{
+          items:1
+      },
+      600:{
+          items:1
+      },
+      1000:{
+          items:1
+      }
+  }
+})
+
 //mechanism tabs =============================================start
 
   // Get all the single-feature mechanism elements

static/assets/sass/base/utilities/_typography.scss

@@ -4,7 +4,7 @@
 // @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap");
 
 $ac-font-heading: "Roboto", sans-serif;
-$ac-font-paragraph: "Roboto", sans-serif;
+$ac-font-paragraph: "Inter", sans-serif;
 // $ac-font-inter: "Inter", sans-serif;
 
 html,

static/assets/sass/components/_button.scss

@@ -4,7 +4,7 @@
     border-color: $ac-primary;
     border-radius: 0.125rem;
     font-size: 0.875rem;
-    font-family: $ac-font-paragraph;
+    font-family: $ac-font-heading;
     letter-spacing: 0.078rem;
     line-height: 1;
     color: $ac-primary;