maverick-wave 5.30.0 → 5.31.0

package/src/partials/mosaic-container.html

@@ -1,173 +0,0 @@
-<h3 class="mw-section-subtitle">Mosaic</h3>
-<p class="mw-text-muted mw-text-measure">
-  Photos of any shape in one grid. The script reads each photo's proportions
-  from its <code>width</code> and <code>height</code> and gives it a tile to
-  match - wide for landscape, tall for portrait, square for the rest - and the
-  smaller tiles fill the holes. The tile crops, the lightbox does not: a tap
-  opens the photo whole with its caption, and a swipe moves on to the next one.
-  <code>mw-mosaic-gap-sm</code> and <code>mw-mosaic-gap-lg</code> change the
-  gaps.
-</p>
-
-<div class="mw-segmented mw-mb-5" data-modifier-demo="mosaic-demo">
-  <button
-    type="button"
-    class="mw-segmented-item"
-    data-modifier="mw-mosaic-gap-sm"
-  >
-    Gap sm
-  </button>
-  <button type="button" class="mw-segmented-item mw-active" data-modifier="">
-    Default
-  </button>
-  <button
-    type="button"
-    class="mw-segmented-item"
-    data-modifier="mw-mosaic-gap-lg"
-  >
-    Gap lg
-  </button>
-</div>
-
-<div class="mw-mosaic" id="mosaic-demo">
-  <figure class="mw-mosaic-item mw-mosaic-big">
-    <a href="images/gallery-mountain.svg">
-      <img
-        src="images/gallery-mountain.svg"
-        alt="Mountain range at sunrise"
-        width="800"
-        height="450"
-        loading="lazy"
-      />
-    </a>
-    <figcaption>
-      First light on the ridge. <code>mw-mosaic-big</code> makes a photo the
-      centrepiece.
-    </figcaption>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/photo-peak.svg">
-      <img
-        src="images/photo-peak.svg"
-        alt="Snowy mountain peak under a starry sky"
-        width="600"
-        height="800"
-        loading="lazy"
-      />
-    </a>
-    <figcaption>Summit night, 3,000 metres up.</figcaption>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/photo-balloon.svg">
-      <img
-        src="images/photo-balloon.svg"
-        alt="Hot air balloon in a morning sky"
-        width="800"
-        height="800"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/photo-palm.svg">
-      <img
-        src="images/photo-palm.svg"
-        alt="Palm tree against a sunset over the sea"
-        width="800"
-        height="800"
-        loading="lazy"
-      />
-    </a>
-    <figcaption>The last evening on the island.</figcaption>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/gallery-lake.svg">
-      <img
-        src="images/gallery-lake.svg"
-        alt="Peaceful lake"
-        width="800"
-        height="450"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/photo-tower.svg">
-      <img
-        src="images/photo-tower.svg"
-        alt="Television tower above the city at night"
-        width="600"
-        height="800"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/photo-waterfall.svg">
-      <img
-        src="images/photo-waterfall.svg"
-        alt="Waterfall between mossy cliffs"
-        width="600"
-        height="800"
-        loading="lazy"
-      />
-    </a>
-    <figcaption>Two hours up the gorge, and worth every step of it.</figcaption>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/gallery-city.svg">
-      <img
-        src="images/gallery-city.svg"
-        alt="City skyline at night"
-        width="800"
-        height="450"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/photo-lighthouse.svg">
-      <img
-        src="images/photo-lighthouse.svg"
-        alt="Lighthouse on a cliff at dusk"
-        width="600"
-        height="800"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/story-aurora.svg">
-      <img
-        src="images/story-aurora.svg"
-        alt="Northern lights over a snowy forest"
-        width="720"
-        height="1280"
-        loading="lazy"
-      />
-    </a>
-    <figcaption>Minus eighteen degrees. Nobody minded.</figcaption>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/gallery-desert.svg">
-      <img
-        src="images/gallery-desert.svg"
-        alt="Desert dunes"
-        width="800"
-        height="450"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-  <figure class="mw-mosaic-item">
-    <a href="images/gallery-snow.svg">
-      <img
-        src="images/gallery-snow.svg"
-        alt="Snowy hills"
-        width="800"
-        height="450"
-        loading="lazy"
-      />
-    </a>
-  </figure>
-</div>

package/src/partials/page-header-container.html

@@ -1,78 +0,0 @@
-<h3 class="mw-section-subtitle">Page Header</h3>
-
-<p class="mw-text-muted">
-  The start of a content page: title and subtitle on the left, actions on the
-  right, wrapping when it gets tight. The counterpart to
-  <code>mw-section-head</code>, which opens a section of a landing page rather
-  than a page of an application.
-</p>
-
-<div class="mw-grid-1">
-  <div class="mw-card mw-card-simple mw-mb-6">
-    <h4 class="mw-mb-4">With Actions</h4>
-    <header class="mw-page-header">
-      <div>
-        <h2>Blog Posts</h2>
-        <p>14 entries &middot; 3 drafts</p>
-      </div>
-      <div class="mw-page-header-actions">
-        <button type="button" class="mw-btn mw-btn-outline mw-btn-sm">
-          <i class="fas fa-filter"></i>
-          Filter
-        </button>
-        <button type="button" class="mw-btn mw-btn-primary mw-btn-sm">
-          <i class="fas fa-plus"></i>
-          New Post
-        </button>
-      </div>
-    </header>
-    <p class="mw-text-muted">Page content follows here.</p>
-  </div>
-
-  <div class="mw-card mw-card-simple mw-mb-6">
-    <h4 class="mw-mb-4">Combined with Meta Info</h4>
-    <p class="mw-text-muted mw-text-sm mw-mb-3">
-      The counters fit naturally underneath the title instead of a subtitle
-      line.
-    </p>
-    <header class="mw-page-header">
-      <div>
-        <h2>Blog Posts</h2>
-        <div class="mw-meta-header">
-          <div class="mw-meta-item">
-            <i class="fas fa-list"></i>
-            <span>Amount: 14</span>
-          </div>
-          <div class="mw-meta-item">
-            <i class="fas fa-pen"></i>
-            <span>Drafts: 3</span>
-          </div>
-          <div class="mw-meta-item">
-            <i class="fas fa-eye"></i>
-            <span>Published: 11</span>
-          </div>
-        </div>
-      </div>
-      <div class="mw-page-header-actions">
-        <button type="button" class="mw-btn mw-btn-primary mw-btn-sm">
-          <i class="fas fa-plus"></i>
-          New Post
-        </button>
-      </div>
-    </header>
-  </div>
-
-  <div class="mw-card mw-card-simple">
-    <h4 class="mw-mb-4">Without a Separator</h4>
-    <p class="mw-text-muted mw-text-sm mw-mb-3">
-      <code>mw-page-header-plain</code> drops the bottom rule for pages that
-      bring their own.
-    </p>
-    <header class="mw-page-header mw-page-header-plain">
-      <div>
-        <h2>Settings</h2>
-        <p>Manage your account</p>
-      </div>
-    </header>
-  </div>
-</div>

package/src/partials/pagination-container.html

@@ -1,64 +0,0 @@
-<h3 class="mw-section-subtitle">Simple Pagination</h3>
-<p class="mw-text-muted mw-text-measure">
-  The same frame as a calendar - an arrow on each side of the title, content
-  below - but the body is yours. Not a page-number list; the paging itself is
-  your job, <code>mw-pagination-loading</code> dims the body while the next page
-  is on its way.
-</p>
-
-<div class="mw-pagination mw-mb-6" id="weekPagination">
-  <div class="mw-pagination-header">
-    <button
-      type="button"
-      class="mw-btn mw-btn-outline mw-btn-sm mw-pagination-nav"
-      data-pagination-nav="-1"
-      aria-label="Previous week"
-    >
-      <i class="fas fa-chevron-left"></i>
-    </button>
-
-    <div class="mw-pagination-title" aria-live="polite">Week 10</div>
-
-    <button
-      type="button"
-      class="mw-btn mw-btn-outline mw-btn-sm mw-pagination-nav"
-      data-pagination-nav="1"
-      aria-label="Next week"
-    >
-      <i class="fas fa-chevron-right"></i>
-    </button>
-  </div>
-
-  <div class="mw-pagination-content">
-    <h4 class="mw-mb-2">Week 10 Content</h4>
-    <p class="mw-text-muted">
-      Put anything in here - text, a form, a table, a chart. The frame only
-      gives it a title and two arrows.
-    </p>
-  </div>
-</div>
-
-<script>
-  // Showcase only: the framework ships no pagination JS, this just proves the
-  // two arrows are ordinary buttons
-  (function () {
-    const pager = document.getElementById('weekPagination');
-    if (!pager) return;
-
-    const title = pager.querySelector('.mw-pagination-title');
-    const heading = pager.querySelector('.mw-pagination-content h4');
-    let week = 10;
-
-    pager.addEventListener('click', (event) => {
-      const nav = event.target.closest('[data-pagination-nav]');
-      if (!nav) return;
-
-      week = Math.min(
-        52,
-        Math.max(1, week + Number(nav.dataset.paginationNav))
-      );
-      title.textContent = 'Week ' + week;
-      heading.textContent = 'Week ' + week + ' Content';
-    });
-  })();
-</script>