maverick-wave 5.29.0 → 5.31.0

package/src/partials/kanban-container.html

@@ -1,459 +0,0 @@
-<h3 class="mw-section-subtitle">Kanban</h3>
-<p class="mw-text-muted mw-text-measure">
-  A board is a <code>mw-kanban</code> with one <code>mw-kanban-column</code> per
-  status, a ticket a plain <code>mw-card</code> with
-  <code>mw-kanban-card</code> on top. The priority is the regular
-  <code>mw-card-ribbon</code> and brings its colour along on its own.
-  <code>mw-kanban-compact</code> tightens the padding and clamps the description
-  to two lines instead of four - for boards with many lanes or a sidebar next to
-  them.
-</p>
-
-<div class="mw-segmented mw-mb-5" data-modifier-demo="kanban-demo">
-  <button type="button" class="mw-segmented-item mw-active" data-modifier="">
-    Default
-  </button>
-  <button
-    type="button"
-    class="mw-segmented-item"
-    data-modifier="mw-kanban-compact"
-  >
-    Compact
-  </button>
-</div>
-
-<div class="mw-kanban" id="kanban-demo" data-kanban-prefix="MW">
-  <div class="mw-kanban-column">
-    <div class="mw-kanban-column-header">
-      <h5 class="mw-kanban-title">Backlog</h5>
-      <span class="mw-kanban-count">0</span>
-      <button
-        type="button"
-        class="mw-btn mw-btn-secondary mw-btn-sm mw-kanban-add"
-        aria-label="Add ticket to Backlog"
-      >
-        <i class="fas fa-plus"></i>
-      </button>
-    </div>
-
-    <div class="mw-kanban-column-body">
-      <article class="mw-card mw-kanban-card">
-        <div class="mw-card-ribbon mw-card-addon-info">Low</div>
-        <p class="mw-kanban-card-title">Dark mode for the export dialog</p>
-        <p class="mw-kanban-card-text">
-          The dialog still renders on a hard white sheet while the rest of the
-          app follows the theme. The print stylesheet forces a light background
-          on purpose, and that rule leaks into the preview pane because both
-          share the same wrapper class. Splitting the two is probably enough,
-          but the header and the footer of the dialog need checking as well.
-        </p>
-        <div class="mw-kanban-card-footer">
-          <span class="mw-kanban-card-id">MW-104</span>
-          <div class="mw-kanban-card-actions">
-            <div class="mw-avatar mw-avatar-xs mw-avatar-initials">tk</div>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="-1"
-              aria-label="Move MW-104 one lane left"
-            >
-              <i class="fas fa-chevron-left"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="1"
-              aria-label="Move MW-104 one lane right"
-            >
-              <i class="fas fa-chevron-right"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-edit"
-              aria-label="Edit MW-104"
-            >
-              <i class="fas fa-pen"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-              aria-label="Delete MW-104"
-            >
-              <i class="fas fa-trash"></i>
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <article class="mw-card mw-kanban-card">
-        <p class="mw-kanban-card-title">Evaluate container queries</p>
-        <p class="mw-kanban-card-text">
-          Spike only - check whether the grid could drop a few breakpoints.
-        </p>
-        <div class="mw-kanban-card-footer">
-          <span class="mw-kanban-card-id">MW-103</span>
-          <div class="mw-kanban-card-actions">
-            <div class="mw-avatar mw-avatar-xs mw-avatar-initials">mw</div>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="-1"
-              aria-label="Move MW-103 one lane left"
-            >
-              <i class="fas fa-chevron-left"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="1"
-              aria-label="Move MW-103 one lane right"
-            >
-              <i class="fas fa-chevron-right"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-edit"
-              aria-label="Edit MW-103"
-            >
-              <i class="fas fa-pen"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-              aria-label="Delete MW-103"
-            >
-              <i class="fas fa-trash"></i>
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <div class="mw-kanban-empty">No tickets</div>
-    </div>
-  </div>
-
-  <div class="mw-kanban-column">
-    <div class="mw-kanban-column-header">
-      <h5 class="mw-kanban-title">In Progress</h5>
-      <span class="mw-kanban-count">0</span>
-      <button
-        type="button"
-        class="mw-btn mw-btn-secondary mw-btn-sm mw-kanban-add"
-        aria-label="Add ticket to In Progress"
-      >
-        <i class="fas fa-plus"></i>
-      </button>
-    </div>
-
-    <div class="mw-kanban-column-body">
-      <article class="mw-card mw-kanban-card">
-        <div class="mw-card-ribbon mw-card-addon-danger">High</div>
-        <p class="mw-kanban-card-title">Sticky table header jitters</p>
-        <p class="mw-kanban-card-text">
-          On Safari the header shifts by a pixel while scrolling. Looks like a
-          subpixel rounding issue on the border, since it only shows up at zoom
-          levels that are not a multiple of 25 percent. Chrome and Firefox are
-          both clean, so a transform-based fix would likely cost more than it
-          buys us here.
-        </p>
-        <div class="mw-kanban-card-footer">
-          <span class="mw-kanban-card-id">MW-102</span>
-          <div class="mw-kanban-card-actions">
-            <div class="mw-avatar mw-avatar-xs mw-avatar-initials">jd</div>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="-1"
-              aria-label="Move MW-102 one lane left"
-            >
-              <i class="fas fa-chevron-left"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="1"
-              aria-label="Move MW-102 one lane right"
-            >
-              <i class="fas fa-chevron-right"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-edit"
-              aria-label="Edit MW-102"
-            >
-              <i class="fas fa-pen"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-              aria-label="Delete MW-102"
-            >
-              <i class="fas fa-trash"></i>
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <article class="mw-card mw-kanban-card">
-        <div class="mw-card-ribbon mw-card-addon-warning">Medium</div>
-        <p class="mw-kanban-card-title">Range input on touch devices</p>
-        <p class="mw-kanban-card-text">
-          The thumb is too small to grab reliably; the track needs a bigger hit
-          area.
-        </p>
-        <div class="mw-kanban-card-footer">
-          <span class="mw-kanban-card-id">MW-101</span>
-          <div class="mw-kanban-card-actions">
-            <div class="mw-avatar mw-avatar-xs mw-avatar-initials">mw</div>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="-1"
-              aria-label="Move MW-101 one lane left"
-            >
-              <i class="fas fa-chevron-left"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="1"
-              aria-label="Move MW-101 one lane right"
-            >
-              <i class="fas fa-chevron-right"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-edit"
-              aria-label="Edit MW-101"
-            >
-              <i class="fas fa-pen"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-              aria-label="Delete MW-101"
-            >
-              <i class="fas fa-trash"></i>
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <div class="mw-kanban-empty">No tickets</div>
-    </div>
-  </div>
-
-  <div class="mw-kanban-column">
-    <div class="mw-kanban-column-header">
-      <h5 class="mw-kanban-title">Review</h5>
-      <span class="mw-kanban-count">0</span>
-      <button
-        type="button"
-        class="mw-btn mw-btn-secondary mw-btn-sm mw-kanban-add"
-        aria-label="Add ticket to Review"
-      >
-        <i class="fas fa-plus"></i>
-      </button>
-    </div>
-
-    <div class="mw-kanban-column-body">
-      <article class="mw-card mw-kanban-card">
-        <div class="mw-card-ribbon mw-card-addon-warning">Medium</div>
-        <p class="mw-kanban-card-title">Stepper: vertical variant</p>
-        <p class="mw-kanban-card-text">
-          Draws its own connector line, so the markup stays lighter than the
-          horizontal one.
-        </p>
-        <div class="mw-kanban-card-footer">
-          <span class="mw-kanban-card-id">MW-100</span>
-          <div class="mw-kanban-card-actions">
-            <div class="mw-avatar mw-avatar-xs mw-avatar-initials">jd</div>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="-1"
-              aria-label="Move MW-100 one lane left"
-            >
-              <i class="fas fa-chevron-left"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="1"
-              aria-label="Move MW-100 one lane right"
-            >
-              <i class="fas fa-chevron-right"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-edit"
-              aria-label="Edit MW-100"
-            >
-              <i class="fas fa-pen"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-              aria-label="Delete MW-100"
-            >
-              <i class="fas fa-trash"></i>
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <div class="mw-kanban-empty">No tickets</div>
-    </div>
-  </div>
-
-  <div class="mw-kanban-column">
-    <div class="mw-kanban-column-header">
-      <h5 class="mw-kanban-title">Done</h5>
-      <span class="mw-kanban-count">0</span>
-      <button
-        type="button"
-        class="mw-btn mw-btn-secondary mw-btn-sm mw-kanban-add"
-        aria-label="Add ticket to Done"
-      >
-        <i class="fas fa-plus"></i>
-      </button>
-    </div>
-
-    <div class="mw-kanban-column-body">
-      <article class="mw-card mw-kanban-card">
-        <p class="mw-kanban-card-title">Tooltips no longer clipped</p>
-        <p class="mw-kanban-card-text">
-          Cards stopped creating a stacking context, so tooltips can escape
-          their bounds again.
-        </p>
-        <div class="mw-kanban-card-footer">
-          <span class="mw-kanban-card-id">MW-99</span>
-          <div class="mw-kanban-card-actions">
-            <div class="mw-avatar mw-avatar-xs mw-avatar-initials">mw</div>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="-1"
-              aria-label="Move MW-99 one lane left"
-            >
-              <i class="fas fa-chevron-left"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action"
-              data-kanban-move="1"
-              aria-label="Move MW-99 one lane right"
-            >
-              <i class="fas fa-chevron-right"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-edit"
-              aria-label="Edit MW-99"
-            >
-              <i class="fas fa-pen"></i>
-            </button>
-            <button
-              type="button"
-              class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-              aria-label="Delete MW-99"
-            >
-              <i class="fas fa-trash"></i>
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <div class="mw-kanban-empty">No tickets</div>
-    </div>
-  </div>
-
-  <form class="mw-kanban-composer">
-    <input
-      type="text"
-      class="mw-input mw-input-sm mw-kanban-composer-title"
-      placeholder="What needs to be done?"
-      aria-label="Ticket title"
-    />
-    <textarea
-      class="mw-textarea mw-kanban-composer-text"
-      rows="2"
-      placeholder="Details (optional)"
-      aria-label="Ticket description"
-    ></textarea>
-    <div class="mw-kanban-composer-row">
-      <select
-        class="mw-select mw-select-sm mw-kanban-composer-priority"
-        aria-label="Priority"
-      >
-        <option value="danger">High</option>
-        <option value="warning">Medium</option>
-        <option value="info">Low</option>
-        <option value="" selected>No priority</option>
-      </select>
-      <select
-        class="mw-select mw-select-sm mw-kanban-composer-assignee"
-        aria-label="Assignee"
-      >
-        <option value="" selected>Unassigned</option>
-        <option value="mw">MW</option>
-        <option value="jd">JD</option>
-        <option value="tk">TK</option>
-      </select>
-    </div>
-    <div class="mw-kanban-composer-actions">
-      <button
-        type="button"
-        class="mw-btn mw-btn-outline mw-btn-sm mw-kanban-composer-cancel"
-      >
-        Cancel
-      </button>
-      <button type="submit" class="mw-btn mw-btn-primary mw-btn-sm">
-        Save
-      </button>
-    </div>
-  </form>
-
-  <template class="mw-kanban-card-template">
-    <article class="mw-card mw-kanban-card">
-      <p class="mw-kanban-card-title">Title</p>
-      <p class="mw-kanban-card-text">Text</p>
-      <div class="mw-kanban-card-footer">
-        <span class="mw-kanban-card-id">MW-0</span>
-        <div class="mw-kanban-card-actions">
-          <div class="mw-avatar mw-avatar-xs mw-avatar-initials">me</div>
-          <button
-            type="button"
-            class="mw-kanban-action"
-            data-kanban-move="-1"
-            aria-label="Move MW-0 one lane left"
-          >
-            <i class="fas fa-chevron-left"></i>
-          </button>
-          <button
-            type="button"
-            class="mw-kanban-action"
-            data-kanban-move="1"
-            aria-label="Move MW-0 one lane right"
-          >
-            <i class="fas fa-chevron-right"></i>
-          </button>
-          <button
-            type="button"
-            class="mw-kanban-action mw-kanban-edit"
-            aria-label="Edit MW-0"
-          >
-            <i class="fas fa-pen"></i>
-          </button>
-          <button
-            type="button"
-            class="mw-kanban-action mw-kanban-action-danger mw-kanban-delete"
-            aria-label="Delete MW-0"
-          >
-            <i class="fas fa-trash"></i>
-          </button>
-        </div>
-      </div>
-    </article>
-  </template>
-</div>

package/src/partials/kbd-container.html

@@ -1,63 +0,0 @@
-<h3 class="mw-section-subtitle">Keyboard Keys</h3>
-
-<p class="mw-text-muted mw-text-measure">
-  Anything that tells someone which key to press should look like the key.
-  <code>&lt;kbd&gt;</code> is styled directly, so a shortcut in prose needs no
-  class at all; <code>mw-kbd</code> is there for a <code>span</code> when the
-  markup is not yours to change.
-</p>
-
-<div class="mw-grid-2 mw-gap-6">
-  <div>
-    <h3 class="mw-card-title mw-mb-4">In prose</h3>
-    <div class="mw-card mw-card-simple mw-grid-1 mw-gap-6">
-      <p class="mw-mb-0">
-        Press
-        <span class="mw-kbd-group"
-          ><kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>P</kbd></span
-        >
-        to open the command palette, <kbd>Esc</kbd> to close it and
-        <kbd>Enter</kbd> to run the selection.
-      </p>
-      <p class="mw-mb-0">
-        On a Mac that is
-        <span class="mw-kbd-group"
-          ><kbd>&#8984;</kbd>+<kbd>&#8679;</kbd>+<kbd>P</kbd></span
-        >.
-      </p>
-      <div>
-        <h4 class="mw-text-medium mw-mb-2">Held down</h4>
-        <p class="mw-mb-0">
-          <kbd class="mw-kbd-pressed">Space</kbd> shown mid-press - the raised
-          edge drops and the key sits 1px lower, for a hint that demonstrates
-          rather than lists.
-        </p>
-      </div>
-    </div>
-  </div>
-
-  <div>
-    <h3 class="mw-card-title mw-mb-4">As a shortcut list</h3>
-    <div class="mw-card mw-card-simple">
-      <div class="mw-row-split mw-row-split-center">
-        <span>Save</span>
-        <span class="mw-kbd-group"><kbd>Ctrl</kbd>+<kbd>S</kbd></span>
-      </div>
-      <hr class="mw-divider" />
-      <div class="mw-row-split mw-row-split-center">
-        <span>Find in page</span>
-        <span class="mw-kbd-group"><kbd>Ctrl</kbd>+<kbd>F</kbd></span>
-      </div>
-      <hr class="mw-divider" />
-      <div class="mw-row-split mw-row-split-center">
-        <span>Close tab</span>
-        <span class="mw-kbd-group"><kbd>Ctrl</kbd>+<kbd>W</kbd></span>
-      </div>
-      <hr class="mw-divider" />
-      <div class="mw-row-split mw-row-split-center">
-        <span>Help</span>
-        <span class="mw-kbd-group"><kbd>?</kbd></span>
-      </div>
-    </div>
-  </div>
-</div>

package/src/partials/leader-row-container.html

@@ -1,139 +0,0 @@
-<h3 class="mw-section-subtitle">Leader row</h3>
-<p class="mw-text-muted mw-text-measure">
-  A label, its value, and a dotted line connecting the two - the row a menu, a
-  table of contents and an invoice all draw. The line is generated by the row
-  itself, so the markup is two spans.
-</p>
-<p class="mw-text-muted mw-text-measure">
-  Label and value is what <code>&lt;dl&gt;</code> is for, and since HTML 5.2 a
-  <code>&lt;div&gt;</code> may group a <code>&lt;dt&gt;</code> and its
-  <code>&lt;dd&gt;</code> inside one - so the semantic version costs no extra
-  element over the plain <code>&lt;p&gt;</code>. Put
-  <code>mw-leader-row</code> on that <code>&lt;div&gt;</code> and the two
-  classes on the <code>&lt;dt&gt;</code> and <code>&lt;dd&gt;</code>. Use it
-  where the pair <em>is</em> the content; where every row also carries a
-  description, a <code>&lt;p&gt;</code> stays simpler.
-</p>
-
-<div class="mw-grid-2 mw-gap-6">
-  <div>
-    <h3 class="mw-card-title mw-mb-4">On a menu</h3>
-    <div class="mw-card mw-card-simple">
-      <div class="mw-item-list">
-        <div>
-          <p class="mw-leader-row">
-            <span class="mw-leader-row-label mw-text-bold">Flatbread soup</span>
-            <span class="mw-leader-row-value mw-text-bold mw-text-primary"
-              >5.80</span
-            >
-          </p>
-          <p class="mw-text-sm mw-text-muted mw-mb-0">
-            Beef broth with pancake strips and chives
-          </p>
-        </div>
-        <div>
-          <p class="mw-leader-row">
-            <span class="mw-leader-row-label mw-text-bold"
-              >Roast pork with dumpling and red cabbage</span
-            >
-            <span class="mw-leader-row-value mw-text-bold mw-text-primary"
-              >17.50</span
-            >
-          </p>
-          <p class="mw-text-sm mw-text-muted mw-mb-0">
-            A long label wraps and the leader stays beside its last line
-          </p>
-        </div>
-      </div>
-    </div>
-
-    <h3 class="mw-card-title mw-mb-4 mw-mt-6">Value on the first line</h3>
-    <div class="mw-card mw-card-simple">
-      <p class="mw-text-muted mw-text-sm mw-mb-5">
-        <code>mw-leader-row-top</code> keeps the value beside the
-        <em>first</em> line of a wrapping label instead of the last. On a menu
-        that is where the price belongs - next to the dish, not somewhere down
-        in its description.
-      </p>
-      <p class="mw-leader-row mw-leader-row-top">
-        <span class="mw-leader-row-label mw-text-bold"
-          >Roast pork with dumpling and red cabbage</span
-        >
-        <span class="mw-leader-row-value mw-text-bold mw-text-primary"
-          >17.50</span
-        >
-      </p>
-    </div>
-
-    <h3 class="mw-card-title mw-mb-4 mw-mt-6">Semantic markup</h3>
-    <div class="mw-card mw-card-simple">
-      <p class="mw-text-muted mw-text-sm mw-mb-5">
-        The same row as a <code>&lt;dl&gt;</code>: the group
-        <code>&lt;div&gt;</code> carries <code>mw-leader-row</code>, the
-        <code>&lt;dt&gt;</code> and <code>&lt;dd&gt;</code> carry the other two
-        classes. No extra element over the <code>&lt;p&gt;</code> version.
-      </p>
-      <dl class="mw-item-list">
-        <div class="mw-leader-row">
-          <dt class="mw-leader-row-label">Potato soup with marjoram</dt>
-          <dd class="mw-leader-row-value">4.90</dd>
-        </div>
-        <div class="mw-leader-row">
-          <dt class="mw-leader-row-label">Mixed leaf salad</dt>
-          <dd class="mw-leader-row-value">3.80</dd>
-        </div>
-      </dl>
-    </div>
-  </div>
-
-  <div>
-    <h3 class="mw-card-title mw-mb-4">Line styles</h3>
-    <div class="mw-card mw-card-simple mw-grid-1 mw-gap-6">
-      <div>
-        <h4 class="mw-text-medium mw-mb-2">Dotted (default)</h4>
-        <p class="mw-leader-row">
-          <span class="mw-leader-row-label">Introduction</span>
-          <span class="mw-leader-row-value">7</span>
-        </p>
-      </div>
-      <div>
-        <h4 class="mw-text-medium mw-mb-2">Dashed</h4>
-        <p class="mw-leader-row mw-leader-row-dashed">
-          <span class="mw-leader-row-label">Second movement</span>
-          <span class="mw-leader-row-value">24</span>
-        </p>
-      </div>
-      <div>
-        <h4 class="mw-text-medium mw-mb-2">Solid</h4>
-        <p class="mw-leader-row mw-leader-row-solid">
-          <span class="mw-leader-row-label">Appendix</span>
-          <span class="mw-leader-row-value">128</span>
-        </p>
-      </div>
-      <div>
-        <h4 class="mw-text-medium mw-mb-2">Retuned per row</h4>
-        <p
-          class="mw-leader-row"
-          style="--mw-leader-row-color: var(--mw-primary-color)"
-        >
-          <span class="mw-leader-row-label">Total</span>
-          <span class="mw-leader-row-value mw-text-bold">1 284.00</span>
-        </p>
-      </div>
-    </div>
-
-    <h3 class="mw-card-title mw-mb-4 mw-mt-6">Two values</h3>
-    <div class="mw-card mw-card-simple">
-      <p class="mw-text-muted mw-text-sm mw-mb-5">
-        A second <code>mw-leader-row-value</code> needs no extra class - both
-        sit after the leader, and a mark in the leader's colour goes between
-        them so the pair does not read as one long range.
-      </p>
-      <p class="mw-leader-row">
-        <span class="mw-leader-row-label">Wiener schnitzel with fries</span>
-        <span class="mw-leader-row-value mw-text-muted">11.50</span>
-        <span class="mw-leader-row-value mw-text-bold">15.90</span>
-      </p>
-    </div>
-  </div>
-</div>