ultimate-jekyll-manager 0.0.142 → 0.0.144

package/dist/assets/css/core/_lazy-loading.scss

@@ -12,6 +12,19 @@ img[data-lazy] {
   height: auto; // Maintain aspect ratio
 }
 
+// Hide video/audio elements until loaded to prevent ugly native controls showing during shimmer
+[data-lazy-load-container].lazy-loading video,
+[data-lazy-load-container].lazy-loading audio {
+  opacity: 0;
+}
+
+// Show video/audio elements once loaded with fade-in
+[data-lazy-load-container].lazy-loaded video,
+[data-lazy-load-container].lazy-loaded audio {
+  opacity: 1;
+  transition: opacity 0.25s ease-in;
+}
+
 // ============================================
 // Loading States
 // ============================================

package/dist/assets/js/libs/form-manager.js

@@ -13,7 +13,7 @@
 
 // Libraries
 import { ready as domReady } from 'web-manager/modules/dom.js';
-import { showNotification } from 'web-manager/modules/utilities.js';
+import { showNotification, getDeviceType } from 'web-manager/modules/utilities.js';
 
 export class FormManager {
   constructor(selector, options = {}) {
@@ -150,9 +150,9 @@ export class FormManager {
     this._setState('ready');
     this._setDisabled(false);
 
-    // Focus the field with autofocus attribute if it exists
+    // Focus the field with autofocus attribute if it exists (desktop only)
     const $autofocusField = this.$form.querySelector('[autofocus]');
-    if ($autofocusField && !$autofocusField.disabled) {
+    if ($autofocusField && !$autofocusField.disabled && getDeviceType() === 'desktop') {
       $autofocusField.focus();
 
       // Move cursor to end of input if it has existing text

package/dist/assets/js/pages/index.js

@@ -7,16 +7,12 @@ let webManager = null;
 // Module
 export default (Manager) => {
   return new Promise(async function (resolve) {
-    console.log('[Homepage] Module loading...');
-
     // Shortcuts
     webManager = Manager.webManager;
 
     // Initialize when DOM is ready
     await webManager.dom().ready();
 
-    console.log('[Homepage] DOM ready');
-
     // Bootstrap tabs handle all the tab switching automatically via data-bs-toggle="tab"
     // We just need to pause videos when switching tabs for better UX
     setupVideoControls();

package/dist/assets/themes/classy/_config.scss

@@ -184,5 +184,6 @@ $avatar-sizes: (
   $headings-font-weight: $headings-font-weight,
   $border-radius: $border-radius,
   $border-radius-sm: $border-radius-sm,
-  $border-radius-lg: $border-radius-lg
+  $border-radius-lg: $border-radius-lg,
+  $enable-negative-margins: true
 );

package/dist/assets/themes/classy/_theme.js

@@ -18,6 +18,8 @@ import setupNavbarScroll from './js/navbar-scroll.js';
 import { setupInfiniteScroll } from './js/infinite-scroll.js';
 // Import tooltip initialization
 import initializeTooltips from './js/initialize-tooltips.js';
+// Import hero demo form initialization
+import initHeroDemoForm from './js/hero-demo-form.js';
 
 // Initialize theme components when DOM is ready
 domReady().then(() => {
@@ -27,4 +29,7 @@ domReady().then(() => {
 
   // Generic Bootstrap initializations
   initializeTooltips();
+
+  // Initialize hero demo form if present
+  initHeroDemoForm();
 });

package/dist/assets/themes/classy/css/base/_spacing.scss

@@ -28,6 +28,10 @@
 // ============================================
 // Height utilities using viewport height (vh) units
 .vh-50 { height: 50vh !important; }
+.vh-75 { height: 75vh !important; }
+.vh-80 { height: 80vh !important; }
+.vh-90 { height: 90vh !important; }
+.vh-100 { height: 100vh !important; }
 
 // Min-Height utilities using viewport height (vh) units
 .min-vh-50 { min-height: 50vh !important; }

package/dist/assets/themes/classy/css/components/_buttons.scss

@@ -357,25 +357,20 @@
 // ============================================
 // Adaptive Inverse Buttons
 // ============================================
-// .btn-adaptive-inverse {
-//   @extend .btn-light;
-//   // color: $dark !important;
-
-//   // &:hover {
-//   //   background: $dark !important;
-//   //   color: white !important;
-//   // }
-// }
-
-// [data-bs-theme="dark"] .btn-adaptive-inverse {
-//   @extend .btn-dark;
-//   // color: white !important;
-
-//   // &:hover {
-//   //   background: white !important;
-//   //   color: $dark !important;
-//   // }
-// }
+.btn-adaptive-inverse {
+  @extend .btn-light;
+}
+
+[data-bs-theme="dark"] .btn-adaptive-inverse {
+  @extend .btn-dark;
+}
+.btn-outline-adaptive-inverse {
+  @extend .btn-outline-light;
+}
+
+[data-bs-theme="dark"] .btn-outline-adaptive-inverse {
+  @extend .btn-outline-dark;
+}
 
 // ============================================
 // Gradient Rainbow Button

package/dist/assets/themes/classy/js/hero-demo-form.js

@@ -0,0 +1,42 @@
+/**
+ * Hero Demo Form
+ * Initializes FormManager for hero demo forms (input or form type)
+ */
+
+/**
+ * Initialize the hero demo form if present
+ */
+export default async function initHeroDemoForm() {
+  const $form = document.querySelector('#hero-demo-form');
+
+  if (!$form) {
+    return;
+  }
+
+  // Dynamic import FormManager only when needed
+  const { FormManager } = await import('__main_assets__/js/libs/form-manager.js');
+
+  const formManager = new FormManager($form, {
+    submittingText: 'Processing...',
+  });
+
+  formManager.on('submit', async ({ data }) => {
+    // Get redirect URL from form data attribute or default to /dashboard
+    const redirectUrl = $form.dataset.redirect || '/dashboard';
+
+    // Build query string from form data
+    const params = new URLSearchParams();
+
+    Object.entries(data).forEach(([key, value]) => {
+      if (value !== null && value !== undefined && value !== '') {
+        params.set(key, value);
+      }
+    });
+
+    // Redirect with form data as query params
+    const queryString = params.toString();
+    const url = queryString ? `${redirectUrl}?${queryString}` : redirectUrl;
+
+    window.location.href = url;
+  });
+}

package/dist/defaults/dist/_includes/core/foot.html

@@ -49,13 +49,39 @@
             </a>
           </div>
 
+          <hr class="my-4">
+
+          <!-- Social proof -->
+          <div class="d-flex align-items-center justify-content-center">
+            <div class="d-flex me-2">
+              <span class="avatar avatar-sm rounded-circle border border-2 border-body overflow-hidden me-n2">
+                <img src="{{ site.uj.placeholder.src }}" data-lazy="@src https://i.pravatar.cc/40?img=1" alt="">
+              </span>
+              <span class="avatar avatar-sm rounded-circle border border-2 border-body overflow-hidden me-n2">
+                <img src="{{ site.uj.placeholder.src }}" data-lazy="@src https://i.pravatar.cc/40?img=2" alt="">
+              </span>
+              <span class="avatar avatar-sm rounded-circle border border-2 border-body overflow-hidden me-n2">
+                <img src="{{ site.uj.placeholder.src }}" data-lazy="@src https://i.pravatar.cc/40?img=3" alt="">
+              </span>
+              <span class="avatar avatar-sm rounded-circle border border-2 border-body overflow-hidden">
+                <img src="{{ site.uj.placeholder.src }}" data-lazy="@src https://i.pravatar.cc/40?img=4" alt="">
+              </span>
+            </div>
+            <span class="text-muted">
+              •
+            </span>
+            <small class="ms-2 text-muted"><strong class="text-body">10k+</strong> happy subscribers</small>
+          </div>
+
           <!-- Trust indicators -->
-          <div class="mt-4 pt-3 border-top">
+          {% comment %}
+          <div class="mt-3 pt-3 border-top">
             <small class="text-muted">
               <span class="text-success me-1">{% uj_icon "shield-alt" %}</span>
               No spam, ever. Unsubscribe anytime.
             </small>
           </div>
+          {% endcomment %}
         </div>
       </div>
     </div>

package/dist/defaults/dist/_layouts/blueprint/admin/firebase/index.html

@@ -80,8 +80,8 @@ meta:
       </div>
       <div class="card-body">
         <div class="mb-3">
-          <label class="form-label small">Where</label>
-          <select class="form-select form-select-sm">
+          <label for="query-field" class="form-label small">Where</label>
+          <select class="form-select form-select-sm" id="query-field">
             <option>Select field...</option>
             <option>email</option>
             <option>name</option>
@@ -90,7 +90,8 @@ meta:
           </select>
         </div>
         <div class="mb-3">
-          <select class="form-select form-select-sm">
+          <label for="query-operator" class="visually-hidden">Operator</label>
+          <select class="form-select form-select-sm" id="query-operator" aria-label="Comparison operator">
             <option>==</option>
             <option>!=</option>
             <option>&gt;</option>
@@ -100,7 +101,8 @@ meta:
           </select>
         </div>
         <div class="mb-3">
-          <input type="text" class="form-control form-control-sm" placeholder="Value">
+          <label for="query-value" class="visually-hidden">Value</label>
+          <input type="text" class="form-control form-control-sm" id="query-value" placeholder="Value" aria-label="Query value">
         </div>
         <button class="btn btn-sm btn-adaptive w-100">
           {% uj_icon "magnifying-glass", "fa-sm me-2" %}
@@ -126,7 +128,7 @@ meta:
               <span class="input-group-text">
                 {% uj_icon "magnifying-glass", "fa-sm" %}
               </span>
-              <input type="text" class="form-control" placeholder="Search documents...">
+              <input type="text" class="form-control" id="document-search" placeholder="Search documents..." aria-label="Search documents">
             </div>
             <div class="btn-group btn-group-sm">
               <button class="btn btn-outline-adaptive active">
@@ -148,7 +150,7 @@ meta:
             <thead class="table-light">
               <tr>
                 <th style="width: 30px;">
-                  <input class="form-check-input" type="checkbox">
+                  <input class="form-check-input" type="checkbox" id="select-all-documents" aria-label="Select all documents">
                 </th>
                 <th>Document ID</th>
                 <th>email</th>
@@ -162,7 +164,7 @@ meta:
               {% for i in (1..15) %}
               <tr>
                 <td>
-                  <input class="form-check-input" type="checkbox">
+                  <input class="form-check-input" type="checkbox" aria-label="Select document {{ i }}">
                 </td>
                 <td class="font-monospace small">
                   {% if i < 10 %}usr00{{ i }}{% else %}usr0{{ i }}{% endif %}abc123xyz

package/dist/defaults/dist/_layouts/blueprint/admin/notifications/new.html

@@ -229,18 +229,20 @@ prerender_icons:
           </h5>
 
           <div class="mb-3">
-            <label class="form-label">Auto-submit Date & Time</label>
+            <span class="form-label d-block">Auto-submit Date & Time</span>
             <small class="d-block text-muted mb-2">
               Leave empty to send immediately, or schedule for later
             </small>
             <div class="row">
               <div class="col-md-5">
+                <label for="schedule-date" class="visually-hidden">Schedule date</label>
                 <input type="date"
                        class="form-control"
                        name="schedule.date"
                        id="schedule-date">
               </div>
               <div class="col-md-4">
+                <label for="schedule-time" class="visually-hidden">Schedule time</label>
                 <input type="time"
                        class="form-control"
                        name="schedule.time"

package/dist/defaults/dist/_layouts/blueprint/admin/users/index.html

@@ -65,12 +65,12 @@ meta:
       <span class="input-group-text">
         {% uj_icon "magnifying-glass", "fa-sm" %}
       </span>
-      <input type="text" class="form-control" placeholder="Search users by name, email, or ID...">
+      <input type="text" class="form-control" id="user-search" placeholder="Search users by name, email, or ID..." aria-label="Search users">
     </div>
   </div>
   <div class="col-md-6">
     <div class="d-flex gap-2 justify-content-end">
-      <select class="form-select" style="width: auto;">
+      <select class="form-select" id="user-sort" style="width: auto;" aria-label="Sort users">
         <option>Sort by: Date Created</option>
         <option>Sort by: Name</option>
         <option>Sort by: Last Active</option>
@@ -92,7 +92,7 @@ meta:
         <thead>
           <tr>
             <th>
-              <input class="form-check-input" type="checkbox">
+              <input class="form-check-input" type="checkbox" id="select-all-users" aria-label="Select all users">
             </th>
             <th>User</th>
             <th>Role</th>
@@ -106,7 +106,7 @@ meta:
           {% for i in (1..10) %}
           <tr>
             <td>
-              <input class="form-check-input" type="checkbox">
+              <input class="form-check-input" type="checkbox" aria-label="Select user {{ i }}">
             </td>
             <td>
               <div class="d-flex align-items-center">

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

@@ -1016,7 +1016,7 @@ badges:
 
             <div class="mb-0">
               <div class="input-group">
-                <input type="text" class="form-control font-monospace" id="referral-code-input" readonly value="Loading...">
+                <input type="text" class="form-control font-monospace" id="referral-code-input" readonly value="Loading..." aria-label="Your referral code">
                 <button type="button" class="btn btn-outline-adaptive" id="copy-referral-code-btn">
                   {% uj_icon "copy", "me-2" %}
                   <span class="button-text d-none d-sm-inline">Copy</span>

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/blog/post.html

@@ -296,7 +296,8 @@ newsletter:
 
             <form class="row g-3 justify-content-center needs-validation" action="{{ site.url }}/email-subscription">
               <div class="col-md-7">
-                <input type="email" name="email" class="form-control form-control-lg" placeholder="{% iftruthy page.resolved.newsletter.form.placeholder %}{{ page.resolved.newsletter.form.placeholder }}{% endiftruthy %}" autocomplete="email" required>
+                <label for="newsletter-email" class="visually-hidden">Email address</label>
+                <input type="email" name="email" id="newsletter-email" class="form-control form-control-lg" placeholder="{% iftruthy page.resolved.newsletter.form.placeholder %}{{ page.resolved.newsletter.form.placeholder }}{% endiftruthy %}" autocomplete="email" required>
               </div>
               <div class="col-md-auto">
                 <button type="submit" class="btn btn-light btn-lg px-4">{% iftruthy page.resolved.newsletter.button.text %}{{ page.resolved.newsletter.button.text }}{% endiftruthy %}</button>

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

@@ -822,12 +822,12 @@ cta:
 
           <div class="position-relative mb-3">
             <div class="mb-1">
-              <h6 class="mb-0">2. Navigate to Downloads</h6>
+              <h6 class="mb-0" id="linux-step-2-label">2. Navigate to Downloads</h6>
               <small class="text-muted">Run the command below</small>
             </div>
             <div class="bg-body-tertiary rounded-4 p-4 overflow-hidden position-relative">
               <div class="input-group">
-                <input type="text" class="form-control font-monospace bg-dark text-light border-0" name="linux-command-1" value="cd ~/Downloads" readonly>
+                <input type="text" class="form-control font-monospace bg-dark text-light border-0" name="linux-command-1" value="cd ~/Downloads" readonly aria-labelledby="linux-step-2-label">
                 <button type="button" class="btn btn-outline-adaptive copy-command-btn">
                   {% uj_icon "copy", "me-2" %}
                   <span class="button-text d-none d-sm-inline">Copy</span>
@@ -838,14 +838,14 @@ cta:
 
           <div class="position-relative mb-3">
             <div class="mb-1">
-              <h6 class="mb-0">3. Install the package</h6>
+              <h6 class="mb-0" id="linux-step-3-label">3. Install the package</h6>
               <small class="text-muted">Run the appropriate command for your distribution</small>
             </div>
             <div class="bg-body-tertiary rounded-4 p-4 overflow-hidden position-relative">
               <div class="mb-3">
-                <small class="text-muted d-block mb-2 fw-bold">For Debian/Ubuntu:</small>
+                <small class="text-muted d-block mb-2 fw-bold" id="linux-debian-label">For Debian/Ubuntu:</small>
                 <div class="input-group">
-                  <input type="text" class="form-control font-monospace bg-dark text-light border-0" name="linux-command-2" value="sudo dpkg -i {{ site.brand.name | downcase }}_amd64.deb" readonly>
+                  <input type="text" class="form-control font-monospace bg-dark text-light border-0" name="linux-command-2" value="sudo dpkg -i {{ site.brand.name | downcase }}_amd64.deb" readonly aria-labelledby="linux-debian-label">
                   <button type="button" class="btn btn-outline-adaptive copy-command-btn">
                     {% uj_icon "copy", "me-2" %}
                     <span class="button-text d-none d-sm-inline">Copy</span>
@@ -853,9 +853,9 @@ cta:
                 </div>
               </div>
               <div>
-                <small class="text-muted d-block mb-2 fw-bold">For Fedora/RHEL:</small>
+                <small class="text-muted d-block mb-2 fw-bold" id="linux-fedora-label">For Fedora/RHEL:</small>
                 <div class="input-group">
-                  <input type="text" class="form-control font-monospace bg-dark text-light border-0" name="linux-command-3" value="sudo rpm -i {{ site.brand.name | downcase }}_amd64.rpm" readonly>
+                  <input type="text" class="form-control font-monospace bg-dark text-light border-0" name="linux-command-3" value="sudo rpm -i {{ site.brand.name | downcase }}_amd64.rpm" readonly aria-labelledby="linux-fedora-label">
                   <button type="button" class="btn btn-outline-adaptive copy-command-btn">
                     {% uj_icon "copy", "me-2" %}
                     <span class="button-text d-none d-sm-inline">Copy</span>