npm - cronus-theme - Versions diffs - 2.0.88 → 2.0.90 - Mend

cronus-theme 2.0.88 → 2.0.90

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (438) hide show

package/child/styleguide/item-shop-orderboxsummary.html DELETED Viewed

@@ -1,267 +0,0 @@
-<!DOCTYPE html>
-<html class="no-js" lang="en">
-<head>
-  <meta charset="utf-8"/>
-  <title>Style Guide</title>
-  <meta name="description" content=""/>
-  <meta name="generator" content="kss-node"/>
-  <meta name="viewport" content="width=device-width"/>
-  <link rel="stylesheet" href="kss-assets/kss.css"/>
-  <link rel="stylesheet" href="../dist/css/addons/kss.css"/>
-<link rel="stylesheet" href="../../default/b2c/dist/css/doc.css"/>
-<link rel="stylesheet" href="../dist/css/doc.css"/>
-</head>
-<body id="kss-node" class="kss-fullscreen-mode">
-<div class="kss-sidebar kss-style">
-  <header class="kss-header">
-    <h1 class="kss-doc-title">Style Guide</h1>
-  </header>
-  <nav class="kss-nav" aria-label="Style Guide">
-    <ul class="kss-nav__menu">
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="./">
-          <span class="kss-nav__ref">0</span
-          ><span class="kss-nav__name">Overview</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-base.html">
-          <span class="kss-nav__ref">1</span><span class="kss-nav__name">Base</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-colors.html">
-          <span class="kss-nav__ref">2</span><span class="kss-nav__name">Colors</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-components.html">
-          <span class="kss-nav__ref">3</span><span class="kss-nav__name">Components</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-form.html">
-          <span class="kss-nav__ref">4</span><span class="kss-nav__name">Form</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-navigations.html">
-          <span class="kss-nav__ref">5</span><span class="kss-nav__name">Navigations</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-shop.html">
-          <span class="kss-nav__ref">6</span><span class="kss-nav__name">Shop</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-siteparts.html">
-          <span class="kss-nav__ref">7</span><span class="kss-nav__name">Siteparts</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-structure.html">
-          <span class="kss-nav__ref">8</span><span class="kss-nav__name">Structure</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-typo.html">
-          <span class="kss-nav__ref">9</span><span class="kss-nav__name">Typo</span>
-        </a>
-      </li>
-    </ul>
-  </nav>
-</div>
-<main class="kss-main" aria-label="Content">
-  <article>
-    <div id="kssref-shop-orderboxsummary" class="kss-section kss-section--depth-2 is-fullscreen">
-      <div class="kss-style">
-        <h2 class="kss-title kss-title--level-2">
-          <a class="kss-title__permalink" href="#kssref-shop-orderboxsummary">
-            <span class="kss-title__ref">
-              6.11
-              <span class="kss-title__permalink-hash">
-                  #Shop.orderboxSummary
-              </span>
-            </span>
-            orderboxSummary
-          </a>
-        </h2>
-          <p class="kss-toolbar">
-            <a href="#kssref-shop-orderboxsummary" data-kss-guides="true">
-              <span class="kss-toolbar__tooltip">Toggle example guides</span>
-              <svg focusable="false" aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 64 64">
-                <rect class="kss-toolbar__icon-fill" x="5" y="35" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="21" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="35" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="5" y="21" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="5" y="0" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="35" y="5" width="9" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="20" y="5" width="9" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="0" y="5" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="0" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="49" y="5" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="49" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="49" y="54" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="5" y="49" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="0" y="54" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="35" y="54" width="9" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="20" y="54" width="9" height="5"/>
-              </svg>
-            </a>
-            <a href="#kssref-shop-orderboxsummary" data-kss-markup="true">
-              <span class="kss-toolbar__tooltip">Toggle HTML markup</span>
-              <svg focusable="false" aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 64 64">
-                <path class="kss-toolbar__icon-fill" d="M37.555,46.239l6.103,6.103l20.342,-20.342l-20.342,-20.342l-6.103,6.103l14.24,14.239l-14.24,14.239Z"/>
-                <path class="kss-toolbar__icon-fill" d="M26.445,17.761l-6.103,-6.103l-20.342,20.342l20.342,20.342l6.103,-6.103l-14.24,-14.239l14.24,-14.239Z"/>
-              </svg>
-            </a>
-          </p>
-      </div>
-        <div class="kss-modifier__wrapper">
-          <div class="kss-modifier__heading kss-style">
-            Example
-          </div>
-          <div class="kss-modifier__example">
-            <div class="orderboxSummary">
-  <div class="orderboxSummary__head">
-    <div class="orderboxSummary__headline">Headline</div>
-  </div>
-  <div class="orderboxSummary__main">
-    <div class="amountLines">
-      <div class="amountLine">
-          <div class="amountLine__label">Summe Bestellung</div>
-          <div class="amountLine__value">999,00&nbsp;€</div>
-      </div>
-      <div class="amountLine">
-          <div class="amountLine__label">Versandkosten</div>
-          <div class="amountLine__value">+8,90&nbsp;€</div>
-      </div>
-    </div>
-  </div>
-  <div class="orderboxSummary__footer">
-    <div class="amountLines">
-        <div class="amountLine amountLine--big">
-            <div class="amountLine__label">Gesamtsumme</div>
-            <div class="amountLine__value">1.007,90&nbsp;€</div>
-        </div>
-        <div class="amountLine">
-            <div class="amountLine__label">enthaltene MwSt. 19%</div>
-            <div class="amountLine__value">160,93&nbsp;€</div>
-        </div>
-    </div>
-    <div class="orderboxSummary__buttons">
-      <button type="submit" class="button button--primary button--xl">Order</button>
-    </div>
-    <div class="orderboxSummary__trust">
-      <ul class="trustList">
-          <li><i class="icon icon-shipping"></i> Kostenloser Versand ab 50€</li>
-          <li><i class="icon icon-invoice"></i> Kauf auf Rechnung</li>
-          <li><i class="icon icon-retoure"></i> 50&nbsp;Tage Rückgaberecht</li>
-      </ul>
-    </div>
-  </div>
-</div>
-            <div class="kss-modifier__example-footer"></div>
-          </div>
-        </div>
-          <details class="kss-markup kss-style">
-            <summary>
-                Markup
-            </summary>
-            <pre class="hljs"><code class="language-handlebars"><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary&quot;</span>&gt;</span>
-  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary__head&quot;</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary__headline&quot;</span>&gt;</span>Headline<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-  <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary__main&quot;</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLines&quot;</span>&gt;</span>
-      <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine&quot;</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__label&quot;</span>&gt;</span>Summe Bestellung<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__value&quot;</span>&gt;</span>999,00<span class="hljs-symbol">&amp;nbsp;</span>€<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-      <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-      <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine&quot;</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__label&quot;</span>&gt;</span>Versandkosten<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__value&quot;</span>&gt;</span>+8,90<span class="hljs-symbol">&amp;nbsp;</span>€<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-      <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-  <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary__footer&quot;</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLines&quot;</span>&gt;</span>
-        <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine amountLine--big&quot;</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__label&quot;</span>&gt;</span>Gesamtsumme<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__value&quot;</span>&gt;</span>1.007,90<span class="hljs-symbol">&amp;nbsp;</span>€<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-        <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-        <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine&quot;</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__label&quot;</span>&gt;</span>enthaltene MwSt. 19%<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;amountLine__value&quot;</span>&gt;</span>160,93<span class="hljs-symbol">&amp;nbsp;</span>€<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-        <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary__buttons&quot;</span>&gt;</span>
-      <span class="hljs-tag">&lt;<span class="hljs-name">button</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;submit&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;button button--primary button--xl&quot;</span>&gt;</span>Order<span class="hljs-tag">&lt;/<span class="hljs-name">button</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderboxSummary__trust&quot;</span>&gt;</span>
-      <span class="hljs-tag">&lt;<span class="hljs-name">ul</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;trustList&quot;</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span><span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-shipping&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span> Kostenloser Versand ab 50€<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span><span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-invoice&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span> Kauf auf Rechnung<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span><span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-retoure&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span> 50<span class="hljs-symbol">&amp;nbsp;</span>Tage Rückgaberecht<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
-      <span class="hljs-tag">&lt;/<span class="hljs-name">ul</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-  <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></span></code></pre>
-          </details>
-        <div class="kss-source kss-style">
-          Source: <code>build/doc/doc.css</code>, line 17296
-        </div>
-    </div>
-</article>
-</main>
-<!-- SCRIPTS -->
-<script src="kss-assets/kss.js"></script>
-<script src="kss-assets/scrollspy.js"></script>
-<script src="kss-assets/kss-fullscreen.js"></script>
-<script src="kss-assets/kss-guides.js"></script>
-<script src="kss-assets/kss-markup.js"></script>
-<script>
-  var spy = new ScrollSpy('#kss-node', {
-    nav: '.kss-nav__menu-child > li > a',
-    className: 'is-in-viewport'
-  });
-  var kssFullScreen = new KssFullScreen({
-    idPrefix: 'kss-fullscreen-',
-    bodyClass: 'kss-fullscreen-mode',
-    elementClass: 'is-fullscreen'
-  });
-  var kssGuides = new KssGuides({
-    bodyClass: 'kss-guides-mode'
-  });
-  var kssMarkup = new KssMarkup({
-    bodyClass: 'kss-markup-mode',
-    detailsClass: 'kss-markup'
-  });
-</script>
-<script src="../../default/b2c/dist/js/main.js"></script>
-<script src="../dist/js/main.js"></script>
-<!-- Automatically built using <a href="https://github.com/kss-node/kss-node">kss-node</a>. -->
-</body>
-</html>

package/child/styleguide/item-shop-orderbutton.html DELETED Viewed

@@ -1,297 +0,0 @@
-<!DOCTYPE html>
-<html class="no-js" lang="en">
-<head>
-  <meta charset="utf-8"/>
-  <title>Style Guide</title>
-  <meta name="description" content=""/>
-  <meta name="generator" content="kss-node"/>
-  <meta name="viewport" content="width=device-width"/>
-  <link rel="stylesheet" href="kss-assets/kss.css"/>
-  <link rel="stylesheet" href="../dist/css/addons/kss.css"/>
-<link rel="stylesheet" href="../../default/b2c/dist/css/doc.css"/>
-<link rel="stylesheet" href="../dist/css/doc.css"/>
-</head>
-<body id="kss-node" class="kss-fullscreen-mode">
-<div class="kss-sidebar kss-style">
-  <header class="kss-header">
-    <h1 class="kss-doc-title">Style Guide</h1>
-  </header>
-  <nav class="kss-nav" aria-label="Style Guide">
-    <ul class="kss-nav__menu">
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="./">
-          <span class="kss-nav__ref">0</span
-          ><span class="kss-nav__name">Overview</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-base.html">
-          <span class="kss-nav__ref">1</span><span class="kss-nav__name">Base</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-colors.html">
-          <span class="kss-nav__ref">2</span><span class="kss-nav__name">Colors</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-components.html">
-          <span class="kss-nav__ref">3</span><span class="kss-nav__name">Components</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-form.html">
-          <span class="kss-nav__ref">4</span><span class="kss-nav__name">Form</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-navigations.html">
-          <span class="kss-nav__ref">5</span><span class="kss-nav__name">Navigations</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-shop.html">
-          <span class="kss-nav__ref">6</span><span class="kss-nav__name">Shop</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-siteparts.html">
-          <span class="kss-nav__ref">7</span><span class="kss-nav__name">Siteparts</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-structure.html">
-          <span class="kss-nav__ref">8</span><span class="kss-nav__name">Structure</span>
-        </a>
-      </li>
-      <li class="kss-nav__menu-item">
-        <a class="kss-nav__menu-link" href="section-typo.html">
-          <span class="kss-nav__ref">9</span><span class="kss-nav__name">Typo</span>
-        </a>
-      </li>
-    </ul>
-  </nav>
-</div>
-<main class="kss-main" aria-label="Content">
-  <article>
-    <div id="kssref-shop-orderbutton" class="kss-section kss-section--depth-2 is-fullscreen">
-      <div class="kss-style">
-        <h2 class="kss-title kss-title--level-2">
-          <a class="kss-title__permalink" href="#kssref-shop-orderbutton">
-            <span class="kss-title__ref">
-              6.12
-              <span class="kss-title__permalink-hash">
-                  #Shop.Orderbutton
-              </span>
-            </span>
-            Orderbutton
-          </a>
-        </h2>
-          <p class="kss-toolbar">
-            <a href="#kssref-shop-orderbutton" data-kss-guides="true">
-              <span class="kss-toolbar__tooltip">Toggle example guides</span>
-              <svg focusable="false" aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 64 64">
-                <rect class="kss-toolbar__icon-fill" x="5" y="35" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="21" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="35" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="5" y="21" width="5" height="9"/>
-                <rect class="kss-toolbar__icon-fill" x="5" y="0" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="35" y="5" width="9" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="20" y="5" width="9" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="0" y="5" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="0" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="49" y="5" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="54" y="49" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="49" y="54" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="5" y="49" width="5" height="15"/>
-                <rect class="kss-toolbar__icon-fill" x="0" y="54" width="15" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="35" y="54" width="9" height="5"/>
-                <rect class="kss-toolbar__icon-fill" x="20" y="54" width="9" height="5"/>
-              </svg>
-            </a>
-            <a href="#kssref-shop-orderbutton" data-kss-markup="true">
-              <span class="kss-toolbar__tooltip">Toggle HTML markup</span>
-              <svg focusable="false" aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 64 64">
-                <path class="kss-toolbar__icon-fill" d="M37.555,46.239l6.103,6.103l20.342,-20.342l-20.342,-20.342l-6.103,6.103l14.24,14.239l-14.24,14.239Z"/>
-                <path class="kss-toolbar__icon-fill" d="M26.445,17.761l-6.103,-6.103l-20.342,20.342l20.342,20.342l6.103,-6.103l-14.24,-14.239l14.24,-14.239Z"/>
-              </svg>
-            </a>
-          </p>
-      </div>
-        <div class="kss-modifier__wrapper">
-          <div class="kss-modifier__heading kss-style">
-            Examples
-          </div>
-            <div class="kss-modifier__default-name kss-style">
-              Default styling
-            </div>
-          <div class="kss-modifier__example">
-            <div class="orderButtonWrapper ">
-    <div class="quantity">
-        <input type="number" name="name" value="0" min="1" max="99" step="1" >
-        <div class="quantity__spinner">
-            <div class="quantity__spinnerItem quantity__spinnerItem--up js-spinnerUp">
-                <i class="icon icon-spinner-up"></i>
-            </div>
-            <div class="quantity__spinnerItem quantity__spinnerItem--down js-spinnerDown">
-                <i class="icon icon-spinner-down"></i>
-            </div>
-        </div>
-    </div>
-    <button type="submit" class="button button--primary orderButton">
-          <span>Warenkorb</span><i class="icon icon-basket"></i>
-    </button>
-</div>
-<div class="orderButtonWrapper ">
-    <div class="quantity">
-        <input type="number" name="name" value="0" min="1" max="99" step="1" >
-        <div class="quantity__spinner">
-            <div class="quantity__spinnerItem quantity__spinnerItem--up js-spinnerUp">
-                <i class="icon icon-spinner-up"></i>
-            </div>
-            <div class="quantity__spinnerItem quantity__spinnerItem--down js-spinnerDown">
-                <i class="icon icon-spinner-down"></i>
-            </div>
-        </div>
-    </div>
-    <button type="submit" class="button button--primary orderButton orderButton--customizable">
-          <span>Individualisieren</span><i class="icon icon-basket"></i>
-    </button>
-</div>
-            <div class="kss-modifier__example-footer"></div>
-          </div>
-            <div class="kss-modifier__name kss-style">
-              .orderButtonWrapper--inactive
-            </div>
-            <div class="kss-modifier__description kss-style">
-              Inactive
-            </div>
-            <div class="kss-modifier__example">
-              <div class="orderButtonWrapper orderButtonWrapper--inactive">
-    <div class="quantity">
-        <input type="number" name="name" value="0" min="1" max="99" step="1" orderButtonWrapper--inactive>
-        <div class="quantity__spinner">
-            <div class="quantity__spinnerItem quantity__spinnerItem--up js-spinnerUp">
-                <i class="icon icon-spinner-up"></i>
-            </div>
-            <div class="quantity__spinnerItem quantity__spinnerItem--down js-spinnerDown">
-                <i class="icon icon-spinner-down"></i>
-            </div>
-        </div>
-    </div>
-    <button type="submit" class="button button--primary orderButton">
-          <span>Warenkorb</span><i class="icon icon-basket"></i>
-    </button>
-</div>
-<div class="orderButtonWrapper orderButtonWrapper--inactive">
-    <div class="quantity">
-        <input type="number" name="name" value="0" min="1" max="99" step="1" orderButtonWrapper--inactive>
-        <div class="quantity__spinner">
-            <div class="quantity__spinnerItem quantity__spinnerItem--up js-spinnerUp">
-                <i class="icon icon-spinner-up"></i>
-            </div>
-            <div class="quantity__spinnerItem quantity__spinnerItem--down js-spinnerDown">
-                <i class="icon icon-spinner-down"></i>
-            </div>
-        </div>
-    </div>
-    <button type="submit" class="button button--primary orderButton orderButton--customizable">
-          <span>Individualisieren</span><i class="icon icon-basket"></i>
-    </button>
-</div>
-              <div class="kss-modifier__example-footer"></div>
-            </div>
-        </div>
-          <details class="kss-markup kss-style">
-            <summary>
-                Markup
-            </summary>
-            <pre class="hljs"><code class="language-handlebars"><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderButtonWrapper [modifier class]&quot;</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity&quot;</span>&gt;</span>
-        <span class="hljs-tag">&lt;<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;number&quot;</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span> <span class="hljs-attr">value</span>=<span class="hljs-string">&quot;0&quot;</span> <span class="hljs-attr">min</span>=<span class="hljs-string">&quot;1&quot;</span> <span class="hljs-attr">max</span>=<span class="hljs-string">&quot;99&quot;</span> <span class="hljs-attr">step</span>=<span class="hljs-string">&quot;1&quot;</span> [<span class="hljs-attr">modifier</span> <span class="hljs-attr">class</span>]&gt;</span>
-        <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity__spinner&quot;</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity__spinnerItem quantity__spinnerItem--up js-spinnerUp&quot;</span>&gt;</span>
-                <span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-spinner-up&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span>
-            <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity__spinnerItem quantity__spinnerItem--down js-spinnerDown&quot;</span>&gt;</span>
-                <span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-spinner-down&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span>
-            <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-        <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">button</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;submit&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;button button--primary orderButton&quot;</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">span</span>&gt;</span>Warenkorb<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span><span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-basket&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">button</span>&gt;</span>
-<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;orderButtonWrapper [modifier class]&quot;</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity&quot;</span>&gt;</span>
-        <span class="hljs-tag">&lt;<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;number&quot;</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span> <span class="hljs-attr">value</span>=<span class="hljs-string">&quot;0&quot;</span> <span class="hljs-attr">min</span>=<span class="hljs-string">&quot;1&quot;</span> <span class="hljs-attr">max</span>=<span class="hljs-string">&quot;99&quot;</span> <span class="hljs-attr">step</span>=<span class="hljs-string">&quot;1&quot;</span> [<span class="hljs-attr">modifier</span> <span class="hljs-attr">class</span>]&gt;</span>
-        <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity__spinner&quot;</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity__spinnerItem quantity__spinnerItem--up js-spinnerUp&quot;</span>&gt;</span>
-                <span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-spinner-up&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span>
-            <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-            <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;quantity__spinnerItem quantity__spinnerItem--down js-spinnerDown&quot;</span>&gt;</span>
-                <span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-spinner-down&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span>
-            <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-        <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
-    <span class="hljs-tag">&lt;<span class="hljs-name">button</span> <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;submit&quot;</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;button button--primary orderButton orderButton--customizable&quot;</span>&gt;</span>
-          <span class="hljs-tag">&lt;<span class="hljs-name">span</span>&gt;</span>Individualisieren<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span><span class="hljs-tag">&lt;<span class="hljs-name">i</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;icon icon-basket&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">i</span>&gt;</span>
-    <span class="hljs-tag">&lt;/<span class="hljs-name">button</span>&gt;</span>
-<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></span></code></pre>
-          </details>
-        <div class="kss-source kss-style">
-          Source: <code>build/doc/doc.css</code>, line 17140
-        </div>
-    </div>
-</article>
-</main>
-<!-- SCRIPTS -->
-<script src="kss-assets/kss.js"></script>
-<script src="kss-assets/scrollspy.js"></script>
-<script src="kss-assets/kss-fullscreen.js"></script>
-<script src="kss-assets/kss-guides.js"></script>
-<script src="kss-assets/kss-markup.js"></script>
-<script>
-  var spy = new ScrollSpy('#kss-node', {
-    nav: '.kss-nav__menu-child > li > a',
-    className: 'is-in-viewport'
-  });
-  var kssFullScreen = new KssFullScreen({
-    idPrefix: 'kss-fullscreen-',
-    bodyClass: 'kss-fullscreen-mode',
-    elementClass: 'is-fullscreen'
-  });
-  var kssGuides = new KssGuides({
-    bodyClass: 'kss-guides-mode'
-  });
-  var kssMarkup = new KssMarkup({
-    bodyClass: 'kss-markup-mode',
-    detailsClass: 'kss-markup'
-  });
-</script>
-<script src="../../default/b2c/dist/js/main.js"></script>
-<script src="../dist/js/main.js"></script>
-<!-- Automatically built using <a href="https://github.com/kss-node/kss-node">kss-node</a>. -->
-</body>
-</html>