maverick-wave 5.30.0 → 5.32.0

package/src/partials/history-container.html

@@ -1,67 +0,0 @@
-<div class="mw-timeline-simple mw-my-6">
-  <div class="mw-timeline-simple-step mw-active">
-    <div class="mw-timeline-simple-date">2026-09-11</div>
-    <div class="mw-timeline-simple-content">
-      <div class="mw-card mw-card-simple">
-        <h3 class="mw-card-title">v5.0.0</h3>
-        <p>
-          Everything the framework ships moved into a cascade layer, so vendor
-          CSS loaded next to it stops winning selector fights by accident. The
-          source got a full pass while it was open anyway.
-        </p>
-      </div>
-    </div>
-  </div>
-
-  <div class="mw-timeline-simple-step">
-    <div class="mw-timeline-simple-date">2026-08-19</div>
-    <div class="mw-timeline-simple-content">
-      <div class="mw-card mw-card-simple">
-        <h3 class="mw-card-title">v4.0.0</h3>
-        <p>
-          The calendar arrived in three shapes - month, week and compact - and
-          pagination was reframed to sit next to it without looking borrowed.
-        </p>
-      </div>
-    </div>
-  </div>
-
-  <div class="mw-timeline-simple-step">
-    <div class="mw-timeline-simple-date">2026-04-04</div>
-    <div class="mw-timeline-simple-content">
-      <div class="mw-card mw-card-simple">
-        <h3 class="mw-card-title">v3.0.0</h3>
-        <p>
-          Claude Code joined the workflow: more components, more form elements,
-          and a pile of small fixes it spotted along the way.
-        </p>
-      </div>
-    </div>
-  </div>
-
-  <div class="mw-timeline-simple-step">
-    <div class="mw-timeline-simple-date">2025-06-09</div>
-    <div class="mw-timeline-simple-content">
-      <div class="mw-card mw-card-simple">
-        <h3 class="mw-card-title">v2.0.0</h3>
-        <p>
-          The grid was rebuilt from scratch, with modals, pagination, item lists
-          and the first real form layer put on top of it.
-        </p>
-      </div>
-    </div>
-  </div>
-
-  <div class="mw-timeline-simple-step">
-    <div class="mw-timeline-simple-date">2025-04-30</div>
-    <div class="mw-timeline-simple-content">
-      <div class="mw-card mw-card-simple">
-        <h3 class="mw-card-title">v1.0.0</h3>
-        <p>
-          Let's say initial release - grid, header and a first handful of
-          components, published as they were.
-        </p>
-      </div>
-    </div>
-  </div>
-</div>

package/src/partials/home-container.html

@@ -1,31 +0,0 @@
-<div class="mw-parallax-media"></div>
-
-<div class="mw-hero">
-  <div class="mw-home mw-home-content-fade">
-    <div class="mw-home-text">
-      <span class="mw-hero-badge version-corner">
-        <span class="mw-hero-badge-dot"></span>
-        v{{VERSION}}
-      </span>
-      <h1>Maverick<span class="mw-text-primary">Wave</span></h1>
-      <p>
-        A CSS framework in two files. Grid, 48 components, dark mode - no build
-        step, no dependencies.
-      </p>
-    </div>
-
-    <div class="mw-d-flex mw-gap-8 mw-justify-center">
-      <a href="#get-started" class="mw-btn mw-btn-primary mw-btn-lg">
-        Get Started
-      </a>
-      <a href="#documentation" class="mw-btn mw-btn-outline mw-btn-lg">
-        Documentation
-      </a>
-    </div>
-  </div>
-</div>
-
-<a class="mw-scroll-hint" href="#highlights">
-  More
-  <i class="fas fa-chevron-down"></i>
-</a>

package/src/partials/html-lists-container.html

@@ -1,63 +0,0 @@
-<h3 class="mw-section-subtitle">HTML Lists</h3>
-<p class="mw-text-muted mw-text-measure">
-  The plain <code>ul</code> and <code>ol</code> the framework styles, for prose.
-  Anything meant to be used rather than read - selectable rows, menus - belongs
-  in the item lists instead.
-</p>
-
-<div class="mw-grid-2-lg">
-  <div class="mw-card mw-card-simple">
-    <h4 class="mw-mb-2">Basic List</h4>
-    <ul class="mw-list">
-      <li>First item</li>
-      <li>Second item</li>
-      <li>
-        Third item
-        <ul class="mw-list">
-          <li>Nested item 1</li>
-          <li>Nested item 2</li>
-        </ul>
-      </li>
-      <li>Fourth item</li>
-    </ul>
-
-    <h4 class="mw-mb-2">Unstyled List</h4>
-    <ul class="mw-list mw-list-unstyled">
-      <li>First item</li>
-      <li>Second item</li>
-      <li>Third item</li>
-      <li>Fourth item</li>
-    </ul>
-
-    <h4 class="mw-mb-2">Inline List</h4>
-    <ul class="mw-list mw-list-inline">
-      <li>First item</li>
-      <li>Second item</li>
-      <li>Third item</li>
-      <li>Fourth item</li>
-    </ul>
-  </div>
-
-  <div class="mw-card mw-card-simple">
-    <h4 class="mw-mb-2">Dot List</h4>
-    <ul class="mw-list mw-list-dot">
-      <li>First item with dot</li>
-      <li>Second item with dot</li>
-      <li>Third item with dot</li>
-    </ul>
-
-    <h4 class="mw-mb-2">Check List</h4>
-    <ul class="mw-list mw-list-check">
-      <li>First completed item</li>
-      <li>Second completed item</li>
-      <li>Third completed item</li>
-    </ul>
-
-    <h4 class="mw-mb-2">Links List</h4>
-    <ul class="mw-list mw-list-link">
-      <li><a>First link</a></li>
-      <li><a>Second link</a></li>
-      <li><a>Third link</a></li>
-    </ul>
-  </div>
-</div>

package/src/partials/info-container.html

@@ -1,104 +0,0 @@
-<h3 class="mw-section-subtitle">Info Badges & Counters</h3>
-<p class="mw-text-muted mw-text-measure">
-  A small solid marker for a status, a label or a count, down to a mini form
-  that fits inside a table cell. A tag names something; this one flags it.
-</p>
-
-<h4 class="mw-mb-2">Pill Badges</h4>
-<div class="mw-card mw-card-simple">
-  <div class="mw-d-flex mw-flex-wrap mw-items-center mw-gap-3">
-    <span class="mw-info">Default</span>
-    <span class="mw-info mw-info-sm">Small</span>
-    <span class="mw-info mw-info-lg">Large</span>
-    <span class="mw-info mw-info-xl">XL</span>
-  </div>
-</div>
-
-<h4 class="mw-mb-2 mw-mt-5">Color Badges (with Border)</h4>
-<div class="mw-card mw-card-simple">
-  <div class="mw-d-flex mw-flex-wrap mw-items-center mw-gap-3">
-    <span class="mw-info mw-info-primary">Primary</span>
-    <span class="mw-info mw-info-secondary">Secondary</span>
-    <span class="mw-info mw-info-info">Info</span>
-    <span class="mw-info mw-info-success">Success</span>
-    <span class="mw-info mw-info-warning">Warning</span>
-    <span class="mw-info mw-info-danger">Danger</span>
-  </div>
-</div>
-
-<h4 class="mw-mb-2 mw-mt-5">Block</h4>
-<div class="mw-card mw-card-simple">
-  <div class="mw-info mw-info-primary mw-info-block">
-    <strong>The same frame, carrying a paragraph</strong>
-    <span
-      >The base is built for a short figure and centres it in a narrow column.
-      The block variant ranges its text left up to a measure, sets it in body
-      weight and leading, and stays put under the pointer - for a note, a
-      disclaimer, or a short explanation beside the thing it explains.</span
-    >
-  </div>
-</div>
-
-<h4 class="mw-mb-2 mw-mt-5">Counters</h4>
-<div class="mw-card mw-card-simple">
-  <div class="mw-d-flex mw-flex-wrap mw-items-center mw-gap-3">
-    <div class="mw-info mw-info-counter">
-      <div class="mw-info-value">5</div>
-      <div class="mw-info-label">Projects Completed</div>
-    </div>
-    <div class="mw-info mw-info-counter mw-info-primary">
-      <div class="mw-info-value">24/7</div>
-      <div class="mw-info-label">Support</div>
-    </div>
-    <div class="mw-info mw-info-counter mw-info-success mw-info-lg">
-      <div class="mw-info-value">150</div>
-      <div class="mw-info-label">Users</div>
-    </div>
-    <div class="mw-info mw-info-counter mw-info-danger mw-info-sm">
-      <div class="mw-info-value">3</div>
-      <div class="mw-info-label">Alerts</div>
-    </div>
-  </div>
-</div>
-
-<h4 class="mw-mb-2 mw-mt-5">Mini Info Badges (Sizes)</h4>
-<div class="mw-card mw-card-simple">
-  <div class="mw-d-flex mw-flex-wrap mw-items-center mw-gap-4">
-    <span class="mw-info-mini mw-info-mini-sm mw-info-mini-primary">
-      <i class="fas fa-check"></i>
-    </span>
-
-    <span class="mw-info-mini mw-info-mini-primary">
-      <i class="fas fa-check"></i>
-    </span>
-
-    <span class="mw-info-mini mw-info-mini-lg mw-info-mini-primary">
-      <i class="fas fa-check"></i>
-    </span>
-
-    <span class="mw-info-mini mw-info-mini-xl mw-info-mini-primary">
-      <i class="fas fa-check"></i>
-    </span>
-  </div>
-</div>
-
-<h4 class="mw-mb-2 mw-mt-5">Mini Info Badges (Colors)</h4>
-<div class="mw-card mw-card-simple">
-  <div class="mw-d-flex mw-flex-wrap mw-items-center mw-gap-4">
-    <span class="mw-info-mini mw-info-mini-primary">
-      <i class="fas fa-info"></i>
-    </span>
-    <span class="mw-info-mini mw-info-mini-secondary"></span>
-    <span class="mw-info-mini mw-info-mini-info">
-      <i class="fas fa-question"></i>
-    </span>
-    <span class="mw-info-mini mw-info-mini-success">
-      <i class="fas fa-check"></i>
-    </span>
-    <span class="mw-info-mini mw-info-mini-warning"></span>
-    <span class="mw-info-mini mw-info-mini-danger">
-      <i class="fas fa-times"></i>
-    </span>
-    <span class="mw-info-mini"></span>
-  </div>
-</div>

package/src/partials/input-group-container.html

@@ -1,299 +0,0 @@
-<h3 class="mw-section-subtitle">Input Group</h3>
-<p class="mw-text-muted mw-text-measure">
-  A field with something welded to its edge - a unit, an icon, a button. Put the
-  size modifier on the group and it reaches the field inside, and the whole
-  group takes one focus ring rather than three.
-</p>
-
-<div class="mw-grid-2 mw-gap-6">
-  <!-- LEFT: Prefix & Suffix examples -->
-  <div>
-    <h3 class="mw-card-title mw-mb-4">Prefix & Suffix</h3>
-    <div class="mw-card mw-card-simple">
-      <!-- Icon prefix (search) -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-search">Search</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-search"></i
-          ></span>
-          <input
-            id="ig-search"
-            type="text"
-            class="mw-input"
-            placeholder="Search projects..."
-          />
-        </div>
-      </div>
-
-      <!-- Text prefix (URL) -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-website">Website</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix">https://</span>
-          <input
-            id="ig-website"
-            type="text"
-            class="mw-input"
-            placeholder="your-domain.com"
-          />
-        </div>
-      </div>
-
-      <!-- Currency prefix + suffix -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-price">Price</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-euro-sign"></i
-          ></span>
-          <input
-            id="ig-price"
-            type="text"
-            inputmode="decimal"
-            class="mw-input mw-input-numeric"
-            placeholder="0,00"
-            value="1.204,50"
-          />
-          <span class="mw-input-group-suffix">EUR</span>
-        </div>
-      </div>
-
-      <!-- Suffix icon -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-email">Email</label>
-        <div class="mw-input-group">
-          <input
-            id="ig-email"
-            type="email"
-            class="mw-input"
-            placeholder="user@example.com"
-          />
-          <span class="mw-input-group-suffix"
-            ><i class="fas fa-envelope"></i
-          ></span>
-        </div>
-      </div>
-
-      <!-- @ prefix -->
-      <div class="mw-field">
-        <label class="mw-field-label" for="ig-username">Username</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix">@</span>
-          <input
-            id="ig-username"
-            type="text"
-            class="mw-input"
-            placeholder="your_handle"
-          />
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- RIGHT: With buttons & sizes -->
-  <div>
-    <h3 class="mw-card-title mw-mb-4">With Buttons & Sizes</h3>
-    <div class="mw-card mw-card-simple">
-      <!-- Input + search button -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-search-btn"
-          >Search with action</label
-        >
-        <div class="mw-input-group">
-          <input
-            id="ig-search-btn"
-            type="text"
-            class="mw-input"
-            placeholder="Keyword..."
-          />
-          <button
-            type="button"
-            class="mw-btn mw-btn-primary"
-            aria-label="Search"
-          >
-            <i class="fas fa-search"></i>
-          </button>
-        </div>
-      </div>
-
-      <!-- Copy URL -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-share">Share link</label>
-        <div class="mw-input-group">
-          <input
-            id="ig-share"
-            type="text"
-            class="mw-input"
-            value="https://maverick-wave.m1well.com"
-            readonly
-          />
-          <button
-            type="button"
-            class="mw-btn mw-btn-outline"
-            data-mw-copy=""
-            aria-label="Copy link"
-          >
-            <i class="fas fa-copy"></i>
-          </button>
-        </div>
-      </div>
-
-      <!-- Small size -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-tag">Small</label>
-        <div class="mw-input-group mw-input-group-sm">
-          <span class="mw-input-group-prefix"><i class="fas fa-tag"></i></span>
-          <input
-            id="ig-tag"
-            type="text"
-            class="mw-input mw-input-sm"
-            placeholder="Tag name"
-          />
-        </div>
-      </div>
-
-      <!-- Large size -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-password">Large</label>
-        <div class="mw-input-group mw-input-group-lg">
-          <span class="mw-input-group-prefix"><i class="fas fa-lock"></i></span>
-          <input
-            id="ig-password"
-            type="password"
-            class="mw-input mw-input-lg"
-            placeholder="Password"
-          />
-        </div>
-      </div>
-
-      <!-- Prefix + Suffix button -->
-      <div class="mw-field">
-        <label class="mw-field-label" for="ig-message">Message</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-comment"></i
-          ></span>
-          <input
-            id="ig-message"
-            type="text"
-            class="mw-input"
-            placeholder="Type a message..."
-          />
-          <button
-            type="button"
-            class="mw-btn mw-btn-primary"
-            aria-label="Send message"
-          >
-            <i class="fas fa-paper-plane"></i>
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-
-<div class="mw-grid-2 mw-gap-6 mw-mt-6">
-  <!-- LEFT: Date & DateTime -->
-  <div>
-    <h3 class="mw-card-title mw-mb-4">Date & DateTime</h3>
-    <div class="mw-card mw-card-simple">
-      <!-- Date -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-date">Date</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-calendar-days"></i
-          ></span>
-          <input id="ig-date" type="date" class="mw-input" />
-        </div>
-      </div>
-
-      <!-- DateTime-local -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-datetime">Date & Time</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-calendar-days"></i
-          ></span>
-          <input id="ig-datetime" type="datetime-local" class="mw-input" />
-        </div>
-      </div>
-
-      <!-- Date small -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-date-sm">Date (small)</label>
-        <div class="mw-input-group mw-input-group-sm">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-calendar-days"></i
-          ></span>
-          <input id="ig-date-sm" type="date" class="mw-input mw-input-sm" />
-        </div>
-      </div>
-
-      <!-- Date large -->
-      <div class="mw-field">
-        <label class="mw-field-label" for="ig-date-lg">Date (large)</label>
-        <div class="mw-input-group mw-input-group-lg">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-calendar-days"></i
-          ></span>
-          <input id="ig-date-lg" type="date" class="mw-input mw-input-lg" />
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- RIGHT: Time -->
-  <div>
-    <h3 class="mw-card-title mw-mb-4">Time</h3>
-    <div class="mw-card mw-card-simple">
-      <!-- Time default -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-time">Time</label>
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-clock"></i
-          ></span>
-          <input id="ig-time" type="time" class="mw-input" />
-        </div>
-      </div>
-
-      <!-- Time with hint -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label mw-required" for="ig-time-hint"
-          >Start time</label
-        >
-        <div class="mw-input-group">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-clock"></i
-          ></span>
-          <input id="ig-time-hint" type="time" class="mw-input" />
-        </div>
-        <span class="mw-field-hint">Select the meeting start time.</span>
-      </div>
-
-      <!-- Time small -->
-      <div class="mw-field mw-mb-4">
-        <label class="mw-field-label" for="ig-time-sm">Time (small)</label>
-        <div class="mw-input-group mw-input-group-sm">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-clock"></i
-          ></span>
-          <input id="ig-time-sm" type="time" class="mw-input mw-input-sm" />
-        </div>
-      </div>
-
-      <!-- Time large -->
-      <div class="mw-field">
-        <label class="mw-field-label" for="ig-time-lg">Time (large)</label>
-        <div class="mw-input-group mw-input-group-lg">
-          <span class="mw-input-group-prefix"
-            ><i class="fas fa-clock"></i
-          ></span>
-          <input id="ig-time-lg" type="time" class="mw-input mw-input-lg" />
-        </div>
-      </div>
-    </div>
-  </div>
-</div>