ultimate-jekyll-manager 0.0.142 → 0.0.144

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/index.html

@@ -14,35 +14,32 @@ hero:
   headline: "The #1 platform <br> for business"
   headline_accent: "success"
   description: "AI automation for modern businesses made simple"
+  demo:
+    enabled: false
+    type: "input"
+    placement: "bottom"
+    options:
+      class: "mw-md"
+      placeholder: "Enter your email"
+      name: "email"
+      input_type: "email"
+      required: true
+      redirect: "/dashboard"
+      subtext: "No credit card required"
+      button:
+        text: "Start Free Trial"
+        icon: "rocket"
+        class: "btn-adaptive-inverse"
   primary_button:
     text: "Get Started Free"
     icon: "rocket"
     href: "/dashboard"
+    class: "btn-light"
   secondary_button:
     text: "Explore Solutions"
     icon: "book-open"
     href: "/pricing"
-  cards:
-    - number: "50K+"
-      label: "Active Users"
-      icon: "users"
-      color: "primary"
-      height: "200px"
-    - number: "98%"
-      label: "Success Rate"
-      icon: "certificate"
-      color: "success"
-      height: "150px"
-    - number: "200+"
-      label: "Solutions"
-      icon: "book"
-      color: "warning"
-      height: "150px"
-    - number: "4.9/5"
-      label: "Average Rating"
-      icon: "star"
-      color: "info"
-      height: "200px"
+    class: "btn-outline-light"
   badge:
     title: "Industry Leader"
     subtitle: "2024 Award"
@@ -214,106 +211,158 @@ cta:
     href: "/contact"
 ---
 
-{% comment %}
-<section>
-  <div class="container">
-    <div class="row align-items-center min-vh-80">
-      <div class="col-lg-6">
-        <div class="mb-4" data-lazy="@class animation-slide-up">
-          <div class="d-flex align-items-center mb-3">
-            {% uj_icon "rocket", "text-primary fs-2 me-2" %}
-            <span class="text-primary fw-semibold fs-5">{{ page.resolved.hero.tagline }}</span>
-          </div>
-
-          <h1 class="h1 mb-3">
-            {{ page.resolved.hero.headline | split: " " | slice: 0, -2 | join: " " }} <span class="text-gradient-rainbow">{{ page.resolved.hero.headline | split: " " | slice: -2, 2 | join: " " }}</span><br>
-            {{ page.resolved.hero.headline_accent }}
-          </h1>
-
-          <p class="fs-5 text-muted mb-4">
-            {{ page.resolved.hero.description }}
-          </p>
-
-          <ul class="list-unstyled mb-4">
-            {% for feature in page.resolved.features.items limit: 3 %}
-              <li class="d-flex align-items-center mb-3">
-                {% uj_icon "check-circle", "text-success fs-5 me-3" %}
-                <span class="fs-6">{{ feature.title }}</span>
-              </li>
-            {% endfor %}
-          </ul>
-
-          <div class="d-flex flex-column flex-sm-row gap-3">
-            <a href="{{ page.resolved.hero.primary_button.href }}" class="btn btn-primary btn-lg px-4 py-3">
-              {% uj_icon page.resolved.hero.primary_button.icon, "me-2" %}
-              {{ page.resolved.hero.primary_button.text }}
-            </a>
-            <a href="{{ page.resolved.hero.secondary_button.href }}" class="btn btn-outline-adaptive btn-lg px-4 py-3">
-              {% uj_icon page.resolved.hero.secondary_button.icon, "me-2" %}
-              {{ page.resolved.hero.secondary_button.text }}
-            </a>
-          </div>
-        </div>
+<!-- Hero Section -->
+{% assign demo = page.resolved.hero.demo %}
+{% assign demo_placement = demo.placement | default: "bottom" %}
+{% assign is_side_layout = false %}
+{% if demo.enabled and demo_placement == "side" %}
+  {% assign is_side_layout = true %}
+{% endif %}
+
+{% comment %} Capture demo content once to avoid duplication {% endcomment %}
+{% capture hero_demo_content %}
+  {% if demo.type == "input" %}
+    <!-- Input Demo: Single input with button -->
+    <div class="card bg-glassy border-0 {% unless is_side_layout %}mx-auto{% endunless %} {{ demo.options.class }}">
+      <div class="card-body">
+        <form id="hero-demo-form" class="d-flex flex-column {% unless is_side_layout %}flex-sm-row justify-content-center{% endunless %} gap-3" {% iftruthy demo.options.redirect %}data-redirect="{{ demo.options.redirect }}"{% endiftruthy %}>
+          <input
+            type="{{ demo.options.input_type | default: 'text' }}"
+            name="{{ demo.options.name | default: 'input' }}"
+            class="form-control form-control-lg border-0"
+            placeholder="{{ demo.options.placeholder }}"
+            {% iftruthy demo.options.required %}required{% endiftruthy %}
+            autofocus
+            disabled
+          >
+          {% assign demo_btn_class = demo.options.button.class | default: "btn-adaptive-inverse" %}
+          <button type="submit" class="btn {{ demo_btn_class }} btn-lg text-nowrap flex-shrink-0" disabled>
+            {% iftruthy demo.options.button.icon %}
+              {% uj_icon demo.options.button.icon, "me-2" %}
+            {% endiftruthy %}
+            {{ demo.options.button.text }}
+          </button>
+        </form>
       </div>
+    </div>
 
-      <div class="col-lg-6 mt-5 mt-lg-0">
-        <div class="position-relative" data-lazy="@class animation-slide-up">
-          <div class="row g-4">
-            <div class="col-6">
-              <div class="bg-{{ page.resolved.hero.cards[0].color }} rounded-4 p-4 text-light text-center" style="height: {{ page.resolved.hero.cards[0].height }};">
-                <div class="d-flex flex-column justify-content-center h-100">
-                  {% uj_icon page.resolved.hero.cards[0].icon, "display-4 mb-3 text-light" %}
-                  <h3 class="mb-1">{{ page.resolved.hero.cards[0].number }}</h3>
-                  <p class="mb-0">{{ page.resolved.hero.cards[0].label }}</p>
-                </div>
-              </div>
-              <div class="bg-{{ page.resolved.hero.cards[1].color }} rounded-4 p-4 text-light text-center mt-4" style="height: {{ page.resolved.hero.cards[1].height }};">
-                <div class="d-flex flex-column justify-content-center h-100">
-                  {% uj_icon page.resolved.hero.cards[1].icon, "fs-1 mb-2 text-light" %}
-                  <h3 class="h4 mb-1">{{ page.resolved.hero.cards[1].number }}</h3>
-                  <p class="mb-0 small">{{ page.resolved.hero.cards[1].label }}</p>
-                </div>
-              </div>
-            </div>
-            <div class="col-6 d-flex flex-column">
-              <div class="bg-{{ page.resolved.hero.cards[2].color }} rounded-4 p-4 text-light text-center mb-4" style="height: {{ page.resolved.hero.cards[2].height }};">
-                <div class="d-flex flex-column justify-content-center h-100">
-                  {% uj_icon page.resolved.hero.cards[2].icon, "fs-1 mb-2 text-light" %}
-                  <h3 class="h4 mb-1">{{ page.resolved.hero.cards[2].number }}</h3>
-                  <p class="mb-0 small">{{ page.resolved.hero.cards[2].label }}</p>
-                </div>
-              </div>
-              <div class="bg-{{ page.resolved.hero.cards[3].color }} rounded-4 p-4 text-light text-center" style="height: {{ page.resolved.hero.cards[3].height }};">
-                <div class="d-flex flex-column justify-content-center h-100">
-                  {% uj_icon page.resolved.hero.cards[3].icon, "display-4 mb-3 text-light" %}
-                  <h3 class="mb-1">{{ page.resolved.hero.cards[3].number }}</h3>
-                  <p class="mb-0">{{ page.resolved.hero.cards[3].label }}</p>
+  {% elsif demo.type == "form" %}
+    <!-- Form Demo: Multiple fields with card styling -->
+    <div class="{% unless is_side_layout %}mx-auto{% endunless %} {{ demo.options.class }}">
+      <form id="hero-demo-form" {% iftruthy demo.options.redirect %}data-redirect="{{ demo.options.redirect }}"{% endiftruthy %}>
+        <div class="row g-3 {% unless is_side_layout %}justify-content-center{% endunless %}">
+          {% assign autofocus_set = false %}
+          {% for field in demo.options.fields %}
+            {% assign field_size = field.size | default: "half" %}
+            <div class="col-12 {% if field_size == 'half' %}col-sm-6{% endif %}">
+              <div class="card bg-glassy border-0">
+                <div class="card-body p-3">
+                  {% iftruthy field.label %}
+                    <label for="hero-demo-{{ field.name }}" class="form-label d-flex align-items-center mb-2">
+                      {% iftruthy field.icon %}
+                        {% uj_icon field.icon, "me-2" %}
+                      {% endiftruthy %}
+                      {{ field.label }}
+                      {% iftruthy field.required %}<span class="text-danger ms-1">*</span>{% endiftruthy %}
+                    </label>
+                  {% endiftruthy %}
+                  {% if field.type == "select" %}
+                    <select
+                      id="hero-demo-{{ field.name }}"
+                      name="{{ field.name }}"
+                      class="form-select form-select-lg border-0"
+                      {% iftruthy field.required %}required{% endiftruthy %}
+                      disabled
+                    >
+                      <option value="" disabled selected>{{ field.placeholder }}</option>
+                      {% for option in field.options %}
+                        <option value="{{ option.value }}">{{ option.label }}</option>
+                      {% endfor %}
+                    </select>
+                  {% elsif field.type == "textarea" %}
+                    <textarea
+                      id="hero-demo-{{ field.name }}"
+                      name="{{ field.name }}"
+                      class="form-control form-control-lg border-0"
+                      placeholder="{{ field.placeholder }}"
+                      rows="{{ field.rows | default: 3 }}"
+                      {% iftruthy field.required %}required{% endiftruthy %}
+                      {% unless autofocus_set %}autofocus{% assign autofocus_set = true %}{% endunless %}
+                      disabled
+                    ></textarea>
+                  {% else %}
+                    <input
+                      id="hero-demo-{{ field.name }}"
+                      type="{{ field.type | default: 'text' }}"
+                      name="{{ field.name }}"
+                      class="form-control form-control-lg border-0"
+                      placeholder="{{ field.placeholder }}"
+                      {% iftruthy field.required %}required{% endiftruthy %}
+                      {% unless autofocus_set %}autofocus{% assign autofocus_set = true %}{% endunless %}
+                      disabled
+                    >
+                  {% endif %}
                 </div>
               </div>
             </div>
+          {% endfor %}
+          {% assign form_btn_class = demo.options.button.class | default: "btn-adaptive-inverse" %}
+          <div class="col-12 {% if demo.options.button.full_width != true %}col-sm-auto{% endif %}">
+            <button type="submit" class="btn {{ form_btn_class }} btn-lg w-100 h-100" disabled>
+              {% iftruthy demo.options.button.icon %}
+                {% uj_icon demo.options.button.icon, "me-2" %}
+              {% endiftruthy %}
+              {{ demo.options.button.text }}
+            </button>
           </div>
+        </div>
+      </form>
+    </div>
 
-          <div class="position-absolute top-0 end-0 rounded-4 p-3 shadow-lg" style="transform: translate(20px, -20px);">
-            <div class="d-flex align-items-center">
-              {% uj_icon page.resolved.hero.badge.icon, "text-warning fs-4 me-2" %}
-              <div>
-                <div class="small">{{ page.resolved.hero.badge.title }}</div>
-                <div class="text-muted small">{{ page.resolved.hero.badge.subtitle }}</div>
-              </div>
-            </div>
-          </div>
+  {% elsif demo.type == "video" %}
+    <!-- Video Demo: Embedded video player -->
+    <div class="{% unless is_side_layout %}mx-auto{% endunless %} {{ demo.options.class }}">
+      <div class="card border-0 shadow-lg rounded-4 overflow-hidden">
+        <div class="ratio ratio-16x9">
+          {% uj_video demo.options.src, class="w-100 d-block object-fit-cover border-0", controls="{{ demo.options.controls }}", loop="{{ demo.options.loop }}", autoplay="{{ demo.options.autoplay }}", playsinline="true", muted="{{ demo.options.muted }}", preload="metadata" %}
         </div>
       </div>
     </div>
+
+  {% elsif demo.type == "custom" %}
+    <!-- Custom Demo: Renders content block -->
+    <div id="hero-demo-custom" class="{% unless is_side_layout %}mx-auto{% endunless %} {{ demo.options.class }}">
+      {{ demo.options.content }}
+    </div>
+
+  {% endif %}
+
+  {% iftruthy demo.options.subtext %}
+    <p class="small mt-3 opacity-70 {% if is_side_layout %}text-center mb-0{% endif %}">{{ demo.options.subtext }}</p>
+  {% endiftruthy %}
+{% endcapture %}
+
+{% comment %} Capture CTA buttons {% endcomment %}
+{% capture hero_cta_buttons %}
+  {% assign primary_btn_class = page.resolved.hero.primary_button.class | default: "btn-adaptive" %}
+  {% assign secondary_btn_class = page.resolved.hero.secondary_button.class | default: "btn-outline-adaptive" %}
+  <div class="d-flex flex-row flex-wrap gap-3 justify-content-center {% if is_side_layout %}justify-content-lg-start{% endif %}">
+    <a href="{{ page.resolved.hero.primary_button.href }}" class="btn {{ primary_btn_class }} btn-lg py-3 {% if is_side_layout %}px-4{% else %}px-5{% endif %}">
+      {% uj_icon page.resolved.hero.primary_button.icon, "me-2" %}
+      {{ page.resolved.hero.primary_button.text }}
+    </a>
+    <a href="{{ page.resolved.hero.secondary_button.href }}" class="btn {{ secondary_btn_class }} btn-lg py-3 {% if is_side_layout %}px-4{% else %}px-5{% endif %}">
+      {% uj_icon page.resolved.hero.secondary_button.icon, "me-2" %}
+      {{ page.resolved.hero.secondary_button.text }}
+    </a>
   </div>
-</section>
-{% endcomment %}
+{% endcapture %}
 
-<!-- Hero Section -->
 <section class="bg-gradient-rainbow gradient-animated gradient-grain text-light overflow-hidden position-relative min-vh-80 d-flex align-items-center rounded-bottom-4 shadow-lg">
   <div class="container py-5">
-    <div class="row justify-content-center">
-      <div class="col-lg-10 text-center py-5">
+    <div class="row justify-content-center {% if is_side_layout %}align-items-center{% endif %}">
+      <!-- Text Column -->
+      <div class="{% if is_side_layout %}col-lg-6 text-center text-lg-start{% else %}col-lg-10 text-center py-5{% endif %}">
         <div data-lazy="@class animation-slide-up">
           <p class="text-uppercase fw-semibold mb-3 opacity-80">{{ page.resolved.hero.tagline }}</p>
 
@@ -325,18 +374,29 @@ cta:
             {{ page.resolved.hero.description }}
           </p>
 
-          <div class="d-flex flex-column flex-sm-row gap-3 justify-content-center">
-            <a href="{{ page.resolved.hero.primary_button.href }}" class="btn btn-light btn-lg px-5 py-3">
-              {% uj_icon page.resolved.hero.primary_button.icon, "me-2" %}
-              {{ page.resolved.hero.primary_button.text }}
-            </a>
-            <a href="{{ page.resolved.hero.secondary_button.href }}" class="btn btn-outline-light btn-lg px-5 py-3">
-              {% uj_icon page.resolved.hero.secondary_button.icon, "me-2" %}
-              {{ page.resolved.hero.secondary_button.text }}
-            </a>
-          </div>
+          {% if is_side_layout %}
+            <!-- Side layout: CTA buttons go here, demo goes in right column -->
+            {{ hero_cta_buttons }}
+          {% else %}
+            <!-- Bottom layout: CTA buttons, then demo below -->
+            {{ hero_cta_buttons }}
+            {% if demo.enabled %}
+              <div class="mt-5">
+                {{ hero_demo_content }}
+              </div>
+            {% endif %}
+          {% endif %}
         </div>
       </div>
+
+      {% if is_side_layout %}
+        <!-- Demo Column (Side Placement) -->
+        <div class="col-lg-6 mt-5 mt-lg-0">
+          <div data-lazy="@class animation-slide-up">
+            {{ hero_demo_content }}
+          </div>
+        </div>
+      {% endif %}
     </div>
   </div>
 </section>

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/payment/checkout.html

@@ -262,6 +262,7 @@ web_manager:
                   <!-- Discount Code -->
                   <div class="mb-4 wm-binding-skeleton" data-wm-bind="@show checkout">
                     <div class="input-group" data-wm-bind="@show checkout" hidden>
+                      <label for="discount-code" class="visually-hidden">Discount code</label>
                       <input type="text" class="form-control rounded-start-3 border py-2 px-3 text-start" id="discount-code" name="discount-code" placeholder="Discount code" autocomplete="off">
                       <button class="btn btn-adaptive rounded-end-3 border px-4" type="button" id="apply-discount" data-action="apply-discount">Apply</button>
                     </div>

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/pricing.html

@@ -37,6 +37,7 @@ pricing:
         monthly: 0
         annually: 0
       features:
+        # Common features
         - id: "credits"
           name: "Credits"
           value: 10
@@ -45,6 +46,11 @@ pricing:
           name: "Exports"
           value: "Watermarked"
           icon: "download"
+        # Additional features
+        - id: "storage"
+          name: "Logo Storage"
+          value: "7 days"
+          icon: "clock"
 
     - id: "starter"
       name: "Starter"
@@ -54,6 +60,7 @@ pricing:
         monthly: 28
         annually: 276  # Total annual price (~20% off monthly)
       features:
+        # Common features
         - id: "credits"
           name: "Credits"
           value: 100
@@ -62,6 +69,7 @@ pricing:
           name: "Exports"
           value: "Unlimited"
           icon: "download"
+        # Additional features
         - id: "api_access"
           name: "API Access"
           value: "Full"
@@ -80,6 +88,7 @@ pricing:
         monthly: 50
         annually: 504  # Total annual price (~16% off monthly)
       features:
+        # Common features
         - id: "credits"
           name: "Credits"
           value: 200
@@ -88,6 +97,7 @@ pricing:
           name: "Exports"
           value: "Unlimited"
           icon: "download"
+        # Additional features
 
     - id: "max"
       name: "Max"
@@ -97,6 +107,7 @@ pricing:
         monthly: 100
         annually: 960  # Total annual price (20% off monthly)
       features:
+        # Common features
         - id: "credits"
           name: "Credits"
           value: 500
@@ -105,6 +116,7 @@ pricing:
           name: "Exports"
           value: "Unlimited"
           icon: "download"
+        # Additional features
         - id: "team_collaboration"
           name: "Team Collaboration"
           value: "Included"
@@ -438,7 +450,7 @@ faqs:
                         {% endfor %}
                       </ul>
 
-                      <!-- Show unique features for the first (Basic) plan -->
+                      <!-- Show Additional features for the first (Basic) plan -->
                       {% if forloop.index == 1 %}
                         {% assign has_unique_basic = false %}
                         {% for feature in plan.features %}
@@ -511,7 +523,7 @@ faqs:
                           </em>
                         </div>
 
-                        <!-- Additional/unique features if they exist -->
+                        <!-- Additional/Additional features if they exist -->
                         {% if has_additional %}
                           <ul class="list-unstyled mb-0">
                             {% for feature in plan.features %}

package/dist/defaults/dist/pages/test/components/hero-demo-custom.html

@@ -0,0 +1,60 @@
+---
+### ALL PAGES ###
+layout: blueprint/index
+permalink: /test/components/hero-demo-custom
+
+### PAGE CONFIG ###
+asset_path: index
+sitemap:
+  include: false
+meta:
+  title: "Hero Demo: Custom Type"
+  description: "Test page demonstrating the custom hero demo type"
+  index: false
+
+# Hero Section
+hero:
+  tagline: "Custom demo"
+  headline: "Design your"
+  headline_accent: "brand"
+  description: "Try our interactive brand builder right here"
+  demo:
+    enabled: true
+    type: "custom"
+    placement: "bottom"
+    options:
+      class: "bg-glassy rounded-4 p-4 mw-md"
+      subtext: "Customize and preview in real-time"
+      content: |
+        <div class="row g-3 text-start">
+          <div class="col-12">
+            <label for="color-picker" class="form-label fw-bold">{% uj_icon "palette", "me-1" %}Choose your brand color:</label>
+            <input type="color" class="form-control form-control-color form-control-lg border-0 w-100" id="color-picker" value="#6366f1" aria-label="Choose your brand color">
+          </div>
+          <div class="col-12">
+            <label for="style-select" class="form-label fw-bold">{% uj_icon "swatchbook", "me-1" %}Select style:</label>
+            <select class="form-select form-select-lg border-0" id="style-select" aria-label="Select style">
+              <option value="modern">Modern</option>
+              <option value="classic">Classic</option>
+              <option value="minimal">Minimal</option>
+              <option value="bold">Bold</option>
+            </select>
+          </div>
+          <div class="col-12">
+            <a href="/dashboard" class="btn btn-adaptive-inverse btn-lg px-4 w-100">
+              {% uj_icon "palette", "me-2" %}
+              Apply Theme
+            </a>
+          </div>
+        </div>
+  primary_button:
+    text: "Get Started Free"
+    icon: "rocket"
+    href: "/dashboard"
+    class: "btn-light"
+  secondary_button:
+    text: "Explore Solutions"
+    icon: "book-open"
+    href: "/pricing"
+    class: "btn-outline-light"
+---

package/dist/defaults/dist/pages/test/components/hero-demo-form.html

@@ -0,0 +1,83 @@
+---
+### ALL PAGES ###
+layout: blueprint/index
+permalink: /test/components/hero-demo-form
+
+### PAGE CONFIG ###
+asset_path: index
+sitemap:
+  include: false
+meta:
+  title: "Hero Demo: Form Type"
+  description: "Test page demonstrating the form hero demo type"
+  index: false
+
+# Hero Section
+hero:
+  tagline: "Form demo"
+  headline: "Get your custom"
+  headline_accent: "quote"
+  description: "Tell us about your project and we'll get back to you within 24 hours"
+  demo:
+    enabled: true
+    type: "form"
+    placement: "bottom"
+    options:
+      class: "mw-lg"
+      redirect: "/contact"
+      subtext: "We respond within 24 hours"
+      fields:
+        - name: "industry"
+          label: "Industry"
+          icon: "building"
+          type: "select"
+          size: "half"
+          placeholder: "Select industry"
+          options:
+            - value: "technology"
+              label: "Technology"
+            - value: "healthcare"
+              label: "Healthcare"
+            - value: "finance"
+              label: "Finance"
+            - value: "retail"
+              label: "Retail"
+        - name: "company_size"
+          label: "Company Size"
+          icon: "users"
+          type: "select"
+          size: "half"
+          placeholder: "Select size"
+          options:
+            - value: "1-10"
+              label: "1-10 employees"
+            - value: "11-50"
+              label: "11-50 employees"
+            - value: "51-200"
+              label: "51-200 employees"
+            - value: "200+"
+              label: "200+ employees"
+        - name: "message"
+          label: "Tell us about your project"
+          icon: "comment"
+          type: "textarea"
+          size: "full"
+          placeholder: "Describe your goals, challenges, or questions..."
+          rows: 4
+          required: true
+      button:
+        text: "Get Quote"
+        icon: "paper-plane"
+        full_width: true
+        class: "btn-adaptive-inverse"
+  primary_button:
+    text: "Get Started Free"
+    icon: "rocket"
+    href: "/dashboard"
+    class: "btn-light"
+  secondary_button:
+    text: "Explore Solutions"
+    icon: "book-open"
+    href: "/pricing"
+    class: "btn-outline-light"
+---

package/dist/defaults/dist/pages/test/components/hero-demo-input.html

@@ -0,0 +1,47 @@
+---
+### ALL PAGES ###
+layout: blueprint/index
+permalink: /test/components/hero-demo-input
+
+### PAGE CONFIG ###
+asset_path: index
+sitemap:
+  include: false
+meta:
+  title: "Hero Demo: Input Type"
+  description: "Test page demonstrating the input hero demo type"
+  index: false
+
+# Hero Section
+hero:
+  tagline: "Input demo"
+  headline: "Create your logo in"
+  headline_accent: "seconds"
+  description: "Enter your business name and watch the magic happen"
+  demo:
+    enabled: true
+    type: "input"
+    placement: "bottom"
+    options:
+      class: "mw-md"
+      placeholder: "Enter your business name..."
+      name: "business_name"
+      input_type: "text"
+      required: true
+      redirect: "/dashboard"
+      subtext: "No credit card required - 5 free logos"
+      button:
+        text: "Generate Logo"
+        icon: "sparkles"
+        class: "btn-adaptive-inverse"
+  primary_button:
+    text: "Get Started Free"
+    icon: "rocket"
+    href: "/dashboard"
+    class: "btn-light"
+  secondary_button:
+    text: "Explore Solutions"
+    icon: "book-open"
+    href: "/pricing"
+    class: "btn-outline-light"
+---