maverick-wave 5.30.0 → 5.31.0

package/src/partials/spinners-container.html

@@ -1,96 +0,0 @@
-<h3 class="mw-section-subtitle">Loading Spinners</h3>
-<p class="mw-text-muted mw-text-measure">
-  Three shapes for the same job. Each one needs its shape class:
-  <code>mw-spinner-primary</code> on its own renders nothing at all.
-</p>
-
-<h3 class="mw-mt-4">Basic Spinners</h3>
-<div class="mw-grid-3 mw-mt-4">
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Border Spinner</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border"></div>
-    </div>
-  </div>
-
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Dots Spinner</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-dots">
-        <div></div>
-        <div></div>
-        <div></div>
-      </div>
-    </div>
-  </div>
-
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Dual Ring Spinner</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-dual-ring"></div>
-    </div>
-  </div>
-</div>
-
-<h3 class="mw-mt-6">Spinner Sizes</h3>
-<div class="mw-grid-3 mw-mt-4">
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Small</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border mw-spinner-sm"></div>
-    </div>
-  </div>
-
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Default</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border"></div>
-    </div>
-  </div>
-
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Large</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border mw-spinner-lg"></div>
-    </div>
-  </div>
-</div>
-
-<h3 class="mw-mt-6">Spinner Colors</h3>
-<div class="mw-grid-3 mw-mt-4">
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Default</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border"></div>
-    </div>
-  </div>
-
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Primary</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border mw-spinner-primary"></div>
-    </div>
-  </div>
-
-  <div class="mw-card mw-card-simple" style="height: 250px">
-    <h4 class="mw-mb-2">Secondary</h4>
-    <div class="mw-spinner-container">
-      <div class="mw-spinner-border mw-spinner-secondary"></div>
-    </div>
-  </div>
-</div>
-
-<h3 class="mw-mt-6">Spinner in Context</h3>
-<div class="mw-grid-2 mw-mt-4">
-  <div class="mw-card mw-card-simple" style="position: relative; height: 280px">
-    <div class="mw-spinner-container-overlay">
-      <div class="mw-spinner-dual-ring mw-spinner-primary"></div>
-    </div>
-    <h4 class="mw-mb-2">Overlay Spinner</h4>
-    <p>This card demonstrates a loading overlay with a spinner.</p>
-    <p>
-      The content remains visible but appears disabled during loading states,
-      providing clear visual feedback to users while data is being processed.
-    </p>
-  </div>
-</div>

package/src/partials/stepper-container.html

@@ -1,111 +0,0 @@
-<h3 class="mw-section-subtitle">Stepper</h3>
-<p class="mw-text-muted mw-text-measure">
-  A process with a known number of steps and a current one. Horizontal where
-  there is width for it, vertical where the labels need the room.
-</p>
-
-<div class="mw-grid-2 mw-gap-6">
-  <!-- LEFT: Horizontal steppers -->
-  <div>
-    <h3 class="mw-card-title mw-mb-4">Horizontal</h3>
-    <div class="mw-card mw-card-simple">
-      <h4 class="mw-text-medium mw-mb-4">In Progress (step 2 active)</h4>
-      <div class="mw-stepper mw-mb-5">
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator mw-done">
-            <i class="fas fa-check"></i>
-          </div>
-          <span class="mw-stepper-label mw-done">Account</span>
-        </div>
-        <div class="mw-stepper-connector mw-done"></div>
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator mw-active">2</div>
-          <span class="mw-stepper-label mw-active">Details</span>
-        </div>
-        <div class="mw-stepper-connector"></div>
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator">3</div>
-          <span class="mw-stepper-label">Payment</span>
-        </div>
-        <div class="mw-stepper-connector"></div>
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator">4</div>
-          <span class="mw-stepper-label">Confirm</span>
-        </div>
-      </div>
-
-      <h4 class="mw-text-medium mw-mb-4">Completed</h4>
-      <div class="mw-stepper">
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator mw-done">
-            <i class="fas fa-check"></i>
-          </div>
-          <span class="mw-stepper-label mw-done">Setup</span>
-        </div>
-        <div class="mw-stepper-connector mw-done"></div>
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator mw-done">
-            <i class="fas fa-check"></i>
-          </div>
-          <span class="mw-stepper-label mw-done">Review</span>
-        </div>
-        <div class="mw-stepper-connector mw-done"></div>
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator mw-done">
-            <i class="fas fa-check"></i>
-          </div>
-          <span class="mw-stepper-label mw-done">Deploy</span>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- RIGHT: Vertical stepper -->
-  <div>
-    <h3 class="mw-card-title mw-mb-4">Vertical</h3>
-    <div class="mw-card mw-card-simple">
-      <div class="mw-stepper-vertical">
-        <div class="mw-stepper-step mw-done">
-          <div class="mw-stepper-indicator mw-done">
-            <i class="fas fa-check"></i>
-          </div>
-          <div class="mw-stepper-content">
-            <p class="mw-stepper-content-title">Project Initialized</p>
-            <p class="mw-stepper-content-desc">
-              Repository created and base structure set up.
-            </p>
-          </div>
-        </div>
-        <div class="mw-stepper-step mw-done">
-          <div class="mw-stepper-indicator mw-done">
-            <i class="fas fa-check"></i>
-          </div>
-          <div class="mw-stepper-content">
-            <p class="mw-stepper-content-title">Dependencies Installed</p>
-            <p class="mw-stepper-content-desc">
-              All npm packages resolved successfully.
-            </p>
-          </div>
-        </div>
-        <div class="mw-stepper-step mw-active">
-          <div class="mw-stepper-indicator mw-active">3</div>
-          <div class="mw-stepper-content">
-            <p class="mw-stepper-content-title">Running Tests</p>
-            <p class="mw-stepper-content-desc">
-              Unit and integration tests in progress...
-            </p>
-          </div>
-        </div>
-        <div class="mw-stepper-step">
-          <div class="mw-stepper-indicator">4</div>
-          <div class="mw-stepper-content">
-            <p class="mw-stepper-content-title">Deploy to Production</p>
-            <p class="mw-stepper-content-desc">
-              Awaiting test completion before release.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>

package/src/partials/stories-container.html

@@ -1,182 +0,0 @@
-<h3 class="mw-section-subtitle">Story Archive</h3>
-<p class="mw-text-muted mw-text-measure">
-  Stories that stay. A circle opens its story full screen on a phone and
-  phone-shaped on a desktop; every frame shows for five seconds and a bar at the
-  top counts them off - that part is CSS alone. A few lines of script add the
-  rest: a tap on the right moves on, on the left goes back (arrows under a
-  mouse), a video starts when its frame comes up, the story closes at its end.
-  Holding a finger on it or the pause button stops it; Escape, the cross or a
-  click beside it close it. With reduced motion set in the system nothing plays
-  by itself - the frames become a strip to swipe through instead.
-</p>
-
-<div class="mw-stories" aria-label="Story archive">
-  <button type="button" class="mw-story" popovertarget="story-coast">
-    <span class="mw-story-cover"
-      ><img src="images/story-beach.svg" alt=""
-    /></span>
-    <span class="mw-story-label">Coast</span>
-  </button>
-  <div class="mw-story-reel" id="story-coast" popover>
-    <div class="mw-story-reel-head">
-      <span>Coast</span>
-      <label class="mw-overlay-btn mw-story-reel-pause"
-        ><input type="checkbox" aria-label="Pause"
-      /></label>
-      <button
-        type="button"
-        class="mw-overlay-btn"
-        popovertarget="story-coast"
-        popovertargetaction="hide"
-        aria-label="Close"
-      >
-        &#120299;
-      </button>
-    </div>
-    <img
-      src="images/story-beach.svg"
-      alt="Beach at sunset with waves running up the sand"
-      loading="lazy"
-    />
-    <video
-      src="media/story-sunrise.mp4"
-      poster="media/story-sunrise.jpg"
-      autoplay
-      muted
-      loop
-      playsinline
-    ></video>
-    <img
-      src="images/photo-lighthouse.svg"
-      alt="Lighthouse on a cliff at dusk"
-      loading="lazy"
-    />
-  </div>
-  <button type="button" class="mw-story" popovertarget="story-nights">
-    <span class="mw-story-cover"
-      ><img src="images/story-stars.svg" alt=""
-    /></span>
-    <span class="mw-story-label">Nights</span>
-  </button>
-  <div class="mw-story-reel" id="story-nights" popover>
-    <div class="mw-story-reel-head">
-      <span>Nights</span>
-      <label class="mw-overlay-btn mw-story-reel-pause"
-        ><input type="checkbox" aria-label="Pause"
-      /></label>
-      <button
-        type="button"
-        class="mw-overlay-btn"
-        popovertarget="story-nights"
-        popovertargetaction="hide"
-        aria-label="Close"
-      >
-        &#120299;
-      </button>
-    </div>
-    <img
-      src="images/story-stars.svg"
-      alt="Tent glowing under the milky way"
-      loading="lazy"
-    />
-    <img
-      src="images/photo-tower.svg"
-      alt="Television tower above the city at night"
-      loading="lazy"
-    />
-  </div>
-  <button type="button" class="mw-story" popovertarget="story-north">
-    <span class="mw-story-cover"
-      ><img src="images/story-aurora.svg" alt=""
-    /></span>
-    <span class="mw-story-label">North</span>
-  </button>
-  <div class="mw-story-reel" id="story-north" popover>
-    <div class="mw-story-reel-head">
-      <span>North</span>
-      <label class="mw-overlay-btn mw-story-reel-pause"
-        ><input type="checkbox" aria-label="Pause"
-      /></label>
-      <button
-        type="button"
-        class="mw-overlay-btn"
-        popovertarget="story-north"
-        popovertargetaction="hide"
-        aria-label="Close"
-      >
-        &#120299;
-      </button>
-    </div>
-    <img
-      src="images/story-aurora.svg"
-      alt="Northern lights over a snowy forest"
-      loading="lazy"
-    />
-    <img
-      src="images/photo-peak.svg"
-      alt="Snowy mountain peak under a starry sky"
-      loading="lazy"
-    />
-  </div>
-  <button type="button" class="mw-story" popovertarget="story-hikes">
-    <span class="mw-story-cover"
-      ><img src="images/photo-forest-path.svg" alt=""
-    /></span>
-    <span class="mw-story-label">Hikes</span>
-  </button>
-  <div class="mw-story-reel" id="story-hikes" popover>
-    <div class="mw-story-reel-head">
-      <span>Hikes</span>
-      <label class="mw-overlay-btn mw-story-reel-pause"
-        ><input type="checkbox" aria-label="Pause"
-      /></label>
-      <button
-        type="button"
-        class="mw-overlay-btn"
-        popovertarget="story-hikes"
-        popovertargetaction="hide"
-        aria-label="Close"
-      >
-        &#120299;
-      </button>
-    </div>
-    <img
-      src="images/photo-forest-path.svg"
-      alt="Path through a sunlit forest"
-      loading="lazy"
-    />
-    <img
-      src="images/photo-waterfall.svg"
-      alt="Waterfall between mossy cliffs"
-      loading="lazy"
-    />
-  </div>
-  <button type="button" class="mw-story" popovertarget="story-sky">
-    <span class="mw-story-cover"
-      ><img src="images/photo-balloon.svg" alt=""
-    /></span>
-    <span class="mw-story-label">Up high</span>
-  </button>
-  <div class="mw-story-reel" id="story-sky" popover>
-    <div class="mw-story-reel-head">
-      <span>Up high</span>
-      <label class="mw-overlay-btn mw-story-reel-pause"
-        ><input type="checkbox" aria-label="Pause"
-      /></label>
-      <button
-        type="button"
-        class="mw-overlay-btn"
-        popovertarget="story-sky"
-        popovertargetaction="hide"
-        aria-label="Close"
-      >
-        &#120299;
-      </button>
-    </div>
-    <img
-      src="images/photo-balloon.svg"
-      alt="Hot air balloon in a morning sky"
-      loading="lazy"
-    />
-  </div>
-</div>