diff --git a/js/main.min.js.map b/js/main.min.js.map index 566e810700..edd0030822 100644 --- a/js/main.min.js.map +++ b/js/main.min.js.map @@ -1 +1 @@ -{"version":3,"file":"main.min.js","names":["document","addEventListener","event","target","tagName","toLowerCase","attributes","href","value","slice","link","type","dialog","closest","matches","hash","querySelector","dataset","polyfilled","dialogPolyfill","registerDialog","showModal","close","preventDefault"],"sources":["../_patterns/02-components/dialog/dialog.script.js"],"sourcesContent":["/* global dialogPolyfill */\n\n(function () {\n\t// Bind the click events for links (that we'll check for later on)\n\tdocument.addEventListener('click', (event) => {\n\t\t// Determine whether the target of the current link is a dialog\n\t\tif (\n\t\t\tevent.target &&\n\t\t\tevent.target.tagName &&\n\t\t\tevent.target.tagName.toLowerCase() === 'a' &&\n\t\t\tevent.target.attributes.href.value.slice(0, 1) === '#'\n\t\t) {\n\t\t\tconst link = event.target;\n\t\t\tlet type, dialog;\n\n\t\t\t// Determine whether the link is included within a dialog and is the close link\n\t\t\tif (\n\t\t\t\tlink.attributes.href.value === '#' &&\n\t\t\t\tlink.closest('dialog') &&\n\t\t\t\tlink.matches('.elm-link.is-close')\n\t\t\t) {\n\t\t\t\ttype = 'close';\n\t\t\t\tdialog = link.closest('dialog');\n\t\t\t} else if (\n\t\t\t\tlink.hash &&\n\t\t\t\tdocument.querySelector(link.hash) &&\n\t\t\t\tdocument.querySelector(link.hash).tagName.toLowerCase() ===\n\t\t\t\t\t'dialog'\n\t\t\t) {\n\t\t\t\ttype = 'dialog';\n\t\t\t\tdialog = document.querySelector(link.hash);\n\t\t\t} else {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Check for whether the dialog has been registered even already\n\t\t\tif (type === 'dialog') {\n\t\t\t\tif (!dialog.dataset.polyfilled) {\n\t\t\t\t\t// Initially registering the dialog\n\t\t\t\t\tdialogPolyfill.registerDialog(dialog);\n\n\t\t\t\t\tdialog.dataset.polyfilled = true;\n\t\t\t\t}\n\n\t\t\t\tdialog.showModal();\n\t\t\t} else {\n\t\t\t\tdialog.close();\n\t\t\t}\n\n\t\t\t// Prevent the default behaviour of the link\n\t\t\tevent.preventDefault();\n\t\t}\n\t});\n})();\n"],"mappings":"AAAA,2BAEA,CAAC,UAAY,CACZ;AACAA,QAAQ,CAACC,gBAAgB,CAAC,OAAO,CAAGC,KAAK,EAAK,CAC7C;AACA,GACCA,KAAK,CAACC,MAAM,EACZD,KAAK,CAACC,MAAM,CAACC,OAAO,EACpBF,KAAK,CAACC,MAAM,CAACC,OAAO,CAACC,WAAW,CAAC,CAAC,GAAK,GAAG,EAC1CH,KAAK,CAACC,MAAM,CAACG,UAAU,CAACC,IAAI,CAACC,KAAK,CAACC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAC,GAAK,GAAG,CACrD,CACD,KAAM,CAAAC,IAAI,CAAGR,KAAK,CAACC,MAAM,CACzB,GAAI,CAAAQ,IAAI,CAAEC,MAAM,CAEhB;AACA,GACCF,IAAI,CAACJ,UAAU,CAACC,IAAI,CAACC,KAAK,GAAK,GAAG,EAClCE,IAAI,CAACG,OAAO,CAAC,QAAQ,CAAC,EACtBH,IAAI,CAACI,OAAO,CAAC,oBAAoB,CAAC,CACjC,CACDH,IAAI,CAAG,OAAO,CACdC,MAAM,CAAGF,IAAI,CAACG,OAAO,CAAC,QAAQ,CAC/B,CAAC,IAAM,IACNH,IAAI,CAACK,IAAI,EACTf,QAAQ,CAACgB,aAAa,CAACN,IAAI,CAACK,IAAI,CAAC,EACjCf,QAAQ,CAACgB,aAAa,CAACN,IAAI,CAACK,IAAI,CAAC,CAACX,OAAO,CAACC,WAAW,CAAC,CAAC,GACtD,QAAQ,CACR,CACDM,IAAI,CAAG,QAAQ,CACfC,MAAM,CAAGZ,QAAQ,CAACgB,aAAa,CAACN,IAAI,CAACK,IAAI,CAC1C,CAAC,IAAM,CACN,MACD,CAEA;AACA,GAAIJ,IAAI,GAAK,QAAQ,CAAE,CACtB,GAAI,CAACC,MAAM,CAACK,OAAO,CAACC,UAAU,CAAE,CAC/B;AACAC,cAAc,CAACC,cAAc,CAACR,MAAM,CAAC,CAErCA,MAAM,CAACK,OAAO,CAACC,UAAU,CAAG,IAC7B,CAEAN,MAAM,CAACS,SAAS,CAAC,CAClB,CAAC,IAAM,CACNT,MAAM,CAACU,KAAK,CAAC,CACd,CAEA;AACApB,KAAK,CAACqB,cAAc,CAAC,CACtB,CACD,CAAC,CACF,CAAC,EAAE,CAAC"} \ No newline at end of file +{"version":3,"file":"main.min.js","names":["document","addEventListener","event","target","tagName","toLowerCase","attributes","href","value","slice","link","type","dialog","closest","matches","hash","querySelector","dataset","polyfilled","dialogPolyfill","registerDialog","showModal","close","preventDefault"],"sources":["../_patterns/02-components/dialog/dialog.script.js"],"sourcesContent":["/* global dialogPolyfill */\n\n(function () {\n\t// Bind the click events for links (that we'll check for later on)\n\tdocument.addEventListener('click', (event) => {\n\t\t// Determine whether the target of the current link is a dialog\n\t\tif (\n\t\t\tevent.target &&\n\t\t\tevent.target.tagName &&\n\t\t\tevent.target.tagName.toLowerCase() === 'a' &&\n\t\t\tevent.target.attributes.href.value.slice(0, 1) === '#'\n\t\t) {\n\t\t\tconst link = event.target;\n\t\t\tlet type, dialog;\n\n\t\t\t// Determine whether the link is included within a dialog and is the close link\n\t\t\tif (\n\t\t\t\tlink.attributes.href.value === '#' &&\n\t\t\t\tlink.closest('dialog') &&\n\t\t\t\tlink.matches('.elm-link.is-close')\n\t\t\t) {\n\t\t\t\ttype = 'close';\n\t\t\t\tdialog = link.closest('dialog');\n\t\t\t} else if (\n\t\t\t\tlink.hash &&\n\t\t\t\tdocument.querySelector(link.hash) &&\n\t\t\t\tdocument.querySelector(link.hash).tagName.toLowerCase() ===\n\t\t\t\t\t'dialog'\n\t\t\t) {\n\t\t\t\ttype = 'dialog';\n\t\t\t\tdialog = document.querySelector(link.hash);\n\t\t\t} else {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Check for whether the dialog has been registered even already\n\t\t\tif (type === 'dialog') {\n\t\t\t\tif (!dialog.dataset.polyfilled) {\n\t\t\t\t\t// Initially registering the dialog\n\t\t\t\t\tdialogPolyfill.registerDialog(dialog);\n\n\t\t\t\t\tdialog.dataset.polyfilled = true;\n\t\t\t\t}\n\n\t\t\t\tdialog.showModal();\n\t\t\t} else {\n\t\t\t\tdialog.close();\n\t\t\t}\n\n\t\t\t// Prevent the default behaviour of the link\n\t\t\tevent.preventDefault();\n\t\t}\n\t});\n})();\n"],"mappings":"AAAA,2BAEA,CAAC,UAAY,CACZ;AACAA,QAAQ,CAACC,gBAAgB,CAAC,OAAO,CAAGC,KAAK,EAAK,CAC7C;AACA,GACCA,KAAK,CAACC,MAAM,EACZD,KAAK,CAACC,MAAM,CAACC,OAAO,EACpBF,KAAK,CAACC,MAAM,CAACC,OAAO,CAACC,WAAW,CAAC,CAAC,GAAK,GAAG,EAC1CH,KAAK,CAACC,MAAM,CAACG,UAAU,CAACC,IAAI,CAACC,KAAK,CAACC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAC,GAAK,GAAG,CACrD,CACD,KAAM,CAAAC,IAAI,CAAGR,KAAK,CAACC,MAAM,CACzB,GAAI,CAAAQ,IAAI,CAAEC,MAAM,CAEhB;AACA,GACCF,IAAI,CAACJ,UAAU,CAACC,IAAI,CAACC,KAAK,GAAK,GAAG,EAClCE,IAAI,CAACG,OAAO,CAAC,QAAQ,CAAC,EACtBH,IAAI,CAACI,OAAO,CAAC,oBAAoB,CAAC,CACjC,CACDH,IAAI,CAAG,OAAO,CACdC,MAAM,CAAGF,IAAI,CAACG,OAAO,CAAC,QAAQ,CAC/B,CAAC,IAAM,IACNH,IAAI,CAACK,IAAI,EACTf,QAAQ,CAACgB,aAAa,CAACN,IAAI,CAACK,IAAI,CAAC,EACjCf,QAAQ,CAACgB,aAAa,CAACN,IAAI,CAACK,IAAI,CAAC,CAACX,OAAO,CAACC,WAAW,CAAC,CAAC,GACtD,QAAQ,CACR,CACDM,IAAI,CAAG,QAAQ,CACfC,MAAM,CAAGZ,QAAQ,CAACgB,aAAa,CAACN,IAAI,CAACK,IAAI,CAC1C,CAAC,IAAM,CACN,MACD,CAEA;AACA,GAAIJ,IAAI,GAAK,QAAQ,CAAE,CACtB,GAAI,CAACC,MAAM,CAACK,OAAO,CAACC,UAAU,CAAE,CAC/B;AACAC,cAAc,CAACC,cAAc,CAACR,MAAM,CAAC,CAErCA,MAAM,CAACK,OAAO,CAACC,UAAU,CAAG,IAC7B,CAEAN,MAAM,CAACS,SAAS,CAAC,CAClB,CAAC,IAAM,CACNT,MAAM,CAACU,KAAK,CAAC,CACd,CAEA;AACApB,KAAK,CAACqB,cAAc,CAAC,CACtB,CACD,CAAC,CACF,CAAC,EAAE,CAAC","ignoreList":[]} \ No newline at end of file diff --git a/js/plugins.min.js.map b/js/plugins.min.js.map index c72c2d9642..d28f118adb 100644 --- a/js/plugins.min.js.map +++ b/js/plugins.min.js.map @@ -1 +1 @@ -{"version":3,"file":"plugins.min.js","names":["registerFocusRestoreDialog","window","WeakMap","MutationObserver","registered","previousFocus","document","addEventListener","ev","target","dialog","localName","Error","has","set","realShowModal","showModal","savedFocus","activeElement","body","call","mo","hasAttribute","observe","attributes","attributeFilter","get","contains","wasFocus","focus"],"sources":["../_patterns/02-components/dialog/focus-restore.dialog.plugin.js"],"sourcesContent":["// from: https://gist.github.com/samthor/babe9fad4a65625b301ba482dad284d1\n/**\n * Updates the passed dialog to retain focus and restore it when the dialog is closed. Won't\n * upgrade a dialog more than once. Supports IE11+ and is a no-op otherwise.\n * @param {!HTMLDialogElement} dialog to upgrade\n */\nvar registerFocusRestoreDialog = (function() {\n if (!window.WeakMap || !window.MutationObserver) {\n return function() {};\n }\n var registered = new WeakMap();\n\n // store previous focused node centrally\n var previousFocus = null;\n document.addEventListener('focusout', function(ev) {\n previousFocus = ev.target;\n }, true);\n\n return function registerFocusRestoreDialog(dialog) {\n if (dialog.localName !== 'dialog') {\n throw new Error('Failed to upgrade focus on dialog: The element is not a dialog.');\n }\n if (registered.has(dialog)) { return; }\n registered.set(dialog, null);\n\n // replace showModal method directly, to save focus\n var realShowModal = dialog.showModal;\n dialog.showModal = function() {\n var savedFocus = document.activeElement;\n if (savedFocus === document || savedFocus === document.body) {\n // some browsers read activeElement as body\n savedFocus = previousFocus;\n }\n registered.set(dialog, savedFocus);\n realShowModal.call(this);\n };\n\n // watch for 'open' change and clear saved\n var mo = new MutationObserver(function() {\n if (!dialog.hasAttribute('open')) {\n registered.set(dialog, null);\n } else {\n // if open was cleared/set in the same frame, then the dialog will still be a modal (Y)\n }\n });\n mo.observe(dialog, {attributes: true, attributeFilter: ['open']});\n\n // on close, try to focus saved, if possible\n dialog.addEventListener('close', function(ev) {\n if (dialog.hasAttribute('open')) {\n return; // in native, this fires the frame later\n }\n var savedFocus = registered.get(dialog);\n if (document.contains(savedFocus)) {\n var wasFocus = document.activeElement;\n savedFocus.focus();\n if (document.activeElement !== savedFocus) {\n wasFocus.focus(); // restore focus, we couldn't focus saved\n }\n }\n savedFocus = null;\n });\n\n // FIXME: If a modal dialog is readded to the page (either remove/add or .appendChild), it will\n // be a non-modal. It will still have its 'close' handler called and try to focus on the saved\n // element.\n //\n // These could basically be solved if 'close' yielded whether it was a modal or non-modal\n // being closed. But it doesn't. It could also be solved by a permanent MutationObserver, as is\n // done inside the polyfill.\n }\n}());\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,GACA,GAAI,CAAAA,0BAA0B,CAAI,UAAW,CAC3C,GAAI,CAACC,MAAM,CAACC,OAAO,EAAI,CAACD,MAAM,CAACE,gBAAgB,CAAE,CAC/C,MAAO,WAAW,CAAC,CACrB,CACA,GAAI,CAAAC,UAAU,CAAG,GAAI,CAAAF,OAAS,CAE9B;AACA,GAAI,CAAAG,aAAa,CAAG,IAAI,CACxBC,QAAQ,CAACC,gBAAgB,CAAC,UAAU,CAAE,SAASC,EAAE,CAAE,CACjDH,aAAa,CAAGG,EAAE,CAACC,MACrB,CAAC,CAAE,IAAI,CAAC,CAER,MAAO,SAAS,CAAAT,0BAA0BA,CAACU,MAAM,CAAE,CACjD,GAAIA,MAAM,CAACC,SAAS,GAAK,QAAQ,CAAE,CACjC,KAAM,IAAI,CAAAC,KAAK,CAAC,iEAAiE,CACnF,CACA,GAAIR,UAAU,CAACS,GAAG,CAACH,MAAM,CAAC,CAAE,CAAE,MAAQ,CACtCN,UAAU,CAACU,GAAG,CAACJ,MAAM,CAAE,IAAI,CAAC,CAE5B;AACA,GAAI,CAAAK,aAAa,CAAGL,MAAM,CAACM,SAAS,CACpCN,MAAM,CAACM,SAAS,CAAG,UAAW,CAC5B,GAAI,CAAAC,UAAU,CAAGX,QAAQ,CAACY,aAAa,CACvC,GAAID,UAAU,GAAKX,QAAQ,EAAIW,UAAU,GAAKX,QAAQ,CAACa,IAAI,CAAE,CAC3D;AACAF,UAAU,CAAGZ,aACf,CACAD,UAAU,CAACU,GAAG,CAACJ,MAAM,CAAEO,UAAU,CAAC,CAClCF,aAAa,CAACK,IAAI,CAAC,IAAI,CACzB,CAAC,CAED;AACA,GAAI,CAAAC,EAAE,CAAG,GAAI,CAAAlB,gBAAgB,CAAC,UAAW,CACvC,GAAI,CAACO,MAAM,CAACY,YAAY,CAAC,MAAM,CAAC,CAAE,CAChClB,UAAU,CAACU,GAAG,CAACJ,MAAM,CAAE,IAAI,CAC7B,CAAC,IAAM,CACL;AAAA,CAEJ,CAAC,CAAC,CACFW,EAAE,CAACE,OAAO,CAACb,MAAM,CAAE,CAACc,UAAU,CAAE,IAAI,CAAEC,eAAe,CAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAEjE;AACAf,MAAM,CAACH,gBAAgB,CAAC,OAAO,CAAE,SAASC,EAAE,CAAE,CAC5C,GAAIE,MAAM,CAACY,YAAY,CAAC,MAAM,CAAC,CAAE,CAC/B,OAAS;AACX,CACA,GAAI,CAAAL,UAAU,CAAGb,UAAU,CAACsB,GAAG,CAAChB,MAAM,CAAC,CACvC,GAAIJ,QAAQ,CAACqB,QAAQ,CAACV,UAAU,CAAC,CAAE,CACjC,GAAI,CAAAW,QAAQ,CAAGtB,QAAQ,CAACY,aAAa,CACrCD,UAAU,CAACY,KAAK,CAAC,CAAC,CAClB,GAAIvB,QAAQ,CAACY,aAAa,GAAKD,UAAU,CAAE,CACzCW,QAAQ,CAACC,KAAK,CAAC,CAAC,CAAG;AACrB,CACF,CACAZ,UAAU,CAAG,IACf,CAAC,CAAC,CAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACF,CACF,CAAC,CAAC,CAAE"} \ No newline at end of file +{"version":3,"file":"plugins.min.js","names":["registerFocusRestoreDialog","window","WeakMap","MutationObserver","registered","previousFocus","document","addEventListener","ev","target","dialog","localName","Error","has","set","realShowModal","showModal","savedFocus","activeElement","body","call","mo","hasAttribute","observe","attributes","attributeFilter","get","contains","wasFocus","focus"],"sources":["../_patterns/02-components/dialog/focus-restore.dialog.plugin.js"],"sourcesContent":["// from: https://gist.github.com/samthor/babe9fad4a65625b301ba482dad284d1\n/**\n * Updates the passed dialog to retain focus and restore it when the dialog is closed. Won't\n * upgrade a dialog more than once. Supports IE11+ and is a no-op otherwise.\n * @param {!HTMLDialogElement} dialog to upgrade\n */\nvar registerFocusRestoreDialog = (function() {\n if (!window.WeakMap || !window.MutationObserver) {\n return function() {};\n }\n var registered = new WeakMap();\n\n // store previous focused node centrally\n var previousFocus = null;\n document.addEventListener('focusout', function(ev) {\n previousFocus = ev.target;\n }, true);\n\n return function registerFocusRestoreDialog(dialog) {\n if (dialog.localName !== 'dialog') {\n throw new Error('Failed to upgrade focus on dialog: The element is not a dialog.');\n }\n if (registered.has(dialog)) { return; }\n registered.set(dialog, null);\n\n // replace showModal method directly, to save focus\n var realShowModal = dialog.showModal;\n dialog.showModal = function() {\n var savedFocus = document.activeElement;\n if (savedFocus === document || savedFocus === document.body) {\n // some browsers read activeElement as body\n savedFocus = previousFocus;\n }\n registered.set(dialog, savedFocus);\n realShowModal.call(this);\n };\n\n // watch for 'open' change and clear saved\n var mo = new MutationObserver(function() {\n if (!dialog.hasAttribute('open')) {\n registered.set(dialog, null);\n } else {\n // if open was cleared/set in the same frame, then the dialog will still be a modal (Y)\n }\n });\n mo.observe(dialog, {attributes: true, attributeFilter: ['open']});\n\n // on close, try to focus saved, if possible\n dialog.addEventListener('close', function(ev) {\n if (dialog.hasAttribute('open')) {\n return; // in native, this fires the frame later\n }\n var savedFocus = registered.get(dialog);\n if (document.contains(savedFocus)) {\n var wasFocus = document.activeElement;\n savedFocus.focus();\n if (document.activeElement !== savedFocus) {\n wasFocus.focus(); // restore focus, we couldn't focus saved\n }\n }\n savedFocus = null;\n });\n\n // FIXME: If a modal dialog is readded to the page (either remove/add or .appendChild), it will\n // be a non-modal. It will still have its 'close' handler called and try to focus on the saved\n // element.\n //\n // These could basically be solved if 'close' yielded whether it was a modal or non-modal\n // being closed. But it doesn't. It could also be solved by a permanent MutationObserver, as is\n // done inside the polyfill.\n }\n}());\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,GACA,GAAI,CAAAA,0BAA0B,CAAI,UAAW,CAC3C,GAAI,CAACC,MAAM,CAACC,OAAO,EAAI,CAACD,MAAM,CAACE,gBAAgB,CAAE,CAC/C,MAAO,WAAW,CAAC,CACrB,CACA,GAAI,CAAAC,UAAU,CAAG,GAAI,CAAAF,OAAS,CAE9B;AACA,GAAI,CAAAG,aAAa,CAAG,IAAI,CACxBC,QAAQ,CAACC,gBAAgB,CAAC,UAAU,CAAE,SAASC,EAAE,CAAE,CACjDH,aAAa,CAAGG,EAAE,CAACC,MACrB,CAAC,CAAE,IAAI,CAAC,CAER,MAAO,SAAS,CAAAT,0BAA0BA,CAACU,MAAM,CAAE,CACjD,GAAIA,MAAM,CAACC,SAAS,GAAK,QAAQ,CAAE,CACjC,KAAM,IAAI,CAAAC,KAAK,CAAC,iEAAiE,CACnF,CACA,GAAIR,UAAU,CAACS,GAAG,CAACH,MAAM,CAAC,CAAE,CAAE,MAAQ,CACtCN,UAAU,CAACU,GAAG,CAACJ,MAAM,CAAE,IAAI,CAAC,CAE5B;AACA,GAAI,CAAAK,aAAa,CAAGL,MAAM,CAACM,SAAS,CACpCN,MAAM,CAACM,SAAS,CAAG,UAAW,CAC5B,GAAI,CAAAC,UAAU,CAAGX,QAAQ,CAACY,aAAa,CACvC,GAAID,UAAU,GAAKX,QAAQ,EAAIW,UAAU,GAAKX,QAAQ,CAACa,IAAI,CAAE,CAC3D;AACAF,UAAU,CAAGZ,aACf,CACAD,UAAU,CAACU,GAAG,CAACJ,MAAM,CAAEO,UAAU,CAAC,CAClCF,aAAa,CAACK,IAAI,CAAC,IAAI,CACzB,CAAC,CAED;AACA,GAAI,CAAAC,EAAE,CAAG,GAAI,CAAAlB,gBAAgB,CAAC,UAAW,CACvC,GAAI,CAACO,MAAM,CAACY,YAAY,CAAC,MAAM,CAAC,CAAE,CAChClB,UAAU,CAACU,GAAG,CAACJ,MAAM,CAAE,IAAI,CAC7B,CAAC,IAAM,CACL;AAAA,CAEJ,CAAC,CAAC,CACFW,EAAE,CAACE,OAAO,CAACb,MAAM,CAAE,CAACc,UAAU,CAAE,IAAI,CAAEC,eAAe,CAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAEjE;AACAf,MAAM,CAACH,gBAAgB,CAAC,OAAO,CAAE,SAASC,EAAE,CAAE,CAC5C,GAAIE,MAAM,CAACY,YAAY,CAAC,MAAM,CAAC,CAAE,CAC/B,OAAS;AACX,CACA,GAAI,CAAAL,UAAU,CAAGb,UAAU,CAACsB,GAAG,CAAChB,MAAM,CAAC,CACvC,GAAIJ,QAAQ,CAACqB,QAAQ,CAACV,UAAU,CAAC,CAAE,CACjC,GAAI,CAAAW,QAAQ,CAAGtB,QAAQ,CAACY,aAAa,CACrCD,UAAU,CAACY,KAAK,CAAC,CAAC,CAClB,GAAIvB,QAAQ,CAACY,aAAa,GAAKD,UAAU,CAAE,CACzCW,QAAQ,CAACC,KAAK,CAAC,CAAC,CAAG;AACrB,CACF,CACAZ,UAAU,CAAG,IACf,CAAC,CAAC,CAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACF,CACF,CAAC,CAAC,CAAE","ignoreList":[]} \ No newline at end of file diff --git a/patterns/areas-footer-footer-with-border/areas-footer-footer-with-border.rendered.html b/patterns/areas-footer-footer-with-border/areas-footer-footer-with-border.rendered.html index 53babb7e58..e17c3bc2c1 100644 --- a/patterns/areas-footer-footer-with-border/areas-footer-footer-with-border.rendered.html +++ b/patterns/areas-footer-footer-with-border/areas-footer-footer-with-border.rendered.html @@ -12,14 +12,14 @@ - + - - - + + + - + @@ -166,10 +166,10 @@ } - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - @@ -1307,10 +1307,10 @@

Large

} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - @@ -201,10 +201,10 @@

Lorem ipsum dolores sint

} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - @@ -979,10 +979,10 @@

} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - @@ -2991,7 +2991,7 @@

Lorem ipsum dolores sint

@@ -3694,7 +3694,7 @@

@@ -5614,38 +5614,38 @@

- +
- +
- +
@@ -5694,38 +5694,38 @@

- +
- +
- +
@@ -5774,38 +5774,38 @@

- +
- +
- +
@@ -5854,38 +5854,38 @@

- +
- +
- +
@@ -5934,38 +5934,38 @@

- +
- +
- +
@@ -6014,38 +6014,38 @@

- +
- +
- +
@@ -6094,38 +6094,38 @@

- +
- +
- +
@@ -7886,10 +7886,10 @@

} - - - - - - @@ -18509,7 +18509,7 @@

Lorem ipsum dolores sint

@@ -19212,7 +19212,7 @@

@@ -21132,38 +21132,38 @@

- +
- +
- +
@@ -21212,38 +21212,38 @@

- +
- +
- +
@@ -21292,38 +21292,38 @@

- +
- +
- +
@@ -21372,38 +21372,38 @@

- +
- +
- +
@@ -21452,38 +21452,38 @@

- +
- +
- +
@@ -21532,38 +21532,38 @@

- +
- +
- +
@@ -21612,38 +21612,38 @@

- +
- +
- +
@@ -29108,7 +29108,7 @@

DB UI Core

Apache 2.0 license badge - npm version + npm version Based on DB UX Design System guidelines

Personenverkehr und DB Systel führen ihre Design Systeme für Web in der Version 2.0 der Standard Web Components zusammen. Unser Ziel ist eine einheitliche Basis UX im Sinne der Modernen Ikone für Kunden und Mitarbeiteranwendungen. Um unser Design End 2 End von Konzeption über Design bis zur Implementierung konsistent zu halten, wird das DB UX Design System auch in Code von DB Systel und Reisendeninformation umgesetzt. Stay Tuned!

@@ -29588,10 +29588,10 @@

Developed for and driven by the community

} - - \ No newline at end of file diff --git a/version/v2.18.3/js/details-element-polyfill.js b/version/v2.18.3/js/details-element-polyfill.js new file mode 100644 index 0000000000..473ad238ac --- /dev/null +++ b/version/v2.18.3/js/details-element-polyfill.js @@ -0,0 +1,194 @@ +/* +Details Element Polyfill 2.4.0 +Copyright © 2019 Javan Makhmali + */ +(function() { + "use strict"; + var element = document.createElement("details"); + var elementIsNative = typeof HTMLDetailsElement != "undefined" && element instanceof HTMLDetailsElement; + var support = { + open: "open" in element || elementIsNative, + toggle: "ontoggle" in element + }; + var styles = '\ndetails, summary {\n display: block;\n}\ndetails:not([open]) > *:not(summary) {\n display: none;\n}\nsummary::before {\n content: "►";\n padding-right: 0.3rem;\n font-size: 0.6rem;\n cursor: default;\n}\n[open] > summary::before {\n content: "▼";\n}\n'; + var _ref = [], forEach = _ref.forEach, slice = _ref.slice; + if (!support.open) { + polyfillStyles(); + polyfillProperties(); + polyfillToggle(); + polyfillAccessibility(); + } + if (support.open && !support.toggle) { + polyfillToggleEvent(); + } + function polyfillStyles() { + document.head.insertAdjacentHTML("afterbegin", ""); + } + function polyfillProperties() { + var prototype = document.createElement("details").constructor.prototype; + var setAttribute = prototype.setAttribute, removeAttribute = prototype.removeAttribute; + var open = Object.getOwnPropertyDescriptor(prototype, "open"); + Object.defineProperties(prototype, { + open: { + get: function get() { + if (this.tagName == "DETAILS") { + return this.hasAttribute("open"); + } else { + if (open && open.get) { + return open.get.call(this); + } + } + }, + set: function set(value) { + if (this.tagName == "DETAILS") { + return value ? this.setAttribute("open", "") : this.removeAttribute("open"); + } else { + if (open && open.set) { + return open.set.call(this, value); + } + } + } + }, + setAttribute: { + value: function value(name, _value) { + var _this = this; + var call = function call() { + return setAttribute.call(_this, name, _value); + }; + if (name == "open" && this.tagName == "DETAILS") { + var wasOpen = this.hasAttribute("open"); + var result = call(); + if (!wasOpen) { + var summary = this.querySelector("summary"); + if (summary) summary.setAttribute("aria-expanded", true); + triggerToggle(this); + } + return result; + } + return call(); + } + }, + removeAttribute: { + value: function value(name) { + var _this2 = this; + var call = function call() { + return removeAttribute.call(_this2, name); + }; + if (name == "open" && this.tagName == "DETAILS") { + var wasOpen = this.hasAttribute("open"); + var result = call(); + if (wasOpen) { + var summary = this.querySelector("summary"); + if (summary) summary.setAttribute("aria-expanded", false); + triggerToggle(this); + } + return result; + } + return call(); + } + } + }); + } + function polyfillToggle() { + onTogglingTrigger(function(element) { + element.hasAttribute("open") ? element.removeAttribute("open") : element.setAttribute("open", ""); + }); + } + function polyfillToggleEvent() { + if (window.MutationObserver) { + new MutationObserver(function(mutations) { + forEach.call(mutations, function(mutation) { + var target = mutation.target, attributeName = mutation.attributeName; + if (target.tagName == "DETAILS" && attributeName == "open") { + triggerToggle(target); + } + }); + }).observe(document.documentElement, { + attributes: true, + subtree: true + }); + } else { + onTogglingTrigger(function(element) { + var wasOpen = element.getAttribute("open"); + setTimeout(function() { + var isOpen = element.getAttribute("open"); + if (wasOpen != isOpen) { + triggerToggle(element); + } + }, 1); + }); + } + } + function polyfillAccessibility() { + setAccessibilityAttributes(document); + if (window.MutationObserver) { + new MutationObserver(function(mutations) { + forEach.call(mutations, function(mutation) { + forEach.call(mutation.addedNodes, setAccessibilityAttributes); + }); + }).observe(document.documentElement, { + subtree: true, + childList: true + }); + } else { + document.addEventListener("DOMNodeInserted", function(event) { + setAccessibilityAttributes(event.target); + }); + } + } + function setAccessibilityAttributes(root) { + findElementsWithTagName(root, "SUMMARY").forEach(function(summary) { + var details = findClosestElementWithTagName(summary, "DETAILS"); + summary.setAttribute("aria-expanded", details.hasAttribute("open")); + if (!summary.hasAttribute("tabindex")) summary.setAttribute("tabindex", "0"); + if (!summary.hasAttribute("role")) summary.setAttribute("role", "button"); + }); + } + function eventIsSignificant(event) { + return !(event.defaultPrevented || event.ctrlKey || event.metaKey || event.shiftKey || event.target.isContentEditable); + } + function onTogglingTrigger(callback) { + addEventListener("click", function(event) { + if (eventIsSignificant(event)) { + if (event.which <= 1) { + var element = findClosestElementWithTagName(event.target, "SUMMARY"); + if (element && element.parentNode && element.parentNode.tagName == "DETAILS") { + callback(element.parentNode); + } + } + } + }, false); + addEventListener("keydown", function(event) { + if (eventIsSignificant(event)) { + if (event.keyCode == 13 || event.keyCode == 32) { + var element = findClosestElementWithTagName(event.target, "SUMMARY"); + if (element && element.parentNode && element.parentNode.tagName == "DETAILS") { + callback(element.parentNode); + event.preventDefault(); + } + } + } + }, false); + } + function triggerToggle(element) { + var event = document.createEvent("Event"); + event.initEvent("toggle", false, false); + element.dispatchEvent(event); + } + function findElementsWithTagName(root, tagName) { + return (root.tagName == tagName ? [ root ] : []).concat(typeof root.getElementsByTagName == "function" ? slice.call(root.getElementsByTagName(tagName)) : []); + } + function findClosestElementWithTagName(element, tagName) { + if (typeof element.closest == "function") { + return element.closest(tagName); + } else { + while (element) { + if (element.tagName == tagName) { + return element; + } else { + element = element.parentNode; + } + } + } + } +})(); diff --git a/version/v2.18.3/js/dialog-polyfill.js b/version/v2.18.3/js/dialog-polyfill.js new file mode 100644 index 0000000000..aee7d96341 --- /dev/null +++ b/version/v2.18.3/js/dialog-polyfill.js @@ -0,0 +1,866 @@ +(function (global, factory) { + typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : + typeof define === 'function' && define.amd ? define(factory) : + (global = global || self, global.dialogPolyfill = factory()); +}(this, function () { 'use strict'; + + // nb. This is for IE10 and lower _only_. + var supportCustomEvent = window.CustomEvent; + if (!supportCustomEvent || typeof supportCustomEvent === 'object') { + supportCustomEvent = function CustomEvent(event, x) { + x = x || {}; + var ev = document.createEvent('CustomEvent'); + ev.initCustomEvent(event, !!x.bubbles, !!x.cancelable, x.detail || null); + return ev; + }; + supportCustomEvent.prototype = window.Event.prototype; + } + + /** + * Dispatches the passed event to both an "on" handler as well as via the + * normal dispatch operation. Does not bubble. + * + * @param {!EventTarget} target + * @param {!Event} event + * @return {boolean} + */ + function safeDispatchEvent(target, event) { + var check = 'on' + event.type.toLowerCase(); + if (typeof target[check] === 'function') { + target[check](event); + } + return target.dispatchEvent(event); + } + + /** + * @param {Element} el to check for stacking context + * @return {boolean} whether this el or its parents creates a stacking context + */ + function createsStackingContext(el) { + while (el && el !== document.body) { + var s = window.getComputedStyle(el); + var invalid = function(k, ok) { + return !(s[k] === undefined || s[k] === ok); + }; + + if (s.opacity < 1 || + invalid('zIndex', 'auto') || + invalid('transform', 'none') || + invalid('mixBlendMode', 'normal') || + invalid('filter', 'none') || + invalid('perspective', 'none') || + s['isolation'] === 'isolate' || + s.position === 'fixed' || + s.webkitOverflowScrolling === 'touch') { + return true; + } + el = el.parentElement; + } + return false; + } + + /** + * Finds the nearest from the passed element. + * + * @param {Element} el to search from + * @return {HTMLDialogElement} dialog found + */ + function findNearestDialog(el) { + while (el) { + if (el.localName === 'dialog') { + return /** @type {HTMLDialogElement} */ (el); + } + if (el.parentElement) { + el = el.parentElement; + } else if (el.parentNode) { + el = el.parentNode.host; + } else { + el = null; + } + } + return null; + } + + /** + * Blur the specified element, as long as it's not the HTML body element. + * This works around an IE9/10 bug - blurring the body causes Windows to + * blur the whole application. + * + * @param {Element} el to blur + */ + function safeBlur(el) { + // Find the actual focused element when the active element is inside a shadow root + while (el && el.shadowRoot && el.shadowRoot.activeElement) { + el = el.shadowRoot.activeElement; + } + + if (el && el.blur && el !== document.body) { + el.blur(); + } + } + + /** + * @param {!NodeList} nodeList to search + * @param {Node} node to find + * @return {boolean} whether node is inside nodeList + */ + function inNodeList(nodeList, node) { + for (var i = 0; i < nodeList.length; ++i) { + if (nodeList[i] === node) { + return true; + } + } + return false; + } + + /** + * @param {HTMLFormElement} el to check + * @return {boolean} whether this form has method="dialog" + */ + function isFormMethodDialog(el) { + if (!el || !el.hasAttribute('method')) { + return false; + } + return el.getAttribute('method').toLowerCase() === 'dialog'; + } + + /** + * @param {!DocumentFragment|!Element} hostElement + * @return {?Element} + */ + function findFocusableElementWithin(hostElement) { + // Note that this is 'any focusable area'. This list is probably not exhaustive, but the + // alternative involves stepping through and trying to focus everything. + var opts = ['button', 'input', 'keygen', 'select', 'textarea']; + var query = opts.map(function(el) { + return el + ':not([disabled])'; + }); + // TODO(samthor): tabindex values that are not numeric are not focusable. + query.push('[tabindex]:not([disabled]):not([tabindex=""])'); // tabindex != "", not disabled + var target = hostElement.querySelector(query.join(', ')); + + if (!target && 'attachShadow' in Element.prototype) { + // If we haven't found a focusable target, see if the host element contains an element + // which has a shadowRoot. + // Recursively search for the first focusable item in shadow roots. + var elems = hostElement.querySelectorAll('*'); + for (var i = 0; i < elems.length; i++) { + if (elems[i].tagName && elems[i].shadowRoot) { + target = findFocusableElementWithin(elems[i].shadowRoot); + if (target) { + break; + } + } + } + } + return target; + } + + /** + * Determines if an element is attached to the DOM. + * @param {Element} element to check + * @return {boolean} whether the element is in DOM + */ + function isConnected(element) { + return element.isConnected || document.body.contains(element); + } + + /** + * @param {!Event} event + * @return {?Element} + */ + function findFormSubmitter(event) { + if (event.submitter) { + return event.submitter; + } + + var form = event.target; + if (!(form instanceof HTMLFormElement)) { + return null; + } + + var submitter = dialogPolyfill.formSubmitter; + if (!submitter) { + var target = event.target; + var root = ('getRootNode' in target && target.getRootNode() || document); + submitter = root.activeElement; + } + + if (!submitter || submitter.form !== form) { + return null; + } + return submitter; + } + + /** + * @param {!Event} event + */ + function maybeHandleSubmit(event) { + if (event.defaultPrevented) { + return; + } + var form = /** @type {!HTMLFormElement} */ (event.target); + + // We'd have a value if we clicked on an imagemap. + var value = dialogPolyfill.imagemapUseValue; + var submitter = findFormSubmitter(event); + if (value === null && submitter) { + value = submitter.value; + } + + // There should always be a dialog as this handler is added specifically on them, but check just + // in case. + var dialog = findNearestDialog(form); + if (!dialog) { + return; + } + + // Prefer formmethod on the button. + var formmethod = submitter && submitter.getAttribute('formmethod') || form.getAttribute('method'); + if (formmethod !== 'dialog') { + return; + } + event.preventDefault(); + + if (value != null) { + // nb. we explicitly check against null/undefined + dialog.close(value); + } else { + dialog.close(); + } + } + + /** + * @param {!HTMLDialogElement} dialog to upgrade + * @constructor + */ + function dialogPolyfillInfo(dialog) { + this.dialog_ = dialog; + this.replacedStyleTop_ = false; + this.openAsModal_ = false; + + // Set a11y role. Browsers that support dialog implicitly know this already. + if (!dialog.hasAttribute('role')) { + dialog.setAttribute('role', 'dialog'); + } + + dialog.show = this.show.bind(this); + dialog.showModal = this.showModal.bind(this); + dialog.close = this.close.bind(this); + + dialog.addEventListener('submit', maybeHandleSubmit, false); + + if (!('returnValue' in dialog)) { + dialog.returnValue = ''; + } + + if ('MutationObserver' in window) { + var mo = new MutationObserver(this.maybeHideModal.bind(this)); + mo.observe(dialog, {attributes: true, attributeFilter: ['open']}); + } else { + // IE10 and below support. Note that DOMNodeRemoved etc fire _before_ removal. They also + // seem to fire even if the element was removed as part of a parent removal. Use the removed + // events to force downgrade (useful if removed/immediately added). + var removed = false; + var cb = function() { + removed ? this.downgradeModal() : this.maybeHideModal(); + removed = false; + }.bind(this); + var timeout; + var delayModel = function(ev) { + if (ev.target !== dialog) { return; } // not for a child element + var cand = 'DOMNodeRemoved'; + removed |= (ev.type.substr(0, cand.length) === cand); + window.clearTimeout(timeout); + timeout = window.setTimeout(cb, 0); + }; + ['DOMAttrModified', 'DOMNodeRemoved', 'DOMNodeRemovedFromDocument'].forEach(function(name) { + dialog.addEventListener(name, delayModel); + }); + } + // Note that the DOM is observed inside DialogManager while any dialog + // is being displayed as a modal, to catch modal removal from the DOM. + + Object.defineProperty(dialog, 'open', { + set: this.setOpen.bind(this), + get: dialog.hasAttribute.bind(dialog, 'open') + }); + + this.backdrop_ = document.createElement('div'); + this.backdrop_.className = 'backdrop'; + this.backdrop_.addEventListener('mouseup' , this.backdropMouseEvent_.bind(this)); + this.backdrop_.addEventListener('mousedown', this.backdropMouseEvent_.bind(this)); + this.backdrop_.addEventListener('click' , this.backdropMouseEvent_.bind(this)); + } + + dialogPolyfillInfo.prototype = /** @type {HTMLDialogElement.prototype} */ ({ + + get dialog() { + return this.dialog_; + }, + + /** + * Maybe remove this dialog from the modal top layer. This is called when + * a modal dialog may no longer be tenable, e.g., when the dialog is no + * longer open or is no longer part of the DOM. + */ + maybeHideModal: function() { + if (this.dialog_.hasAttribute('open') && isConnected(this.dialog_)) { return; } + this.downgradeModal(); + }, + + /** + * Remove this dialog from the modal top layer, leaving it as a non-modal. + */ + downgradeModal: function() { + if (!this.openAsModal_) { return; } + this.openAsModal_ = false; + this.dialog_.style.zIndex = ''; + + // This won't match the native exactly because if the user set top on a centered + // polyfill dialog, that top gets thrown away when the dialog is closed. Not sure it's + // possible to polyfill this perfectly. + if (this.replacedStyleTop_) { + this.dialog_.style.top = ''; + this.replacedStyleTop_ = false; + } + + // Clear the backdrop and remove from the manager. + this.backdrop_.parentNode && this.backdrop_.parentNode.removeChild(this.backdrop_); + dialogPolyfill.dm.removeDialog(this); + }, + + /** + * @param {boolean} value whether to open or close this dialog + */ + setOpen: function(value) { + if (value) { + this.dialog_.hasAttribute('open') || this.dialog_.setAttribute('open', ''); + } else { + this.dialog_.removeAttribute('open'); + this.maybeHideModal(); // nb. redundant with MutationObserver + } + }, + + /** + * Handles mouse events ('mouseup', 'mousedown', 'click') on the fake .backdrop element, redirecting them as if + * they were on the dialog itself. + * + * @param {!Event} e to redirect + */ + backdropMouseEvent_: function(e) { + if (!this.dialog_.hasAttribute('tabindex')) { + // Clicking on the backdrop should move the implicit cursor, even if dialog cannot be + // focused. Create a fake thing to focus on. If the backdrop was _before_ the dialog, this + // would not be needed - clicks would move the implicit cursor there. + var fake = document.createElement('div'); + this.dialog_.insertBefore(fake, this.dialog_.firstChild); + fake.tabIndex = -1; + fake.focus(); + this.dialog_.removeChild(fake); + } else { + this.dialog_.focus(); + } + + var redirectedEvent = document.createEvent('MouseEvents'); + redirectedEvent.initMouseEvent(e.type, e.bubbles, e.cancelable, window, + e.detail, e.screenX, e.screenY, e.clientX, e.clientY, e.ctrlKey, + e.altKey, e.shiftKey, e.metaKey, e.button, e.relatedTarget); + this.dialog_.dispatchEvent(redirectedEvent); + e.stopPropagation(); + }, + + /** + * Focuses on the first focusable element within the dialog. This will always blur the current + * focus, even if nothing within the dialog is found. + */ + focus_: function() { + // Find element with `autofocus` attribute, or fall back to the first form/tabindex control. + var target = this.dialog_.querySelector('[autofocus]:not([disabled])'); + if (!target && this.dialog_.tabIndex >= 0) { + target = this.dialog_; + } + if (!target) { + target = findFocusableElementWithin(this.dialog_); + } + safeBlur(document.activeElement); + target && target.focus(); + }, + + /** + * Sets the zIndex for the backdrop and dialog. + * + * @param {number} dialogZ + * @param {number} backdropZ + */ + updateZIndex: function(dialogZ, backdropZ) { + if (dialogZ < backdropZ) { + throw new Error('dialogZ should never be < backdropZ'); + } + this.dialog_.style.zIndex = dialogZ; + this.backdrop_.style.zIndex = backdropZ; + }, + + /** + * Shows the dialog. If the dialog is already open, this does nothing. + */ + show: function() { + if (!this.dialog_.open) { + this.setOpen(true); + this.focus_(); + } + }, + + /** + * Show this dialog modally. + */ + showModal: function() { + if (this.dialog_.hasAttribute('open')) { + throw new Error('Failed to execute \'showModal\' on dialog: The element is already open, and therefore cannot be opened modally.'); + } + if (!isConnected(this.dialog_)) { + throw new Error('Failed to execute \'showModal\' on dialog: The element is not in a Document.'); + } + if (!dialogPolyfill.dm.pushDialog(this)) { + throw new Error('Failed to execute \'showModal\' on dialog: There are too many open modal dialogs.'); + } + + if (createsStackingContext(this.dialog_.parentElement)) { + console.warn('A dialog is being shown inside a stacking context. ' + + 'This may cause it to be unusable. For more information, see this link: ' + + 'https://github.com/GoogleChrome/dialog-polyfill/#stacking-context'); + } + + this.setOpen(true); + this.openAsModal_ = true; + + // Optionally center vertically, relative to the current viewport. + if (dialogPolyfill.needsCentering(this.dialog_)) { + dialogPolyfill.reposition(this.dialog_); + this.replacedStyleTop_ = true; + } else { + this.replacedStyleTop_ = false; + } + + // Insert backdrop. + this.dialog_.parentNode.insertBefore(this.backdrop_, this.dialog_.nextSibling); + + // Focus on whatever inside the dialog. + this.focus_(); + }, + + /** + * Closes this HTMLDialogElement. This is optional vs clearing the open + * attribute, however this fires a 'close' event. + * + * @param {string=} opt_returnValue to use as the returnValue + */ + close: function(opt_returnValue) { + if (!this.dialog_.hasAttribute('open')) { + throw new Error('Failed to execute \'close\' on dialog: The element does not have an \'open\' attribute, and therefore cannot be closed.'); + } + this.setOpen(false); + + // Leave returnValue untouched in case it was set directly on the element + if (opt_returnValue !== undefined) { + this.dialog_.returnValue = opt_returnValue; + } + + // Triggering "close" event for any attached listeners on the . + var closeEvent = new supportCustomEvent('close', { + bubbles: false, + cancelable: false + }); + safeDispatchEvent(this.dialog_, closeEvent); + } + + }); + + var dialogPolyfill = {}; + + dialogPolyfill.reposition = function(element) { + var scrollTop = document.body.scrollTop || document.documentElement.scrollTop; + var topValue = scrollTop + (window.innerHeight - element.offsetHeight) / 2; + element.style.top = Math.max(scrollTop, topValue) + 'px'; + }; + + dialogPolyfill.isInlinePositionSetByStylesheet = function(element) { + for (var i = 0; i < document.styleSheets.length; ++i) { + var styleSheet = document.styleSheets[i]; + var cssRules = null; + // Some browsers throw on cssRules. + try { + cssRules = styleSheet.cssRules; + } catch (e) {} + if (!cssRules) { continue; } + for (var j = 0; j < cssRules.length; ++j) { + var rule = cssRules[j]; + var selectedNodes = null; + // Ignore errors on invalid selector texts. + try { + selectedNodes = document.querySelectorAll(rule.selectorText); + } catch(e) {} + if (!selectedNodes || !inNodeList(selectedNodes, element)) { + continue; + } + var cssTop = rule.style.getPropertyValue('top'); + var cssBottom = rule.style.getPropertyValue('bottom'); + if ((cssTop && cssTop !== 'auto') || (cssBottom && cssBottom !== 'auto')) { + return true; + } + } + } + return false; + }; + + dialogPolyfill.needsCentering = function(dialog) { + var computedStyle = window.getComputedStyle(dialog); + if (computedStyle.position !== 'absolute') { + return false; + } + + // We must determine whether the top/bottom specified value is non-auto. In + // WebKit/Blink, checking computedStyle.top == 'auto' is sufficient, but + // Firefox returns the used value. So we do this crazy thing instead: check + // the inline style and then go through CSS rules. + if ((dialog.style.top !== 'auto' && dialog.style.top !== '') || + (dialog.style.bottom !== 'auto' && dialog.style.bottom !== '')) { + return false; + } + return !dialogPolyfill.isInlinePositionSetByStylesheet(dialog); + }; + + /** + * @param {!Element} element to force upgrade + */ + dialogPolyfill.forceRegisterDialog = function(element) { + if (window.HTMLDialogElement || element.showModal) { + console.warn('This browser already supports , the polyfill ' + + 'may not work correctly', element); + } + if (element.localName !== 'dialog') { + throw new Error('Failed to register dialog: The element is not a dialog.'); + } + new dialogPolyfillInfo(/** @type {!HTMLDialogElement} */ (element)); + }; + + /** + * @param {!Element} element to upgrade, if necessary + */ + dialogPolyfill.registerDialog = function(element) { + if (!element.showModal) { + dialogPolyfill.forceRegisterDialog(element); + } + }; + + /** + * @constructor + */ + dialogPolyfill.DialogManager = function() { + /** @type {!Array} */ + this.pendingDialogStack = []; + + var checkDOM = this.checkDOM_.bind(this); + + // The overlay is used to simulate how a modal dialog blocks the document. + // The blocking dialog is positioned on top of the overlay, and the rest of + // the dialogs on the pending dialog stack are positioned below it. In the + // actual implementation, the modal dialog stacking is controlled by the + // top layer, where z-index has no effect. + this.overlay = document.createElement('div'); + this.overlay.className = '_dialog_overlay'; + this.overlay.addEventListener('click', function(e) { + this.forwardTab_ = undefined; + e.stopPropagation(); + checkDOM([]); // sanity-check DOM + }.bind(this)); + + this.handleKey_ = this.handleKey_.bind(this); + this.handleFocus_ = this.handleFocus_.bind(this); + + this.zIndexLow_ = 100000; + this.zIndexHigh_ = 100000 + 150; + + this.forwardTab_ = undefined; + + if ('MutationObserver' in window) { + this.mo_ = new MutationObserver(function(records) { + var removed = []; + records.forEach(function(rec) { + for (var i = 0, c; c = rec.removedNodes[i]; ++i) { + if (!(c instanceof Element)) { + continue; + } else if (c.localName === 'dialog') { + removed.push(c); + } + removed = removed.concat(c.querySelectorAll('dialog')); + } + }); + removed.length && checkDOM(removed); + }); + } + }; + + /** + * Called on the first modal dialog being shown. Adds the overlay and related + * handlers. + */ + dialogPolyfill.DialogManager.prototype.blockDocument = function() { + document.documentElement.addEventListener('focus', this.handleFocus_, true); + document.addEventListener('keydown', this.handleKey_); + this.mo_ && this.mo_.observe(document, {childList: true, subtree: true}); + }; + + /** + * Called on the first modal dialog being removed, i.e., when no more modal + * dialogs are visible. + */ + dialogPolyfill.DialogManager.prototype.unblockDocument = function() { + document.documentElement.removeEventListener('focus', this.handleFocus_, true); + document.removeEventListener('keydown', this.handleKey_); + this.mo_ && this.mo_.disconnect(); + }; + + /** + * Updates the stacking of all known dialogs. + */ + dialogPolyfill.DialogManager.prototype.updateStacking = function() { + var zIndex = this.zIndexHigh_; + + for (var i = 0, dpi; dpi = this.pendingDialogStack[i]; ++i) { + dpi.updateZIndex(--zIndex, --zIndex); + if (i === 0) { + this.overlay.style.zIndex = --zIndex; + } + } + + // Make the overlay a sibling of the dialog itself. + var last = this.pendingDialogStack[0]; + if (last) { + var p = last.dialog.parentNode || document.body; + p.appendChild(this.overlay); + } else if (this.overlay.parentNode) { + this.overlay.parentNode.removeChild(this.overlay); + } + }; + + /** + * @param {Element} candidate to check if contained or is the top-most modal dialog + * @return {boolean} whether candidate is contained in top dialog + */ + dialogPolyfill.DialogManager.prototype.containedByTopDialog_ = function(candidate) { + while (candidate = findNearestDialog(candidate)) { + for (var i = 0, dpi; dpi = this.pendingDialogStack[i]; ++i) { + if (dpi.dialog === candidate) { + return i === 0; // only valid if top-most + } + } + candidate = candidate.parentElement; + } + return false; + }; + + dialogPolyfill.DialogManager.prototype.handleFocus_ = function(event) { + var target = event.composedPath ? event.composedPath()[0] : event.target; + + if (this.containedByTopDialog_(target)) { return; } + + if (document.activeElement === document.documentElement) { return; } + + event.preventDefault(); + event.stopPropagation(); + safeBlur(/** @type {Element} */ (target)); + + if (this.forwardTab_ === undefined) { return; } // move focus only from a tab key + + var dpi = this.pendingDialogStack[0]; + var dialog = dpi.dialog; + var position = dialog.compareDocumentPosition(target); + if (position & Node.DOCUMENT_POSITION_PRECEDING) { + if (this.forwardTab_) { + // forward + dpi.focus_(); + } else if (target !== document.documentElement) { + // backwards if we're not already focused on + document.documentElement.focus(); + } + } + + return false; + }; + + dialogPolyfill.DialogManager.prototype.handleKey_ = function(event) { + this.forwardTab_ = undefined; + if (event.keyCode === 27) { + event.preventDefault(); + event.stopPropagation(); + var cancelEvent = new supportCustomEvent('cancel', { + bubbles: false, + cancelable: true + }); + var dpi = this.pendingDialogStack[0]; + if (dpi && safeDispatchEvent(dpi.dialog, cancelEvent)) { + dpi.dialog.close(); + } + } else if (event.keyCode === 9) { + this.forwardTab_ = !event.shiftKey; + } + }; + + /** + * Finds and downgrades any known modal dialogs that are no longer displayed. Dialogs that are + * removed and immediately readded don't stay modal, they become normal. + * + * @param {!Array} removed that have definitely been removed + */ + dialogPolyfill.DialogManager.prototype.checkDOM_ = function(removed) { + // This operates on a clone because it may cause it to change. Each change also calls + // updateStacking, which only actually needs to happen once. But who removes many modal dialogs + // at a time?! + var clone = this.pendingDialogStack.slice(); + clone.forEach(function(dpi) { + if (removed.indexOf(dpi.dialog) !== -1) { + dpi.downgradeModal(); + } else { + dpi.maybeHideModal(); + } + }); + }; + + /** + * @param {!dialogPolyfillInfo} dpi + * @return {boolean} whether the dialog was allowed + */ + dialogPolyfill.DialogManager.prototype.pushDialog = function(dpi) { + var allowed = (this.zIndexHigh_ - this.zIndexLow_) / 2 - 1; + if (this.pendingDialogStack.length >= allowed) { + return false; + } + if (this.pendingDialogStack.unshift(dpi) === 1) { + this.blockDocument(); + } + this.updateStacking(); + return true; + }; + + /** + * @param {!dialogPolyfillInfo} dpi + */ + dialogPolyfill.DialogManager.prototype.removeDialog = function(dpi) { + var index = this.pendingDialogStack.indexOf(dpi); + if (index === -1) { return; } + + this.pendingDialogStack.splice(index, 1); + if (this.pendingDialogStack.length === 0) { + this.unblockDocument(); + } + this.updateStacking(); + }; + + dialogPolyfill.dm = new dialogPolyfill.DialogManager(); + dialogPolyfill.formSubmitter = null; + dialogPolyfill.imagemapUseValue = null; + + /** + * Installs global handlers, such as click listers and native method overrides. These are needed + * even if a no dialog is registered, as they deal with
. + */ + if (window.HTMLDialogElement === undefined) { + + /** + * If HTMLFormElement translates method="DIALOG" into 'get', then replace the descriptor with + * one that returns the correct value. + */ + var testForm = document.createElement('form'); + testForm.setAttribute('method', 'dialog'); + if (testForm.method !== 'dialog') { + var methodDescriptor = Object.getOwnPropertyDescriptor(HTMLFormElement.prototype, 'method'); + if (methodDescriptor) { + // nb. Some older iOS and older PhantomJS fail to return the descriptor. Don't do anything + // and don't bother to update the element. + var realGet = methodDescriptor.get; + methodDescriptor.get = function() { + if (isFormMethodDialog(this)) { + return 'dialog'; + } + return realGet.call(this); + }; + var realSet = methodDescriptor.set; + /** @this {HTMLElement} */ + methodDescriptor.set = function(v) { + if (typeof v === 'string' && v.toLowerCase() === 'dialog') { + return this.setAttribute('method', v); + } + return realSet.call(this, v); + }; + Object.defineProperty(HTMLFormElement.prototype, 'method', methodDescriptor); + } + } + + /** + * Global 'click' handler, to capture the or + + + +
+
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.hbs b/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.hbs new file mode 100644 index 0000000000..1390b84943 --- /dev/null +++ b/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.hbs @@ -0,0 +1,196 @@ + +
+
+

First column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+

Sixth column

+
+
+ +
+ +
+
+

First column / SCSS Placeholder: %is-four-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-quarters

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-thirds

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-half

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-third

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-quarter

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-fifth

+
+
+

Auto

+
+
+

Auto

+
+
+ diff --git a/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.markup-only.html b/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.markup-only.html new file mode 100644 index 0000000000..1390b84943 --- /dev/null +++ b/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.markup-only.html @@ -0,0 +1,196 @@ + +
+
+

First column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+

Sixth column

+
+
+ +
+ +
+
+

First column / SCSS Placeholder: %is-four-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-quarters

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-thirds

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-half

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-third

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-quarter

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-fifth

+
+
+

Auto

+
+
+

Auto

+
+
+ diff --git a/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.rendered.html b/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.rendered.html new file mode 100644 index 0000000000..5c565ac146 --- /dev/null +++ b/version/v2.18.3/patterns/areas-grid-grid/areas-grid-grid.rendered.html @@ -0,0 +1,313 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+

First column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+

Sixth column

+
+
+ +
+ +
+
+

First column / SCSS Placeholder: %is-four-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-quarters

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-thirds

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-half

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-third

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-quarter

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-fifth

+
+
+

Auto

+
+
+

Auto

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas-grid/index.html b/version/v2.18.3/patterns/areas-grid/index.html new file mode 100644 index 0000000000..d717ee188e --- /dev/null +++ b/version/v2.18.3/patterns/areas-grid/index.html @@ -0,0 +1,379 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Grid +

+ +
+ +
+ +
+
+ +
+ +

+ + + Grid + + + + + +

+ + + +
+ +
+
+ +
+ +
+
+

First column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+

Sixth column

+
+
+ +
+ +
+
+

First column / SCSS Placeholder: %is-four-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-quarters

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-thirds

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-half

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-third

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-quarter

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-fifth

+
+
+

Auto

+
+
+

Auto

+
+
+ + +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.hbs b/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.hbs new file mode 100644 index 0000000000..93091b59f1 --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.hbs @@ -0,0 +1,7 @@ +
+ {{> components-mainnavigation}} + + {{> components-brand }} + + {{> areas-meta loggedIn=loggedIn }} +
diff --git a/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.markup-only.html b/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.markup-only.html new file mode 100644 index 0000000000..c5ec1e798a --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.markup-only.html @@ -0,0 +1,440 @@ +
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + + + + + + + + + +
+
diff --git a/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.rendered.html b/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.rendered.html new file mode 100644 index 0000000000..d183da4a24 --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-header-loggedin/areas-header-header-loggedin.rendered.html @@ -0,0 +1,557 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas-header-header/areas-header-header.hbs b/version/v2.18.3/patterns/areas-header-header/areas-header-header.hbs new file mode 100644 index 0000000000..93091b59f1 --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-header/areas-header-header.hbs @@ -0,0 +1,7 @@ +
+ {{> components-mainnavigation}} + + {{> components-brand }} + + {{> areas-meta loggedIn=loggedIn }} +
diff --git a/version/v2.18.3/patterns/areas-header-header/areas-header-header.markup-only.html b/version/v2.18.3/patterns/areas-header-header/areas-header-header.markup-only.html new file mode 100644 index 0000000000..21c871e90f --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-header/areas-header-header.markup-only.html @@ -0,0 +1,426 @@ +
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + Login + +
+
diff --git a/version/v2.18.3/patterns/areas-header-header/areas-header-header.rendered.html b/version/v2.18.3/patterns/areas-header-header/areas-header-header.rendered.html new file mode 100644 index 0000000000..deb3063384 --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-header/areas-header-header.rendered.html @@ -0,0 +1,543 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + Login + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.hbs b/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.hbs new file mode 100644 index 0000000000..83c4537f30 --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.hbs @@ -0,0 +1,10 @@ +
+ {{> components-sitesearch }} + {{> components-metanavigation navItems='' }} + {{> components-language-switcher }} + {{#if loggedIn }} + {{> components-dropdown id="headerlogin" summary="Ina Wheeler" styleModifier=" is-account" }} + {{else}} + {{> elements-link href='#' value='Login' rel='account' }} + {{/if }} +
diff --git a/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.markup-only.html b/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.markup-only.html new file mode 100644 index 0000000000..1448df92ce --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.markup-only.html @@ -0,0 +1,160 @@ +
+ + + + + Login + +
diff --git a/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.rendered.html b/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.rendered.html new file mode 100644 index 0000000000..d4b9b43008 --- /dev/null +++ b/version/v2.18.3/patterns/areas-header-meta/areas-header-meta.rendered.html @@ -0,0 +1,277 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + Login + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas-header/index.html b/version/v2.18.3/patterns/areas-header/index.html new file mode 100644 index 0000000000..297f33524e --- /dev/null +++ b/version/v2.18.3/patterns/areas-header/index.html @@ -0,0 +1,1297 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Header +

+ +
+ +
+ +
+
+ +
+ +

+ + + Header + + + + + +

+ + + +
+ +
+
+ +
+
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + Login + +
+
+ +
+ + + +
+
+ +
+ +

+ + + Header Loggedin + + + + + +

+ + + +
+ +
+
+ +
+
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + + +
+
+ +
+ + + +
+
+ +
+ +

+ + + Meta + + + + + +

+ + + +
+ +
+
+ +
+
+ + + + + Login + +
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/areas/index.html b/version/v2.18.3/patterns/areas/index.html new file mode 100644 index 0000000000..b4af6f2898 --- /dev/null +++ b/version/v2.18.3/patterns/areas/index.html @@ -0,0 +1,1817 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + + + +
+ +

+ Grid +

+ +
+ +
+ +
+
+ +
+ +

+ + + Grid + + + + + +

+ + + +
+ +
+
+ +
+ +
+
+

First column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+ +
+
+

First column

+
+
+

Second column

+
+
+

Third column

+
+
+

Fourth column

+
+
+

Fifth column

+
+
+

Sixth column

+
+
+ +
+ +
+
+

First column / SCSS Placeholder: %is-four-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-quarters

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-thirds

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-three-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-half

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-two-fifths

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-third

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-quarter

+
+
+

Auto

+
+
+

Auto

+
+
+ +
+
+

First column / SCSS Placeholder: %is-one-fifth

+
+
+

Auto

+
+
+

Auto

+
+
+ + +
+ + + +
+
+ +

+ Header +

+ +
+ +
+ +
+
+ +
+ +

+ + + Header + + + + + +

+ + + +
+ +
+
+ +
+
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + Login + +
+
+ +
+ + + +
+
+ +
+ +

+ + + Header Loggedin + + + + + +

+ + + +
+ +
+
+ +
+
+ + +
+ + + + + + + UI Core +
+ +
+ + + + + + +
+
+ +
+ + + +
+
+ +
+ +

+ + + Meta + + + + + +

+ + + +
+ +
+
+ +
+
+ + + + + Login + +
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.hbs b/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.hbs new file mode 100644 index 0000000000..d4379358e9 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.hbs @@ -0,0 +1,13 @@ +
    + {{#each listItems }} +
  • + {{ name }} + + + + {{ scssvariable }}
    + {{ hex }} +     +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.markup-only.html b/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.markup-only.html new file mode 100644 index 0000000000..ac310a4848 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.markup-only.html @@ -0,0 +1,20 @@ +
    +
  • + DB Success + + + + $db-color-success: $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Error + + + + $db-color-error: $db-color-red-500
    + #EC0016 +     +
    • +
diff --git a/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.rendered.html b/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.rendered.html new file mode 100644 index 0000000000..f5715e953c --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-feedback/base-colors-feedback.rendered.html @@ -0,0 +1,137 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • + DB Success + + + + $db-color-success: $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Error + + + + $db-color-error: $db-color-red-500
    + #EC0016 +     +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.hbs b/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.hbs new file mode 100644 index 0000000000..d4379358e9 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.hbs @@ -0,0 +1,13 @@ +
    + {{#each listItems }} +
  • + {{ name }} + + + + {{ scssvariable }}
    + {{ hex }} +     +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.markup-only.html b/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.markup-only.html new file mode 100644 index 0000000000..11ee056917 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.markup-only.html @@ -0,0 +1,92 @@ +
    +
  • + food & drink + + + + $db-color-food-drink: $db-color-orange-500
    + #f39200 +     +
    • +
  • + health + + + + $db-color-health: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + things to know + + + + $db-color-things-to-know: $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + community facilities + + + + $db-color-community-facilities: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + DB services & facilities + + + + $db-color-db-services-facilities: $db-color-blue-600
    + #0c3992 +     +
    • +
  • + shopping + + + + $db-color-shopping: $db-color-violett-500
    + #814997 +     +
    • +
  • + arts & culture + + + + $db-color-arts-culture: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + leisure + + + + $db-color-leisure: $db-color-green-500
    + #408335 +     +
    • +
  • + services + + + + $db-color-services: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + guidance + + + + $db-color-guidance: $db-color-cool-gray-600
    + #3c414b +     +
    • +
diff --git a/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.rendered.html b/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.rendered.html new file mode 100644 index 0000000000..de4362b9da --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-poi/base-colors-poi.rendered.html @@ -0,0 +1,209 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • + food & drink + + + + $db-color-food-drink: $db-color-orange-500
    + #f39200 +     +
    • +
  • + health + + + + $db-color-health: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + things to know + + + + $db-color-things-to-know: $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + community facilities + + + + $db-color-community-facilities: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + DB services & facilities + + + + $db-color-db-services-facilities: $db-color-blue-600
    + #0c3992 +     +
    • +
  • + shopping + + + + $db-color-shopping: $db-color-violett-500
    + #814997 +     +
    • +
  • + arts & culture + + + + $db-color-arts-culture: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + leisure + + + + $db-color-leisure: $db-color-green-500
    + #408335 +     +
    • +
  • + services + + + + $db-color-services: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + guidance + + + + $db-color-guidance: $db-color-cool-gray-600
    + #3c414b +     +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.hbs b/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.hbs new file mode 100644 index 0000000000..d4379358e9 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.hbs @@ -0,0 +1,13 @@ +
    + {{#each listItems }} +
  • + {{ name }} + + + + {{ scssvariable }}
    + {{ hex }} +     +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.markup-only.html b/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.markup-only.html new file mode 100644 index 0000000000..b84ae15c7b --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.markup-only.html @@ -0,0 +1,29 @@ +
    +
  • + DB Red + + + + $db-color-red
    + #ec0016 +     +
    • +
  • + DB White + + + + $db-color-white
    + #FFFFFF +     +
    • +
  • + DB Black + + + + $db-color-black
    + #000000 +     +
    • +
diff --git a/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.rendered.html b/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.rendered.html new file mode 100644 index 0000000000..001d6399f6 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-primary/base-colors-primary.rendered.html @@ -0,0 +1,146 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • + DB Red + + + + $db-color-red
    + #ec0016 +     +
    • +
  • + DB White + + + + $db-color-white
    + #FFFFFF +     +
    • +
  • + DB Black + + + + $db-color-black
    + #000000 +     +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.hbs b/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.hbs new file mode 100644 index 0000000000..d4379358e9 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.hbs @@ -0,0 +1,13 @@ +
    + {{#each listItems }} +
  • + {{ name }} + + + + {{ scssvariable }}
    + {{ hex }} +     +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.markup-only.html b/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.markup-only.html new file mode 100644 index 0000000000..a1b4b882c2 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.markup-only.html @@ -0,0 +1,938 @@ +
    +
  • + DB Yellow 100 + + + + $db-color-yellow-100
    + #FFFFDC +     +
    • +
  • + DB Yellow 200 + + + + $db-color-yellow-200
    + #FFFFAF +     +
    • +
  • + DB Yellow 300 + + + + $db-color-yellow-300
    + #FFF876 +     +
    • +
  • + DB Yellow 400 + + + + $db-color-yellow-400
    + #FFF000 +     +
    • +
  • + DB Yellow 500 + + + + $db-color-yellow-500
    + #FFD800 +     +
    • +
  • + DB Yellow 600 + + + + $db-color-yellow-600
    + #FFBB00 +     +
    • +
  • + DB Yellow 700 + + + + $db-color-yellow-700
    + #FF9B00 +     +
    • +
  • + DB Yellow 800 + + + + $db-color-yellow-800
    + #FF7A00 +     +
    • +
  • + DB Orange 100 + + + + $db-color-orange-100
    + #FFF4D8 +     +
    • +
  • + DB Orange 200 + + + + $db-color-orange-200
    + #FCE3B4 +     +
    • +
  • + DB Orange 300 + + + + $db-color-orange-300
    + #FACA7F +     +
    • +
  • + DB Orange 400 + + + + $db-color-orange-400
    + #F8AB37 +     +
    • +
  • + DB Orange 500 + + + + $db-color-orange-500
    + #F39200 +     +
    • +
  • + DB Orange 600 + + + + $db-color-orange-600
    + #D77B00 +     +
    • +
  • + DB Orange 700 + + + + $db-color-orange-700
    + #C05E00 +     +
    • +
  • + DB Orange 800 + + + + $db-color-orange-800
    + #A24800 +     +
    • +
  • + DB Red 100 + + + + $db-color-red-100
    + #fEE6E6 +     +
    • +
  • + DB Red 200 + + + + $db-color-red-200
    + #FCC8C3 +     +
    • +
  • + DB Red 300 + + + + $db-color-red-300
    + #FA9090 +     +
    • +
  • + DB Red 400 + + + + $db-color-red-400
    + #F75056 +     +
    • +
  • + DB Red 500 + + + + $db-color-red-500
    + #EC0016 +     +
    • +
  • + DB Red 600 + + + + $db-color-red-600
    + #C50014 +     +
    • +
  • + DB Red 700 + + + + $db-color-red-700
    + #9B000E +     +
    • +
  • + DB Red 800 + + + + $db-color-red-800
    + #740009 +     +
    • +
  • + DB Burgundy 100 + + + + $db-color-burgundy-100
    + #F4E8ED +     +
    • +
  • + DB Burgundy 200 + + + + $db-color-burgundy-200
    + #EDCBD6 +     +
    • +
  • + DB Burgundy 300 + + + + $db-color-burgundy-300
    + #DA9AA8 +     +
    • +
  • + DB Burgundy 400 + + + + $db-color-burgundy-400
    + #C0687B +     +
    • +
  • + DB Burgundy 500 + + + + $db-color-burgundy-500
    + #A9455D +     +
    • +
  • + DB Burgundy 600 + + + + $db-color-burgundy-600
    + #8C2E46 +     +
    • +
  • + DB Burgundy 700 + + + + $db-color-burgundy-700
    + #641E32 +     +
    • +
  • + DB Burgundy 800 + + + + $db-color-burgundy-800
    + #4D0820 +     +
    • +
  • + DB Pink 100 + + + + $db-color-pink-100
    + #FDEEF8 +     +
    • +
  • + DB Pink 200 + + + + $db-color-pink-200
    + #F9D2E5 +     +
    • +
  • + DB Pink 300 + + + + $db-color-pink-300
    + #F4AECE +     +
    • +
  • + DB Pink 400 + + + + $db-color-pink-400
    + #EE7BAE +     +
    • +
  • + DB Pink 500 + + + + $db-color-pink-500
    + #E93E8F +     +
    • +
  • + DB Pink 600 + + + + $db-color-pink-600
    + #DB0078 +     +
    • +
  • + DB Pink 700 + + + + $db-color-pink-700
    + #B80065 +     +
    • +
  • + DB Pink 800 + + + + $db-color-pink-800
    + #970052 +     +
    • +
  • + DB Violett 100 + + + + $db-color-violett-100
    + #F4EEFA +     +
    • +
  • + DB Violett 200 + + + + $db-color-violett-200
    + #E0CDE4 +     +
    • +
  • + DB Violett 300 + + + + $db-color-violett-300
    + #C2A1C7 +     +
    • +
  • + DB Violett 400 + + + + $db-color-violett-400
    + #9A6CA6 +     +
    • +
  • + DB Violett 500 + + + + $db-color-violett-500
    + #814997 +     +
    • +
  • + DB Violett 600 + + + + $db-color-violett-600
    + #6E368C +     +
    • +
  • + DB Violett 700 + + + + $db-color-violett-700
    + #581D70 +     +
    • +
  • + DB Violett 800 + + + + $db-color-violett-800
    + #421857 +     +
    • +
  • + DB Blue 100 + + + + $db-color-blue-100
    + #E0EFFB +     +
    • +
  • + DB Blue 200 + + + + $db-color-blue-200
    + #B4D5F6 +     +
    • +
  • + DB Blue 300 + + + + $db-color-blue-300
    + #73AEF4 +     +
    • +
  • + DB Blue 400 + + + + $db-color-blue-400
    + #347DE0 +     +
    • +
  • + DB Blue 500 + + + + $db-color-blue-500
    + #1455C0 +     +
    • +
  • + DB Blue 600 + + + + $db-color-blue-600
    + #0C3992 +     +
    • +
  • + DB Blue 700 + + + + $db-color-blue-700
    + #0A1E6E +     +
    • +
  • + DB Blue 800 + + + + $db-color-blue-800
    + #061350 +     +
    • +
  • + DB Cyan 100 + + + + $db-color-cyan-100
    + #E5FAFF +     +
    • +
  • + DB Cyan 200 + + + + $db-color-cyan-200
    + #BBE6F8 +     +
    • +
  • + DB Cyan 300 + + + + $db-color-cyan-300
    + #84CFEF +     +
    • +
  • + DB Cyan 400 + + + + $db-color-cyan-400
    + #55B9E6 +     +
    • +
  • + DB Cyan 500 + + + + $db-color-cyan-500
    + #309FD1 +     +
    • +
  • + DB Cyan 600 + + + + $db-color-cyan-600
    + #0087B9 +     +
    • +
  • + DB Cyan 700 + + + + $db-color-cyan-700
    + #006A96 +     +
    • +
  • + DB Cyan 800 + + + + $db-color-cyan-800
    + #004B6D +     +
    • +
  • + DB Turquoise 100 + + + + $db-color-turquoise-100
    + #E3F5F4 +     +
    • +
  • + DB Turquoise 200 + + + + $db-color-turquoise-200
    + #BEE2E5 +     +
    • +
  • + DB Turquoise 300 + + + + $db-color-turquoise-300
    + #83CACA +     +
    • +
  • + DB Turquoise 400 + + + + $db-color-turquoise-400
    + #3CB5AE +     +
    • +
  • + DB Turquoise 500 + + + + $db-color-turquoise-500
    + #00A099 +     +
    • +
  • + DB Turquoise 600 + + + + $db-color-turquoise-600
    + #008984 +     +
    • +
  • + DB Turquoise 700 + + + + $db-color-turquoise-700
    + #006E6B +     +
    • +
  • + DB Turquoise 800 + + + + $db-color-turquoise-800
    + #005752 +     +
    • +
  • + DB Green 100 + + + + $db-color-green-100
    + #E2f3E5 +     +
    • +
  • + DB Green 200 + + + + $db-color-green-200
    + #BDDBB9 +     +
    • +
  • + DB Green 300 + + + + $db-color-green-300
    + #8CBC80 +     +
    • +
  • + DB Green 400 + + + + $db-color-green-400
    + #66A558 +     +
    • +
  • + DB Green 500 + + + + $db-color-green-500
    + #408335 +     +
    • +
  • + DB Green 600 + + + + $db-color-green-600
    + #2A7230 +     +
    • +
  • + DB Green 700 + + + + $db-color-green-700
    + #165C27 +     +
    • +
  • + DB Green 800 + + + + $db-color-green-800
    + #154A26 +     +
    • +
  • + DB Light Green 100 + + + + $db-color-light-green-100
    + #EBF7DD +     +
    • +
  • + DB Light Green 200 + + + + $db-color-light-green-200
    + #C9EB9E +     +
    • +
  • + DB Light Green 300 + + + + $db-color-light-green-300
    + #9FD45F +     +
    • +
  • + DB Light Green 400 + + + + $db-color-light-green-400
    + #78BE14 +     +
    • +
  • + DB Light Green 500 + + + + $db-color-light-green-500
    + #63A615 +     +
    • +
  • + DB Light Green 600 + + + + $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Light Green 700 + + + + $db-color-light-green-700
    + #44741A +     +
    • +
  • + DB Light Green 800 + + + + $db-color-light-green-800
    + #375F15 +     +
    • +
  • + DB Warm Gray 100 + + + + $db-color-warm-gray-100
    + #F5F4F1 +     +
    • +
  • + DB Warm Gray 200 + + + + $db-color-warm-gray-200
    + #DDDED6 +     +
    • +
  • + DB Warm Gray 300 + + + + $db-color-warm-gray-300
    + #BCBBB2 +     +
    • +
  • + DB Warm Gray 400 + + + + $db-color-warm-gray-400
    + #9C9A8E +     +
    • +
  • + DB Warm Gray 500 + + + + $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + DB Warm Gray 600 + + + + $db-color-warm-gray-600
    + #747067 +     +
    • +
  • + DB Warm Gray 700 + + + + $db-color-warm-gray-700
    + #4F4B41 +     +
    • +
  • + DB Warm Gray 800 + + + + $db-color-warm-gray-800
    + #38342F +     +
    • +
  • + DB Cool Gray 100 + + + + $db-color-cool-gray-100
    + #F0F3F5 +     +
    • +
  • + DB Cool Gray 200 + + + + $db-color-cool-gray-200
    + #D7DCE1 +     +
    • +
  • + DB Cool Gray 300 + + + + $db-color-cool-gray-300
    + #AFB4BB +     +
    • +
  • + DB Cool Gray 400 + + + + $db-color-cool-gray-400
    + #878C96 +     +
    • +
  • + DB Cool Gray 500 + + + + $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + DB Cool Gray 600 + + + + $db-color-cool-gray-600
    + #3C414B +     +
    • +
  • + DB Cool Gray 700 + + + + $db-color-cool-gray-700
    + #282D37 +     +
    • +
  • + DB Cool Gray 800 + + + + $db-color-cool-gray-800
    + #131821 +     +
    • +
diff --git a/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.rendered.html b/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.rendered.html new file mode 100644 index 0000000000..a84d2d5fbd --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-secondary/base-colors-secondary.rendered.html @@ -0,0 +1,1055 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • + DB Yellow 100 + + + + $db-color-yellow-100
    + #FFFFDC +     +
    • +
  • + DB Yellow 200 + + + + $db-color-yellow-200
    + #FFFFAF +     +
    • +
  • + DB Yellow 300 + + + + $db-color-yellow-300
    + #FFF876 +     +
    • +
  • + DB Yellow 400 + + + + $db-color-yellow-400
    + #FFF000 +     +
    • +
  • + DB Yellow 500 + + + + $db-color-yellow-500
    + #FFD800 +     +
    • +
  • + DB Yellow 600 + + + + $db-color-yellow-600
    + #FFBB00 +     +
    • +
  • + DB Yellow 700 + + + + $db-color-yellow-700
    + #FF9B00 +     +
    • +
  • + DB Yellow 800 + + + + $db-color-yellow-800
    + #FF7A00 +     +
    • +
  • + DB Orange 100 + + + + $db-color-orange-100
    + #FFF4D8 +     +
    • +
  • + DB Orange 200 + + + + $db-color-orange-200
    + #FCE3B4 +     +
    • +
  • + DB Orange 300 + + + + $db-color-orange-300
    + #FACA7F +     +
    • +
  • + DB Orange 400 + + + + $db-color-orange-400
    + #F8AB37 +     +
    • +
  • + DB Orange 500 + + + + $db-color-orange-500
    + #F39200 +     +
    • +
  • + DB Orange 600 + + + + $db-color-orange-600
    + #D77B00 +     +
    • +
  • + DB Orange 700 + + + + $db-color-orange-700
    + #C05E00 +     +
    • +
  • + DB Orange 800 + + + + $db-color-orange-800
    + #A24800 +     +
    • +
  • + DB Red 100 + + + + $db-color-red-100
    + #fEE6E6 +     +
    • +
  • + DB Red 200 + + + + $db-color-red-200
    + #FCC8C3 +     +
    • +
  • + DB Red 300 + + + + $db-color-red-300
    + #FA9090 +     +
    • +
  • + DB Red 400 + + + + $db-color-red-400
    + #F75056 +     +
    • +
  • + DB Red 500 + + + + $db-color-red-500
    + #EC0016 +     +
    • +
  • + DB Red 600 + + + + $db-color-red-600
    + #C50014 +     +
    • +
  • + DB Red 700 + + + + $db-color-red-700
    + #9B000E +     +
    • +
  • + DB Red 800 + + + + $db-color-red-800
    + #740009 +     +
    • +
  • + DB Burgundy 100 + + + + $db-color-burgundy-100
    + #F4E8ED +     +
    • +
  • + DB Burgundy 200 + + + + $db-color-burgundy-200
    + #EDCBD6 +     +
    • +
  • + DB Burgundy 300 + + + + $db-color-burgundy-300
    + #DA9AA8 +     +
    • +
  • + DB Burgundy 400 + + + + $db-color-burgundy-400
    + #C0687B +     +
    • +
  • + DB Burgundy 500 + + + + $db-color-burgundy-500
    + #A9455D +     +
    • +
  • + DB Burgundy 600 + + + + $db-color-burgundy-600
    + #8C2E46 +     +
    • +
  • + DB Burgundy 700 + + + + $db-color-burgundy-700
    + #641E32 +     +
    • +
  • + DB Burgundy 800 + + + + $db-color-burgundy-800
    + #4D0820 +     +
    • +
  • + DB Pink 100 + + + + $db-color-pink-100
    + #FDEEF8 +     +
    • +
  • + DB Pink 200 + + + + $db-color-pink-200
    + #F9D2E5 +     +
    • +
  • + DB Pink 300 + + + + $db-color-pink-300
    + #F4AECE +     +
    • +
  • + DB Pink 400 + + + + $db-color-pink-400
    + #EE7BAE +     +
    • +
  • + DB Pink 500 + + + + $db-color-pink-500
    + #E93E8F +     +
    • +
  • + DB Pink 600 + + + + $db-color-pink-600
    + #DB0078 +     +
    • +
  • + DB Pink 700 + + + + $db-color-pink-700
    + #B80065 +     +
    • +
  • + DB Pink 800 + + + + $db-color-pink-800
    + #970052 +     +
    • +
  • + DB Violett 100 + + + + $db-color-violett-100
    + #F4EEFA +     +
    • +
  • + DB Violett 200 + + + + $db-color-violett-200
    + #E0CDE4 +     +
    • +
  • + DB Violett 300 + + + + $db-color-violett-300
    + #C2A1C7 +     +
    • +
  • + DB Violett 400 + + + + $db-color-violett-400
    + #9A6CA6 +     +
    • +
  • + DB Violett 500 + + + + $db-color-violett-500
    + #814997 +     +
    • +
  • + DB Violett 600 + + + + $db-color-violett-600
    + #6E368C +     +
    • +
  • + DB Violett 700 + + + + $db-color-violett-700
    + #581D70 +     +
    • +
  • + DB Violett 800 + + + + $db-color-violett-800
    + #421857 +     +
    • +
  • + DB Blue 100 + + + + $db-color-blue-100
    + #E0EFFB +     +
    • +
  • + DB Blue 200 + + + + $db-color-blue-200
    + #B4D5F6 +     +
    • +
  • + DB Blue 300 + + + + $db-color-blue-300
    + #73AEF4 +     +
    • +
  • + DB Blue 400 + + + + $db-color-blue-400
    + #347DE0 +     +
    • +
  • + DB Blue 500 + + + + $db-color-blue-500
    + #1455C0 +     +
    • +
  • + DB Blue 600 + + + + $db-color-blue-600
    + #0C3992 +     +
    • +
  • + DB Blue 700 + + + + $db-color-blue-700
    + #0A1E6E +     +
    • +
  • + DB Blue 800 + + + + $db-color-blue-800
    + #061350 +     +
    • +
  • + DB Cyan 100 + + + + $db-color-cyan-100
    + #E5FAFF +     +
    • +
  • + DB Cyan 200 + + + + $db-color-cyan-200
    + #BBE6F8 +     +
    • +
  • + DB Cyan 300 + + + + $db-color-cyan-300
    + #84CFEF +     +
    • +
  • + DB Cyan 400 + + + + $db-color-cyan-400
    + #55B9E6 +     +
    • +
  • + DB Cyan 500 + + + + $db-color-cyan-500
    + #309FD1 +     +
    • +
  • + DB Cyan 600 + + + + $db-color-cyan-600
    + #0087B9 +     +
    • +
  • + DB Cyan 700 + + + + $db-color-cyan-700
    + #006A96 +     +
    • +
  • + DB Cyan 800 + + + + $db-color-cyan-800
    + #004B6D +     +
    • +
  • + DB Turquoise 100 + + + + $db-color-turquoise-100
    + #E3F5F4 +     +
    • +
  • + DB Turquoise 200 + + + + $db-color-turquoise-200
    + #BEE2E5 +     +
    • +
  • + DB Turquoise 300 + + + + $db-color-turquoise-300
    + #83CACA +     +
    • +
  • + DB Turquoise 400 + + + + $db-color-turquoise-400
    + #3CB5AE +     +
    • +
  • + DB Turquoise 500 + + + + $db-color-turquoise-500
    + #00A099 +     +
    • +
  • + DB Turquoise 600 + + + + $db-color-turquoise-600
    + #008984 +     +
    • +
  • + DB Turquoise 700 + + + + $db-color-turquoise-700
    + #006E6B +     +
    • +
  • + DB Turquoise 800 + + + + $db-color-turquoise-800
    + #005752 +     +
    • +
  • + DB Green 100 + + + + $db-color-green-100
    + #E2f3E5 +     +
    • +
  • + DB Green 200 + + + + $db-color-green-200
    + #BDDBB9 +     +
    • +
  • + DB Green 300 + + + + $db-color-green-300
    + #8CBC80 +     +
    • +
  • + DB Green 400 + + + + $db-color-green-400
    + #66A558 +     +
    • +
  • + DB Green 500 + + + + $db-color-green-500
    + #408335 +     +
    • +
  • + DB Green 600 + + + + $db-color-green-600
    + #2A7230 +     +
    • +
  • + DB Green 700 + + + + $db-color-green-700
    + #165C27 +     +
    • +
  • + DB Green 800 + + + + $db-color-green-800
    + #154A26 +     +
    • +
  • + DB Light Green 100 + + + + $db-color-light-green-100
    + #EBF7DD +     +
    • +
  • + DB Light Green 200 + + + + $db-color-light-green-200
    + #C9EB9E +     +
    • +
  • + DB Light Green 300 + + + + $db-color-light-green-300
    + #9FD45F +     +
    • +
  • + DB Light Green 400 + + + + $db-color-light-green-400
    + #78BE14 +     +
    • +
  • + DB Light Green 500 + + + + $db-color-light-green-500
    + #63A615 +     +
    • +
  • + DB Light Green 600 + + + + $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Light Green 700 + + + + $db-color-light-green-700
    + #44741A +     +
    • +
  • + DB Light Green 800 + + + + $db-color-light-green-800
    + #375F15 +     +
    • +
  • + DB Warm Gray 100 + + + + $db-color-warm-gray-100
    + #F5F4F1 +     +
    • +
  • + DB Warm Gray 200 + + + + $db-color-warm-gray-200
    + #DDDED6 +     +
    • +
  • + DB Warm Gray 300 + + + + $db-color-warm-gray-300
    + #BCBBB2 +     +
    • +
  • + DB Warm Gray 400 + + + + $db-color-warm-gray-400
    + #9C9A8E +     +
    • +
  • + DB Warm Gray 500 + + + + $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + DB Warm Gray 600 + + + + $db-color-warm-gray-600
    + #747067 +     +
    • +
  • + DB Warm Gray 700 + + + + $db-color-warm-gray-700
    + #4F4B41 +     +
    • +
  • + DB Warm Gray 800 + + + + $db-color-warm-gray-800
    + #38342F +     +
    • +
  • + DB Cool Gray 100 + + + + $db-color-cool-gray-100
    + #F0F3F5 +     +
    • +
  • + DB Cool Gray 200 + + + + $db-color-cool-gray-200
    + #D7DCE1 +     +
    • +
  • + DB Cool Gray 300 + + + + $db-color-cool-gray-300
    + #AFB4BB +     +
    • +
  • + DB Cool Gray 400 + + + + $db-color-cool-gray-400
    + #878C96 +     +
    • +
  • + DB Cool Gray 500 + + + + $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + DB Cool Gray 600 + + + + $db-color-cool-gray-600
    + #3C414B +     +
    • +
  • + DB Cool Gray 700 + + + + $db-color-cool-gray-700
    + #282D37 +     +
    • +
  • + DB Cool Gray 800 + + + + $db-color-cool-gray-800
    + #131821 +     +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.hbs b/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.hbs new file mode 100644 index 0000000000..d4379358e9 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.hbs @@ -0,0 +1,13 @@ +
    + {{#each listItems }} +
  • + {{ name }} + + + + {{ scssvariable }}
    + {{ hex }} +     +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.markup-only.html b/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.markup-only.html new file mode 100644 index 0000000000..28fc5d1f57 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.markup-only.html @@ -0,0 +1,146 @@ +
    +
  • + ICE + + + + $db-color-ice: $db-color-cool-gray-700
    + #282d37 +     +
    • +
  • + IC + + + + $db-color-ic: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + EC + + + + $db-color-ec: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + RE + + + + $db-color-re: $db-color-cool-gray-400
    + #878c96 +     +
    • +
  • + RB + + + + $db-color-rb: $db-color-cool-gray-300
    + #afb4bb +     +
    • +
  • + S-Bahn + + + + $db-color-s-bahn: $db-color-green-500
    + #408335 +     +
    • +
  • + U-Bahn + + + + $db-color-u-bahn: $db-color-blue-500
    + #1455c0 +     +
    • +
  • + Tram + + + + $db-color-tram: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + Intercity Bus + + + + $db-color-intercity-bus: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + Bus + + + + $db-color-bus: $db-color-violett-500
    + #814997 +     +
    • +
  • + ship + + + + $db-color-ship: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + plane + + + + $db-color-plane: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + taxi + + + + $db-color-taxi: $db-color-yellow-500
    + #ffd800 +     +
    • +
  • + carsharing + + + + $db-color-carsharing: $db-color-orange-500
    + #f39200 +     +
    • +
  • + bikesharing + + + + $db-color-bikesharing: $db-color-light-green-500
    + #63a615 +     +
    • +
  • + walking + + + + $db-color-walking: $db-color-cool-gray-200
    + #d7dce1 +     +
    • +
diff --git a/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.rendered.html b/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.rendered.html new file mode 100644 index 0000000000..1f5cb7ccf5 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors-transportation/base-colors-transportation.rendered.html @@ -0,0 +1,263 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • + ICE + + + + $db-color-ice: $db-color-cool-gray-700
    + #282d37 +     +
    • +
  • + IC + + + + $db-color-ic: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + EC + + + + $db-color-ec: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + RE + + + + $db-color-re: $db-color-cool-gray-400
    + #878c96 +     +
    • +
  • + RB + + + + $db-color-rb: $db-color-cool-gray-300
    + #afb4bb +     +
    • +
  • + S-Bahn + + + + $db-color-s-bahn: $db-color-green-500
    + #408335 +     +
    • +
  • + U-Bahn + + + + $db-color-u-bahn: $db-color-blue-500
    + #1455c0 +     +
    • +
  • + Tram + + + + $db-color-tram: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + Intercity Bus + + + + $db-color-intercity-bus: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + Bus + + + + $db-color-bus: $db-color-violett-500
    + #814997 +     +
    • +
  • + ship + + + + $db-color-ship: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + plane + + + + $db-color-plane: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + taxi + + + + $db-color-taxi: $db-color-yellow-500
    + #ffd800 +     +
    • +
  • + carsharing + + + + $db-color-carsharing: $db-color-orange-500
    + #f39200 +     +
    • +
  • + bikesharing + + + + $db-color-bikesharing: $db-color-light-green-500
    + #63a615 +     +
    • +
  • + walking + + + + $db-color-walking: $db-color-cool-gray-200
    + #d7dce1 +     +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-colors/index.html b/version/v2.18.3/patterns/base-colors/index.html new file mode 100644 index 0000000000..a26febed90 --- /dev/null +++ b/version/v2.18.3/patterns/base-colors/index.html @@ -0,0 +1,1599 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Colors +

+ +
+

Source

+

We're using the colors provided by our other product DB UI Base, by which Design tokens are being provided.

+

Accessibility

+

Please have a look at the related page within the Marketingportal for more information as well: https://marketingportal.extranet.deutschebahn.com/marketingportal/Basiselemente/Farbe

+

Criteria

+

WCAG 2.1 (Level AA)

+

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

+

Large Text

+

Large-scale text and images of large-scale text have a contrast ratio of at least 3:1

+

DB color palette for InDesign, Illustrator and Photoshop

+

A file containing the Deutsche Bahn color palette for Adobe InDesign, Adobe Illustrator or Adobe Photoshop is provided by the DB Marketingportal.

+

Inspirational external sources for this pattern

+ + +
+ +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Primary + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + DB Red + + + + $db-color-red
    + #ec0016 +     +
    • +
  • + DB White + + + + $db-color-white
    + #FFFFFF +     +
    • +
  • + DB Black + + + + $db-color-black
    + #000000 +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Secondary + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + DB Yellow 100 + + + + $db-color-yellow-100
    + #FFFFDC +     +
    • +
  • + DB Yellow 200 + + + + $db-color-yellow-200
    + #FFFFAF +     +
    • +
  • + DB Yellow 300 + + + + $db-color-yellow-300
    + #FFF876 +     +
    • +
  • + DB Yellow 400 + + + + $db-color-yellow-400
    + #FFF000 +     +
    • +
  • + DB Yellow 500 + + + + $db-color-yellow-500
    + #FFD800 +     +
    • +
  • + DB Yellow 600 + + + + $db-color-yellow-600
    + #FFBB00 +     +
    • +
  • + DB Yellow 700 + + + + $db-color-yellow-700
    + #FF9B00 +     +
    • +
  • + DB Yellow 800 + + + + $db-color-yellow-800
    + #FF7A00 +     +
    • +
  • + DB Orange 100 + + + + $db-color-orange-100
    + #FFF4D8 +     +
    • +
  • + DB Orange 200 + + + + $db-color-orange-200
    + #FCE3B4 +     +
    • +
  • + DB Orange 300 + + + + $db-color-orange-300
    + #FACA7F +     +
    • +
  • + DB Orange 400 + + + + $db-color-orange-400
    + #F8AB37 +     +
    • +
  • + DB Orange 500 + + + + $db-color-orange-500
    + #F39200 +     +
    • +
  • + DB Orange 600 + + + + $db-color-orange-600
    + #D77B00 +     +
    • +
  • + DB Orange 700 + + + + $db-color-orange-700
    + #C05E00 +     +
    • +
  • + DB Orange 800 + + + + $db-color-orange-800
    + #A24800 +     +
    • +
  • + DB Red 100 + + + + $db-color-red-100
    + #fEE6E6 +     +
    • +
  • + DB Red 200 + + + + $db-color-red-200
    + #FCC8C3 +     +
    • +
  • + DB Red 300 + + + + $db-color-red-300
    + #FA9090 +     +
    • +
  • + DB Red 400 + + + + $db-color-red-400
    + #F75056 +     +
    • +
  • + DB Red 500 + + + + $db-color-red-500
    + #EC0016 +     +
    • +
  • + DB Red 600 + + + + $db-color-red-600
    + #C50014 +     +
    • +
  • + DB Red 700 + + + + $db-color-red-700
    + #9B000E +     +
    • +
  • + DB Red 800 + + + + $db-color-red-800
    + #740009 +     +
    • +
  • + DB Burgundy 100 + + + + $db-color-burgundy-100
    + #F4E8ED +     +
    • +
  • + DB Burgundy 200 + + + + $db-color-burgundy-200
    + #EDCBD6 +     +
    • +
  • + DB Burgundy 300 + + + + $db-color-burgundy-300
    + #DA9AA8 +     +
    • +
  • + DB Burgundy 400 + + + + $db-color-burgundy-400
    + #C0687B +     +
    • +
  • + DB Burgundy 500 + + + + $db-color-burgundy-500
    + #A9455D +     +
    • +
  • + DB Burgundy 600 + + + + $db-color-burgundy-600
    + #8C2E46 +     +
    • +
  • + DB Burgundy 700 + + + + $db-color-burgundy-700
    + #641E32 +     +
    • +
  • + DB Burgundy 800 + + + + $db-color-burgundy-800
    + #4D0820 +     +
    • +
  • + DB Pink 100 + + + + $db-color-pink-100
    + #FDEEF8 +     +
    • +
  • + DB Pink 200 + + + + $db-color-pink-200
    + #F9D2E5 +     +
    • +
  • + DB Pink 300 + + + + $db-color-pink-300
    + #F4AECE +     +
    • +
  • + DB Pink 400 + + + + $db-color-pink-400
    + #EE7BAE +     +
    • +
  • + DB Pink 500 + + + + $db-color-pink-500
    + #E93E8F +     +
    • +
  • + DB Pink 600 + + + + $db-color-pink-600
    + #DB0078 +     +
    • +
  • + DB Pink 700 + + + + $db-color-pink-700
    + #B80065 +     +
    • +
  • + DB Pink 800 + + + + $db-color-pink-800
    + #970052 +     +
    • +
  • + DB Violett 100 + + + + $db-color-violett-100
    + #F4EEFA +     +
    • +
  • + DB Violett 200 + + + + $db-color-violett-200
    + #E0CDE4 +     +
    • +
  • + DB Violett 300 + + + + $db-color-violett-300
    + #C2A1C7 +     +
    • +
  • + DB Violett 400 + + + + $db-color-violett-400
    + #9A6CA6 +     +
    • +
  • + DB Violett 500 + + + + $db-color-violett-500
    + #814997 +     +
    • +
  • + DB Violett 600 + + + + $db-color-violett-600
    + #6E368C +     +
    • +
  • + DB Violett 700 + + + + $db-color-violett-700
    + #581D70 +     +
    • +
  • + DB Violett 800 + + + + $db-color-violett-800
    + #421857 +     +
    • +
  • + DB Blue 100 + + + + $db-color-blue-100
    + #E0EFFB +     +
    • +
  • + DB Blue 200 + + + + $db-color-blue-200
    + #B4D5F6 +     +
    • +
  • + DB Blue 300 + + + + $db-color-blue-300
    + #73AEF4 +     +
    • +
  • + DB Blue 400 + + + + $db-color-blue-400
    + #347DE0 +     +
    • +
  • + DB Blue 500 + + + + $db-color-blue-500
    + #1455C0 +     +
    • +
  • + DB Blue 600 + + + + $db-color-blue-600
    + #0C3992 +     +
    • +
  • + DB Blue 700 + + + + $db-color-blue-700
    + #0A1E6E +     +
    • +
  • + DB Blue 800 + + + + $db-color-blue-800
    + #061350 +     +
    • +
  • + DB Cyan 100 + + + + $db-color-cyan-100
    + #E5FAFF +     +
    • +
  • + DB Cyan 200 + + + + $db-color-cyan-200
    + #BBE6F8 +     +
    • +
  • + DB Cyan 300 + + + + $db-color-cyan-300
    + #84CFEF +     +
    • +
  • + DB Cyan 400 + + + + $db-color-cyan-400
    + #55B9E6 +     +
    • +
  • + DB Cyan 500 + + + + $db-color-cyan-500
    + #309FD1 +     +
    • +
  • + DB Cyan 600 + + + + $db-color-cyan-600
    + #0087B9 +     +
    • +
  • + DB Cyan 700 + + + + $db-color-cyan-700
    + #006A96 +     +
    • +
  • + DB Cyan 800 + + + + $db-color-cyan-800
    + #004B6D +     +
    • +
  • + DB Turquoise 100 + + + + $db-color-turquoise-100
    + #E3F5F4 +     +
    • +
  • + DB Turquoise 200 + + + + $db-color-turquoise-200
    + #BEE2E5 +     +
    • +
  • + DB Turquoise 300 + + + + $db-color-turquoise-300
    + #83CACA +     +
    • +
  • + DB Turquoise 400 + + + + $db-color-turquoise-400
    + #3CB5AE +     +
    • +
  • + DB Turquoise 500 + + + + $db-color-turquoise-500
    + #00A099 +     +
    • +
  • + DB Turquoise 600 + + + + $db-color-turquoise-600
    + #008984 +     +
    • +
  • + DB Turquoise 700 + + + + $db-color-turquoise-700
    + #006E6B +     +
    • +
  • + DB Turquoise 800 + + + + $db-color-turquoise-800
    + #005752 +     +
    • +
  • + DB Green 100 + + + + $db-color-green-100
    + #E2f3E5 +     +
    • +
  • + DB Green 200 + + + + $db-color-green-200
    + #BDDBB9 +     +
    • +
  • + DB Green 300 + + + + $db-color-green-300
    + #8CBC80 +     +
    • +
  • + DB Green 400 + + + + $db-color-green-400
    + #66A558 +     +
    • +
  • + DB Green 500 + + + + $db-color-green-500
    + #408335 +     +
    • +
  • + DB Green 600 + + + + $db-color-green-600
    + #2A7230 +     +
    • +
  • + DB Green 700 + + + + $db-color-green-700
    + #165C27 +     +
    • +
  • + DB Green 800 + + + + $db-color-green-800
    + #154A26 +     +
    • +
  • + DB Light Green 100 + + + + $db-color-light-green-100
    + #EBF7DD +     +
    • +
  • + DB Light Green 200 + + + + $db-color-light-green-200
    + #C9EB9E +     +
    • +
  • + DB Light Green 300 + + + + $db-color-light-green-300
    + #9FD45F +     +
    • +
  • + DB Light Green 400 + + + + $db-color-light-green-400
    + #78BE14 +     +
    • +
  • + DB Light Green 500 + + + + $db-color-light-green-500
    + #63A615 +     +
    • +
  • + DB Light Green 600 + + + + $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Light Green 700 + + + + $db-color-light-green-700
    + #44741A +     +
    • +
  • + DB Light Green 800 + + + + $db-color-light-green-800
    + #375F15 +     +
    • +
  • + DB Warm Gray 100 + + + + $db-color-warm-gray-100
    + #F5F4F1 +     +
    • +
  • + DB Warm Gray 200 + + + + $db-color-warm-gray-200
    + #DDDED6 +     +
    • +
  • + DB Warm Gray 300 + + + + $db-color-warm-gray-300
    + #BCBBB2 +     +
    • +
  • + DB Warm Gray 400 + + + + $db-color-warm-gray-400
    + #9C9A8E +     +
    • +
  • + DB Warm Gray 500 + + + + $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + DB Warm Gray 600 + + + + $db-color-warm-gray-600
    + #747067 +     +
    • +
  • + DB Warm Gray 700 + + + + $db-color-warm-gray-700
    + #4F4B41 +     +
    • +
  • + DB Warm Gray 800 + + + + $db-color-warm-gray-800
    + #38342F +     +
    • +
  • + DB Cool Gray 100 + + + + $db-color-cool-gray-100
    + #F0F3F5 +     +
    • +
  • + DB Cool Gray 200 + + + + $db-color-cool-gray-200
    + #D7DCE1 +     +
    • +
  • + DB Cool Gray 300 + + + + $db-color-cool-gray-300
    + #AFB4BB +     +
    • +
  • + DB Cool Gray 400 + + + + $db-color-cool-gray-400
    + #878C96 +     +
    • +
  • + DB Cool Gray 500 + + + + $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + DB Cool Gray 600 + + + + $db-color-cool-gray-600
    + #3C414B +     +
    • +
  • + DB Cool Gray 700 + + + + $db-color-cool-gray-700
    + #282D37 +     +
    • +
  • + DB Cool Gray 800 + + + + $db-color-cool-gray-800
    + #131821 +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Feedback + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + DB Success + + + + $db-color-success: $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Error + + + + $db-color-error: $db-color-red-500
    + #EC0016 +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - POI + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + food & drink + + + + $db-color-food-drink: $db-color-orange-500
    + #f39200 +     +
    • +
  • + health + + + + $db-color-health: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + things to know + + + + $db-color-things-to-know: $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + community facilities + + + + $db-color-community-facilities: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + DB services & facilities + + + + $db-color-db-services-facilities: $db-color-blue-600
    + #0c3992 +     +
    • +
  • + shopping + + + + $db-color-shopping: $db-color-violett-500
    + #814997 +     +
    • +
  • + arts & culture + + + + $db-color-arts-culture: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + leisure + + + + $db-color-leisure: $db-color-green-500
    + #408335 +     +
    • +
  • + services + + + + $db-color-services: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + guidance + + + + $db-color-guidance: $db-color-cool-gray-600
    + #3c414b +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Transport + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + ICE + + + + $db-color-ice: $db-color-cool-gray-700
    + #282d37 +     +
    • +
  • + IC + + + + $db-color-ic: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + EC + + + + $db-color-ec: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + RE + + + + $db-color-re: $db-color-cool-gray-400
    + #878c96 +     +
    • +
  • + RB + + + + $db-color-rb: $db-color-cool-gray-300
    + #afb4bb +     +
    • +
  • + S-Bahn + + + + $db-color-s-bahn: $db-color-green-500
    + #408335 +     +
    • +
  • + U-Bahn + + + + $db-color-u-bahn: $db-color-blue-500
    + #1455c0 +     +
    • +
  • + Tram + + + + $db-color-tram: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + Intercity Bus + + + + $db-color-intercity-bus: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + Bus + + + + $db-color-bus: $db-color-violett-500
    + #814997 +     +
    • +
  • + ship + + + + $db-color-ship: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + plane + + + + $db-color-plane: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + taxi + + + + $db-color-taxi: $db-color-yellow-500
    + #ffd800 +     +
    • +
  • + carsharing + + + + $db-color-carsharing: $db-color-orange-500
    + #f39200 +     +
    • +
  • + bikesharing + + + + $db-color-bikesharing: $db-color-light-green-500
    + #63a615 +     +
    • +
  • + walking + + + + $db-color-walking: $db-color-cool-gray-200
    + #d7dce1 +     +
    • +
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.markup-only.html new file mode 100644 index 0000000000..6a1bf5c825 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.markup-only.html @@ -0,0 +1,21 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 16, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 16, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 16, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="16-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.rendered.html new file mode 100644 index 0000000000..54776cfcb2 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 16, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 16, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 16, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="16-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.markup-only.html new file mode 100644 index 0000000000..11e968c05a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 16, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="16-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.rendered.html new file mode 100644 index 0000000000..4f5c660c46 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 16, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="16-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.markup-only.html new file mode 100644 index 0000000000..0d4c0203bd --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.markup-only.html @@ -0,0 +1,15 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 16, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 16, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="16-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.rendered.html new file mode 100644 index 0000000000..5de8a468e3 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 16, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 16, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="16-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.markup-only.html new file mode 100644 index 0000000000..de65696cee --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.markup-only.html @@ -0,0 +1,21 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(add), 16, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 16, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 16, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="16-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.rendered.html new file mode 100644 index 0000000000..1dceee5537 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(add), 16, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 16, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 16, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="16-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.markup-only.html new file mode 100644 index 0000000000..ee99298edc --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.markup-only.html @@ -0,0 +1,57 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 16, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 16, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 16, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 16, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 16, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 16, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 16, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 16, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 16, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="16-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.rendered.html new file mode 100644 index 0000000000..78b13915a2 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.rendered.html @@ -0,0 +1,174 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 16, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 16, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 16, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 16, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 16, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 16, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 16, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 16, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 16, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="16-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.markup-only.html new file mode 100644 index 0000000000..6f3e284c11 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.markup-only.html @@ -0,0 +1,213 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "filled")
      • +
    • HTML: data-icon="account" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "filled")
      • +
    • HTML: data-icon="block" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "filled")
      • +
    • HTML: data-icon="build" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "filled")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "filled")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "filled")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "filled")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "filled")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "filled")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "filled")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "filled")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "filled")
      • +
    • HTML: data-icon="image" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "filled")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "filled")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "filled")
      • +
    • HTML: data-icon="print" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "filled")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "filled")
      • +
    • HTML: data-icon="save" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "filled")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "filled")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "filled")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "filled")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.rendered.html new file mode 100644 index 0000000000..0bf5764e7b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.rendered.html @@ -0,0 +1,330 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "filled")
      • +
    • HTML: data-icon="account" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "filled")
      • +
    • HTML: data-icon="block" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "filled")
      • +
    • HTML: data-icon="build" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "filled")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "filled")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "filled")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "filled")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "filled")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "filled")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "filled")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "filled")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "filled")
      • +
    • HTML: data-icon="image" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "filled")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "filled")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "filled")
      • +
    • HTML: data-icon="print" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "filled")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "filled")
      • +
    • HTML: data-icon="save" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "filled")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "filled")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "filled")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "filled")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.markup-only.html new file mode 100644 index 0000000000..a10d38f421 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.markup-only.html @@ -0,0 +1,51 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "filled")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.rendered.html new file mode 100644 index 0000000000..133603208f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.rendered.html @@ -0,0 +1,168 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "filled")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.markup-only.html new file mode 100644 index 0000000000..2ea2cd323f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.markup-only.html @@ -0,0 +1,45 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "filled")
      • +
    • HTML: data-icon="call" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "filled")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "filled")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "filled")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "filled")
      • +
    • HTML: data-icon="question" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "filled")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "filled")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.rendered.html new file mode 100644 index 0000000000..94882b2ff1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "filled")
      • +
    • HTML: data-icon="call" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "filled")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "filled")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "filled")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "filled")
      • +
    • HTML: data-icon="question" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "filled")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "filled")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.markup-only.html new file mode 100644 index 0000000000..a1c45e6d92 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.markup-only.html @@ -0,0 +1,45 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "filled")
      • +
    • HTML: data-icon="day" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "filled")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "filled")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "filled")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "filled")
      • +
    • HTML: data-icon="night" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "filled")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "filled")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.rendered.html new file mode 100644 index 0000000000..e0d23ad1ef --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "filled")
      • +
    • HTML: data-icon="day" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "filled")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "filled")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "filled")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "filled")
      • +
    • HTML: data-icon="night" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "filled")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "filled")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.markup-only.html new file mode 100644 index 0000000000..3623bdcf06 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "filled")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.rendered.html new file mode 100644 index 0000000000..23c65cbaf0 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "filled")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.markup-only.html new file mode 100644 index 0000000000..f411dbabb1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "filled")
      • +
    • HTML: data-icon="database" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.rendered.html new file mode 100644 index 0000000000..2bff9dd8c2 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "filled")
      • +
    • HTML: data-icon="database" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.markup-only.html new file mode 100644 index 0000000000..2f3d65c10f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.markup-only.html @@ -0,0 +1,33 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "filled")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.rendered.html new file mode 100644 index 0000000000..40c7246083 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.rendered.html @@ -0,0 +1,150 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "filled")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.markup-only.html new file mode 100644 index 0000000000..3de9eb85ac --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.markup-only.html @@ -0,0 +1,39 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "filled")
      • +
    • HTML: data-icon="home" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "filled")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "filled")
      • +
    • HTML: data-icon="place" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "filled")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.rendered.html new file mode 100644 index 0000000000..e9c6cc5694 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.rendered.html @@ -0,0 +1,156 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "filled")
      • +
    • HTML: data-icon="home" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "filled")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "filled")
      • +
    • HTML: data-icon="place" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "filled")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.markup-only.html new file mode 100644 index 0000000000..51e3b8dc7a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.markup-only.html @@ -0,0 +1,15 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "filled")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.rendered.html new file mode 100644 index 0000000000..a45b92f0de --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "filled")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.markup-only.html new file mode 100644 index 0000000000..533f02cfb0 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.markup-only.html @@ -0,0 +1,15 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.rendered.html new file mode 100644 index 0000000000..9dcaff9545 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.markup-only.html new file mode 100644 index 0000000000..e70729f20c --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.markup-only.html @@ -0,0 +1,21 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "filled")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "filled")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "filled")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.rendered.html new file mode 100644 index 0000000000..c8638db20f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "filled")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "filled")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "filled")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.markup-only.html new file mode 100644 index 0000000000..80218db07e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.markup-only.html @@ -0,0 +1,153 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.rendered.html new file mode 100644 index 0000000000..ee00a32a59 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.rendered.html @@ -0,0 +1,270 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.markup-only.html new file mode 100644 index 0000000000..d9d6253c8b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.markup-only.html @@ -0,0 +1,561 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 20, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 20, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 20, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 20, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 20, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 20, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 20, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 20, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 20, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 20, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 20, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 20, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 20, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 20, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 20, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 20, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 20, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 20, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 20, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 20, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 20, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 20, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 20, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 20, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 20, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 20, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 20, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 20, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 20, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 20, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 20, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 20, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 20, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 20, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 20, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 20, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 20, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 20, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 20, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 20, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 20, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 20, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 20, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 20, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 20, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 20, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 20, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 20, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 20, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 20, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 20, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 20, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 20, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 20, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 20, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 20, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.rendered.html new file mode 100644 index 0000000000..d9679aa684 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.rendered.html @@ -0,0 +1,678 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 20, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 20, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 20, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 20, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 20, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 20, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 20, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 20, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 20, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 20, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 20, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 20, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 20, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 20, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 20, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 20, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 20, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 20, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 20, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 20, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 20, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 20, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 20, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 20, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 20, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 20, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 20, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 20, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 20, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 20, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 20, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 20, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 20, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 20, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 20, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 20, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 20, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 20, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 20, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 20, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 20, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 20, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 20, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 20, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 20, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 20, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 20, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 20, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 20, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 20, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 20, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 20, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 20, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 20, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 20, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 20, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.markup-only.html new file mode 100644 index 0000000000..b5a7f873b2 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.markup-only.html @@ -0,0 +1,117 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 20, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 20, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 20, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 20, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 20, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.rendered.html new file mode 100644 index 0000000000..e00c1d8518 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.rendered.html @@ -0,0 +1,234 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 20, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 20, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 20, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 20, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 20, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.markup-only.html new file mode 100644 index 0000000000..bb2395f71e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 20, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.rendered.html new file mode 100644 index 0000000000..5da82a3528 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 20, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.markup-only.html new file mode 100644 index 0000000000..dd5d7e7e10 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.markup-only.html @@ -0,0 +1,81 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 20, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 20, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 20, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 20, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 20, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 20, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.rendered.html new file mode 100644 index 0000000000..f46f861447 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.rendered.html @@ -0,0 +1,198 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 20, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 20, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 20, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 20, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 20, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 20, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.markup-only.html new file mode 100644 index 0000000000..4a216e2205 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 20, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.rendered.html new file mode 100644 index 0000000000..e898630522 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 20, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.markup-only.html new file mode 100644 index 0000000000..58951a164f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.markup-only.html @@ -0,0 +1,63 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 20, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 20, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 20, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 20, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 20, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 20, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 20, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 20, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 20, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 20, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.rendered.html new file mode 100644 index 0000000000..7d069d1301 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.rendered.html @@ -0,0 +1,180 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 20, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 20, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 20, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 20, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 20, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 20, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 20, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 20, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 20, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 20, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.markup-only.html new file mode 100644 index 0000000000..df98e5aa4e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.markup-only.html @@ -0,0 +1,135 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 20, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 20, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 20, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 20, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 20, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 20, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 20, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 20, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 20, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 20, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 20, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 20, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 20, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 20, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 20, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.rendered.html new file mode 100644 index 0000000000..8a6ea91fd1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.rendered.html @@ -0,0 +1,252 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 20, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 20, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 20, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 20, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 20, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 20, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 20, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 20, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 20, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 20, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 20, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 20, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 20, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 20, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 20, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.markup-only.html new file mode 100644 index 0000000000..2dcc98eaec --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.markup-only.html @@ -0,0 +1,27 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 20, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 20, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 20, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.rendered.html new file mode 100644 index 0000000000..c384da799a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.rendered.html @@ -0,0 +1,144 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 20, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 20, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 20, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.markup-only.html new file mode 100644 index 0000000000..eac4a16547 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.rendered.html new file mode 100644 index 0000000000..079fabf886 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.markup-only.html new file mode 100644 index 0000000000..270082a0db --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.markup-only.html @@ -0,0 +1,87 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 20, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 20, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 20, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 20, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 20, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 20, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 20, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 20, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 20, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.rendered.html new file mode 100644 index 0000000000..a556cfa779 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.rendered.html @@ -0,0 +1,204 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 20, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 20, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 20, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 20, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 20, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 20, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 20, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 20, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 20, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.markup-only.html new file mode 100644 index 0000000000..2be90e79ad --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.markup-only.html @@ -0,0 +1,87 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 20, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 20, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 20, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 20, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 20, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 20, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.rendered.html new file mode 100644 index 0000000000..e92da3b906 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.rendered.html @@ -0,0 +1,204 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 20, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 20, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 20, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 20, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 20, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 20, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.markup-only.html new file mode 100644 index 0000000000..4bb75643a5 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.markup-only.html @@ -0,0 +1,123 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 20, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 20, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 20, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 20, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 20, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 20, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 20, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 20, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 20, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 20, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 20, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 20, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 20, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 20, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 20, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 20, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 20, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 20, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.rendered.html new file mode 100644 index 0000000000..d8e7723a03 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.rendered.html @@ -0,0 +1,240 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 20, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 20, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 20, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 20, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 20, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 20, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 20, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 20, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 20, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 20, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 20, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 20, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 20, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 20, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 20, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 20, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 20, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 20, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.markup-only.html new file mode 100644 index 0000000000..f63ed20cf2 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.markup-only.html @@ -0,0 +1,27 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 20, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 20, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.rendered.html new file mode 100644 index 0000000000..f67cbb2a7b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.rendered.html @@ -0,0 +1,144 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 20, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 20, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.markup-only.html new file mode 100644 index 0000000000..eedef1dbf5 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.markup-only.html @@ -0,0 +1,69 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 20, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 20, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 20, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 20, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 20, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 20, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 20, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 20, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 20, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 20, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 20, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.rendered.html new file mode 100644 index 0000000000..4b4f03f1be --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.rendered.html @@ -0,0 +1,186 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 20, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 20, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 20, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 20, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 20, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 20, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 20, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 20, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 20, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 20, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 20, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.markup-only.html new file mode 100644 index 0000000000..fb91377660 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.markup-only.html @@ -0,0 +1,141 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 20, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 20, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 20, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 20, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 20, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 20, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 20, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 20, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 20, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 20, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 20, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 20, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 20, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 20, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 20, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 20, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.rendered.html new file mode 100644 index 0000000000..ba19d72691 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.rendered.html @@ -0,0 +1,258 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 20, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 20, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 20, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 20, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 20, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 20, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 20, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 20, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 20, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 20, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 20, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 20, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 20, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 20, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 20, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 20, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.markup-only.html new file mode 100644 index 0000000000..a646f9c6c8 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.markup-only.html @@ -0,0 +1,201 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 20, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-bus), 20, "outline")
      • +
    • HTML: data-icon="ev-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-train), 20, "outline")
      • +
    • HTML: data-icon="ev-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 20, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 20, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 20, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 20, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 20, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.rendered.html new file mode 100644 index 0000000000..ae11519b39 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.rendered.html @@ -0,0 +1,318 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 20, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-bus), 20, "outline")
      • +
    • HTML: data-icon="ev-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-train), 20, "outline")
      • +
    • HTML: data-icon="ev-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 20, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 20, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 20, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 20, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 20, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.markup-only.html new file mode 100644 index 0000000000..51c3b8e186 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.markup-only.html @@ -0,0 +1,75 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "filled")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "filled")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "filled")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "filled")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "filled")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "filled")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "filled")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "filled")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "filled")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "filled")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "filled")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "filled")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.rendered.html new file mode 100644 index 0000000000..ec36206aa7 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.rendered.html @@ -0,0 +1,192 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "filled")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "filled")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "filled")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "filled")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "filled")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "filled")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "filled")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "filled")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "filled")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "filled")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "filled")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "filled")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.markup-only.html new file mode 100644 index 0000000000..c3c50c426e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.markup-only.html @@ -0,0 +1,45 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "filled")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "filled")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "filled")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "filled")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "filled")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "filled")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "filled")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.rendered.html new file mode 100644 index 0000000000..737dbf3df4 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "filled")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "filled")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "filled")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "filled")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "filled")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "filled")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "filled")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.markup-only.html new file mode 100644 index 0000000000..b40fdb788b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.markup-only.html @@ -0,0 +1,33 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "filled")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.rendered.html new file mode 100644 index 0000000000..f109ceac7a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.rendered.html @@ -0,0 +1,150 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "filled")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.markup-only.html new file mode 100644 index 0000000000..996649858a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.markup-only.html @@ -0,0 +1,15 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "filled")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "filled")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.rendered.html new file mode 100644 index 0000000000..4e8dfd718d --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "filled")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "filled")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.markup-only.html new file mode 100644 index 0000000000..35ac5a5161 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.markup-only.html @@ -0,0 +1,9 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "filled")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.rendered.html new file mode 100644 index 0000000000..95f082b177 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "filled")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.markup-only.html new file mode 100644 index 0000000000..f788d34427 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.markup-only.html @@ -0,0 +1,15 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "filled")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "filled")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.rendered.html new file mode 100644 index 0000000000..8948d1ed47 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "filled")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "filled")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.markup-only.html new file mode 100644 index 0000000000..80a4acb33b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.markup-only.html @@ -0,0 +1,153 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "filled")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "filled")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "filled")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "filled")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "filled")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "filled")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "filled")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "filled")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "filled")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "filled")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "filled")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "filled")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "filled")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "filled")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "filled")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "filled")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "filled")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "filled")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "filled")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "filled")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "filled")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "filled")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "filled")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "filled")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.rendered.html new file mode 100644 index 0000000000..c96cebf18d --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.rendered.html @@ -0,0 +1,270 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "filled")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "filled")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "filled")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "filled")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "filled")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "filled")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "filled")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "filled")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "filled")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "filled")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "filled")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "filled")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "filled")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "filled")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "filled")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "filled")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "filled")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "filled")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "filled")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "filled")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "filled")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "filled")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "filled")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "filled")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.markup-only.html new file mode 100644 index 0000000000..cb36643fd3 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.markup-only.html @@ -0,0 +1,561 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(account)) or @include icon(glyph(account), 24, "outline")
      • +
    • HTML: data-icon="account" or data-icon="account" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add)) or @include icon(glyph(add), 24, "outline")
      • +
    • HTML: data-icon="add" or data-icon="add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "outline")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link)) or @include icon(glyph(add-link), 24, "outline")
      • +
    • HTML: data-icon="add-link" or data-icon="add-link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm)) or @include icon(glyph(alarm), 24, "outline")
      • +
    • HTML: data-icon="alarm" or data-icon="alarm" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add)) or @include icon(glyph(alarm-add), 24, "outline")
      • +
    • HTML: data-icon="alarm-add" or data-icon="alarm-add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "outline")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off)) or @include icon(glyph(alert-off), 24, "outline")
      • +
    • HTML: data-icon="alert-off" or data-icon="alert-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment)) or @include icon(glyph(attachment), 24, "outline")
      • +
    • HTML: data-icon="attachment" or data-icon="attachment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality)) or @include icon(glyph(augmented-reality), 24, "outline")
      • +
    • HTML: data-icon="augmented-reality" or data-icon="augmented-reality" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block)) or @include icon(glyph(block), 24, "outline")
      • +
    • HTML: data-icon="block" or data-icon="block" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "outline")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug)) or @include icon(glyph(bug), 24, "outline")
      • +
    • HTML: data-icon="bug" or data-icon="bug" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build)) or @include icon(glyph(build), 24, "outline")
      • +
    • HTML: data-icon="build" or data-icon="build" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar)) or @include icon(glyph(calendar), 24, "outline")
      • +
    • HTML: data-icon="calendar" or data-icon="calendar" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "outline")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash)) or @include icon(glyph(cash), 24, "outline")
      • +
    • HTML: data-icon="cash" or data-icon="cash" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "outline")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "outline")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download)) or @include icon(glyph(cloud-download), 24, "outline")
      • +
    • HTML: data-icon="cloud-download" or data-icon="cloud-download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload)) or @include icon(glyph(cloud-upload), 24, "outline")
      • +
    • HTML: data-icon="cloud-upload" or data-icon="cloud-upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass)) or @include icon(glyph(compass), 24, "outline")
      • +
    • HTML: data-icon="compass" or data-icon="compass" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy)) or @include icon(glyph(copy), 24, "outline")
      • +
    • HTML: data-icon="copy" or data-icon="copy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card)) or @include icon(glyph(credit-card), 24, "outline")
      • +
    • HTML: data-icon="credit-card" or data-icon="credit-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard)) or @include icon(glyph(dashboard), 24, "outline")
      • +
    • HTML: data-icon="dashboard" or data-icon="dashboard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete)) or @include icon(glyph(delete), 24, "outline")
      • +
    • HTML: data-icon="delete" or data-icon="delete" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount)) or @include icon(glyph(discount), 24, "outline")
      • +
    • HTML: data-icon="discount" or data-icon="discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document)) or @include icon(glyph(document), 24, "outline")
      • +
    • HTML: data-icon="document" or data-icon="document" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check)) or @include icon(glyph(document-check), 24, "outline")
      • +
    • HTML: data-icon="document-check" or data-icon="document-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done)) or @include icon(glyph(done), 24, "outline")
      • +
    • HTML: data-icon="done" or data-icon="done" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download)) or @include icon(glyph(download), 24, "outline")
      • +
    • HTML: data-icon="download" or data-icon="download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop)) or @include icon(glyph(drag-and-drop), 24, "outline")
      • +
    • HTML: data-icon="drag-and-drop" or data-icon="drag-and-drop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit)) or @include icon(glyph(edit), 24, "outline")
      • +
    • HTML: data-icon="edit" or data-icon="edit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted)) or @include icon(glyph(face-delighted), 24, "outline")
      • +
    • HTML: data-icon="face-delighted" or data-icon="face-delighted" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed)) or @include icon(glyph(face-disappointed), 24, "outline")
      • +
    • HTML: data-icon="face-disappointed" or data-icon="face-disappointed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral)) or @include icon(glyph(face-neutral), 24, "outline")
      • +
    • HTML: data-icon="face-neutral" or data-icon="face-neutral" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad)) or @include icon(glyph(face-sad), 24, "outline")
      • +
    • HTML: data-icon="face-sad" or data-icon="face-sad" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling)) or @include icon(glyph(face-smiling), 24, "outline")
      • +
    • HTML: data-icon="face-smiling" or data-icon="face-smiling" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter)) or @include icon(glyph(filter), 24, "outline")
      • +
    • HTML: data-icon="filter" or data-icon="filter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint)) or @include icon(glyph(fingerprint), 24, "outline")
      • +
    • HTML: data-icon="fingerprint" or data-icon="fingerprint" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder)) or @include icon(glyph(folder), 24, "outline")
      • +
    • HTML: data-icon="folder" or data-icon="folder" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open)) or @include icon(glyph(folder-open), 24, "outline")
      • +
    • HTML: data-icon="folder-open" or data-icon="folder-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card)) or @include icon(glyph(generic-card), 24, "outline")
      • +
    • HTML: data-icon="generic-card" or data-icon="generic-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard)) or @include icon(glyph(giftcard), 24, "outline")
      • +
    • HTML: data-icon="giftcard" or data-icon="giftcard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing)) or @include icon(glyph(hearing), 24, "outline")
      • +
    • HTML: data-icon="hearing" or data-icon="hearing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled)) or @include icon(glyph(hearing-disabled), 24, "outline")
      • +
    • HTML: data-icon="hearing-disabled" or data-icon="hearing-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "outline")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "outline")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image)) or @include icon(glyph(image), 24, "outline")
      • +
    • HTML: data-icon="image" or data-icon="image" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "outline")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key)) or @include icon(glyph(key), 24, "outline")
      • +
    • HTML: data-icon="key" or data-icon="key" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal)) or @include icon(glyph(legal), 24, "outline")
      • +
    • HTML: data-icon="legal" or data-icon="legal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb)) or @include icon(glyph(lightbulb), 24, "outline")
      • +
    • HTML: data-icon="lightbulb" or data-icon="lightbulb" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close)) or @include icon(glyph(lock-close), 24, "outline")
      • +
    • HTML: data-icon="lock-close" or data-icon="lock-close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open)) or @include icon(glyph(lock-open), 24, "outline")
      • +
    • HTML: data-icon="lock-open" or data-icon="lock-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out)) or @include icon(glyph(log-out), 24, "outline")
      • +
    • HTML: data-icon="log-out" or data-icon="log-out" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook)) or @include icon(glyph(logbook), 24, "outline")
      • +
    • HTML: data-icon="logbook" or data-icon="logbook" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus)) or @include icon(glyph(minus), 24, "outline")
      • +
    • HTML: data-icon="minus" or data-icon="minus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank)) or @include icon(glyph(piggybank), 24, "outline")
      • +
    • HTML: data-icon="piggybank" or data-icon="piggybank" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "outline")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print)) or @include icon(glyph(print), 24, "outline")
      • +
    • HTML: data-icon="print" or data-icon="print" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button)) or @include icon(glyph(push-button), 24, "outline")
      • +
    • HTML: data-icon="push-button" or data-icon="push-button" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "outline")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize)) or @include icon(glyph(resize), 24, "outline")
      • +
    • HTML: data-icon="resize" or data-icon="resize" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner)) or @include icon(glyph(resize-handle-corner), 24, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" or data-icon="resize-handle-corner" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save)) or @include icon(glyph(save), 24, "outline")
      • +
    • HTML: data-icon="save" or data-icon="save" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule)) or @include icon(glyph(schedule), 24, "outline")
      • +
    • HTML: data-icon="schedule" or data-icon="schedule" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search)) or @include icon(glyph(search), 24, "outline")
      • +
    • HTML: data-icon="search" or data-icon="search" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send)) or @include icon(glyph(send), 24, "outline")
      • +
    • HTML: data-icon="send" or data-icon="send" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa)) or @include icon(glyph(sepa), 24, "outline")
      • +
    • HTML: data-icon="sepa" or data-icon="sepa" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings)) or @include icon(glyph(settings), 24, "outline")
      • +
    • HTML: data-icon="settings" or data-icon="settings" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share)) or @include icon(glyph(share), 24, "outline")
      • +
    • HTML: data-icon="share" or data-icon="share" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag)) or @include icon(glyph(shopping-bag), 24, "outline")
      • +
    • HTML: data-icon="shopping-bag" or data-icon="shopping-bag" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket)) or @include icon(glyph(shopping-basket), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket" or data-icon="shopping-basket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled)) or @include icon(glyph(shopping-basket-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" or data-icon="shopping-basket-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart)) or @include icon(glyph(shopping-cart), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart" or data-icon="shopping-cart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled)) or @include icon(glyph(shopping-cart-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" or data-icon="shopping-cart-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down)) or @include icon(glyph(sort-down), 24, "outline")
      • +
    • HTML: data-icon="sort-down" or data-icon="sort-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up)) or @include icon(glyph(sort-up), 24, "outline")
      • +
    • HTML: data-icon="sort-up" or data-icon="sort-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "outline")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal)) or @include icon(glyph(swap-horizontal), 24, "outline")
      • +
    • HTML: data-icon="swap-horizontal" or data-icon="swap-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical)) or @include icon(glyph(swap-vertical), 24, "outline")
      • +
    • HTML: data-icon="swap-vertical" or data-icon="swap-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up)) or @include icon(glyph(thumb-up), 24, "outline")
      • +
    • HTML: data-icon="thumb-up" or data-icon="thumb-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down)) or @include icon(glyph(thumb-up-down), 24, "outline")
      • +
    • HTML: data-icon="thumb-up-down" or data-icon="thumb-up-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation)) or @include icon(glyph(translation), 24, "outline")
      • +
    • HTML: data-icon="translation" or data-icon="translation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo)) or @include icon(glyph(undo), 24, "outline")
      • +
    • HTML: data-icon="undo" or data-icon="undo" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload)) or @include icon(glyph(upload), 24, "outline")
      • +
    • HTML: data-icon="upload" or data-icon="upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility)) or @include icon(glyph(visibility), 24, "outline")
      • +
    • HTML: data-icon="visibility" or data-icon="visibility" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off)) or @include icon(glyph(visibility-off), 24, "outline")
      • +
    • HTML: data-icon="visibility-off" or data-icon="visibility-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher)) or @include icon(glyph(voucher), 24, "outline")
      • +
    • HTML: data-icon="voucher" or data-icon="voucher" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website)) or @include icon(glyph(website), 24, "outline")
      • +
    • HTML: data-icon="website" or data-icon="website" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in)) or @include icon(glyph(zoom-in), 24, "outline")
      • +
    • HTML: data-icon="zoom-in" or data-icon="zoom-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out)) or @include icon(glyph(zoom-out), 24, "outline")
      • +
    • HTML: data-icon="zoom-out" or data-icon="zoom-out" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.rendered.html new file mode 100644 index 0000000000..8ba0a81895 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.rendered.html @@ -0,0 +1,678 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(account)) or @include icon(glyph(account), 24, "outline")
      • +
    • HTML: data-icon="account" or data-icon="account" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add)) or @include icon(glyph(add), 24, "outline")
      • +
    • HTML: data-icon="add" or data-icon="add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "outline")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link)) or @include icon(glyph(add-link), 24, "outline")
      • +
    • HTML: data-icon="add-link" or data-icon="add-link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm)) or @include icon(glyph(alarm), 24, "outline")
      • +
    • HTML: data-icon="alarm" or data-icon="alarm" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add)) or @include icon(glyph(alarm-add), 24, "outline")
      • +
    • HTML: data-icon="alarm-add" or data-icon="alarm-add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "outline")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off)) or @include icon(glyph(alert-off), 24, "outline")
      • +
    • HTML: data-icon="alert-off" or data-icon="alert-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment)) or @include icon(glyph(attachment), 24, "outline")
      • +
    • HTML: data-icon="attachment" or data-icon="attachment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality)) or @include icon(glyph(augmented-reality), 24, "outline")
      • +
    • HTML: data-icon="augmented-reality" or data-icon="augmented-reality" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block)) or @include icon(glyph(block), 24, "outline")
      • +
    • HTML: data-icon="block" or data-icon="block" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "outline")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug)) or @include icon(glyph(bug), 24, "outline")
      • +
    • HTML: data-icon="bug" or data-icon="bug" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build)) or @include icon(glyph(build), 24, "outline")
      • +
    • HTML: data-icon="build" or data-icon="build" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar)) or @include icon(glyph(calendar), 24, "outline")
      • +
    • HTML: data-icon="calendar" or data-icon="calendar" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "outline")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash)) or @include icon(glyph(cash), 24, "outline")
      • +
    • HTML: data-icon="cash" or data-icon="cash" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "outline")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "outline")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download)) or @include icon(glyph(cloud-download), 24, "outline")
      • +
    • HTML: data-icon="cloud-download" or data-icon="cloud-download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload)) or @include icon(glyph(cloud-upload), 24, "outline")
      • +
    • HTML: data-icon="cloud-upload" or data-icon="cloud-upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass)) or @include icon(glyph(compass), 24, "outline")
      • +
    • HTML: data-icon="compass" or data-icon="compass" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy)) or @include icon(glyph(copy), 24, "outline")
      • +
    • HTML: data-icon="copy" or data-icon="copy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card)) or @include icon(glyph(credit-card), 24, "outline")
      • +
    • HTML: data-icon="credit-card" or data-icon="credit-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard)) or @include icon(glyph(dashboard), 24, "outline")
      • +
    • HTML: data-icon="dashboard" or data-icon="dashboard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete)) or @include icon(glyph(delete), 24, "outline")
      • +
    • HTML: data-icon="delete" or data-icon="delete" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount)) or @include icon(glyph(discount), 24, "outline")
      • +
    • HTML: data-icon="discount" or data-icon="discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document)) or @include icon(glyph(document), 24, "outline")
      • +
    • HTML: data-icon="document" or data-icon="document" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check)) or @include icon(glyph(document-check), 24, "outline")
      • +
    • HTML: data-icon="document-check" or data-icon="document-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done)) or @include icon(glyph(done), 24, "outline")
      • +
    • HTML: data-icon="done" or data-icon="done" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download)) or @include icon(glyph(download), 24, "outline")
      • +
    • HTML: data-icon="download" or data-icon="download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop)) or @include icon(glyph(drag-and-drop), 24, "outline")
      • +
    • HTML: data-icon="drag-and-drop" or data-icon="drag-and-drop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit)) or @include icon(glyph(edit), 24, "outline")
      • +
    • HTML: data-icon="edit" or data-icon="edit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted)) or @include icon(glyph(face-delighted), 24, "outline")
      • +
    • HTML: data-icon="face-delighted" or data-icon="face-delighted" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed)) or @include icon(glyph(face-disappointed), 24, "outline")
      • +
    • HTML: data-icon="face-disappointed" or data-icon="face-disappointed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral)) or @include icon(glyph(face-neutral), 24, "outline")
      • +
    • HTML: data-icon="face-neutral" or data-icon="face-neutral" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad)) or @include icon(glyph(face-sad), 24, "outline")
      • +
    • HTML: data-icon="face-sad" or data-icon="face-sad" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling)) or @include icon(glyph(face-smiling), 24, "outline")
      • +
    • HTML: data-icon="face-smiling" or data-icon="face-smiling" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter)) or @include icon(glyph(filter), 24, "outline")
      • +
    • HTML: data-icon="filter" or data-icon="filter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint)) or @include icon(glyph(fingerprint), 24, "outline")
      • +
    • HTML: data-icon="fingerprint" or data-icon="fingerprint" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder)) or @include icon(glyph(folder), 24, "outline")
      • +
    • HTML: data-icon="folder" or data-icon="folder" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open)) or @include icon(glyph(folder-open), 24, "outline")
      • +
    • HTML: data-icon="folder-open" or data-icon="folder-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card)) or @include icon(glyph(generic-card), 24, "outline")
      • +
    • HTML: data-icon="generic-card" or data-icon="generic-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard)) or @include icon(glyph(giftcard), 24, "outline")
      • +
    • HTML: data-icon="giftcard" or data-icon="giftcard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing)) or @include icon(glyph(hearing), 24, "outline")
      • +
    • HTML: data-icon="hearing" or data-icon="hearing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled)) or @include icon(glyph(hearing-disabled), 24, "outline")
      • +
    • HTML: data-icon="hearing-disabled" or data-icon="hearing-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "outline")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "outline")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image)) or @include icon(glyph(image), 24, "outline")
      • +
    • HTML: data-icon="image" or data-icon="image" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "outline")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key)) or @include icon(glyph(key), 24, "outline")
      • +
    • HTML: data-icon="key" or data-icon="key" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal)) or @include icon(glyph(legal), 24, "outline")
      • +
    • HTML: data-icon="legal" or data-icon="legal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb)) or @include icon(glyph(lightbulb), 24, "outline")
      • +
    • HTML: data-icon="lightbulb" or data-icon="lightbulb" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close)) or @include icon(glyph(lock-close), 24, "outline")
      • +
    • HTML: data-icon="lock-close" or data-icon="lock-close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open)) or @include icon(glyph(lock-open), 24, "outline")
      • +
    • HTML: data-icon="lock-open" or data-icon="lock-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out)) or @include icon(glyph(log-out), 24, "outline")
      • +
    • HTML: data-icon="log-out" or data-icon="log-out" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook)) or @include icon(glyph(logbook), 24, "outline")
      • +
    • HTML: data-icon="logbook" or data-icon="logbook" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus)) or @include icon(glyph(minus), 24, "outline")
      • +
    • HTML: data-icon="minus" or data-icon="minus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank)) or @include icon(glyph(piggybank), 24, "outline")
      • +
    • HTML: data-icon="piggybank" or data-icon="piggybank" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "outline")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print)) or @include icon(glyph(print), 24, "outline")
      • +
    • HTML: data-icon="print" or data-icon="print" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button)) or @include icon(glyph(push-button), 24, "outline")
      • +
    • HTML: data-icon="push-button" or data-icon="push-button" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "outline")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize)) or @include icon(glyph(resize), 24, "outline")
      • +
    • HTML: data-icon="resize" or data-icon="resize" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner)) or @include icon(glyph(resize-handle-corner), 24, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" or data-icon="resize-handle-corner" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save)) or @include icon(glyph(save), 24, "outline")
      • +
    • HTML: data-icon="save" or data-icon="save" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule)) or @include icon(glyph(schedule), 24, "outline")
      • +
    • HTML: data-icon="schedule" or data-icon="schedule" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search)) or @include icon(glyph(search), 24, "outline")
      • +
    • HTML: data-icon="search" or data-icon="search" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send)) or @include icon(glyph(send), 24, "outline")
      • +
    • HTML: data-icon="send" or data-icon="send" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa)) or @include icon(glyph(sepa), 24, "outline")
      • +
    • HTML: data-icon="sepa" or data-icon="sepa" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings)) or @include icon(glyph(settings), 24, "outline")
      • +
    • HTML: data-icon="settings" or data-icon="settings" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share)) or @include icon(glyph(share), 24, "outline")
      • +
    • HTML: data-icon="share" or data-icon="share" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag)) or @include icon(glyph(shopping-bag), 24, "outline")
      • +
    • HTML: data-icon="shopping-bag" or data-icon="shopping-bag" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket)) or @include icon(glyph(shopping-basket), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket" or data-icon="shopping-basket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled)) or @include icon(glyph(shopping-basket-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" or data-icon="shopping-basket-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart)) or @include icon(glyph(shopping-cart), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart" or data-icon="shopping-cart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled)) or @include icon(glyph(shopping-cart-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" or data-icon="shopping-cart-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down)) or @include icon(glyph(sort-down), 24, "outline")
      • +
    • HTML: data-icon="sort-down" or data-icon="sort-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up)) or @include icon(glyph(sort-up), 24, "outline")
      • +
    • HTML: data-icon="sort-up" or data-icon="sort-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "outline")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal)) or @include icon(glyph(swap-horizontal), 24, "outline")
      • +
    • HTML: data-icon="swap-horizontal" or data-icon="swap-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical)) or @include icon(glyph(swap-vertical), 24, "outline")
      • +
    • HTML: data-icon="swap-vertical" or data-icon="swap-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up)) or @include icon(glyph(thumb-up), 24, "outline")
      • +
    • HTML: data-icon="thumb-up" or data-icon="thumb-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down)) or @include icon(glyph(thumb-up-down), 24, "outline")
      • +
    • HTML: data-icon="thumb-up-down" or data-icon="thumb-up-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation)) or @include icon(glyph(translation), 24, "outline")
      • +
    • HTML: data-icon="translation" or data-icon="translation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo)) or @include icon(glyph(undo), 24, "outline")
      • +
    • HTML: data-icon="undo" or data-icon="undo" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload)) or @include icon(glyph(upload), 24, "outline")
      • +
    • HTML: data-icon="upload" or data-icon="upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility)) or @include icon(glyph(visibility), 24, "outline")
      • +
    • HTML: data-icon="visibility" or data-icon="visibility" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off)) or @include icon(glyph(visibility-off), 24, "outline")
      • +
    • HTML: data-icon="visibility-off" or data-icon="visibility-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher)) or @include icon(glyph(voucher), 24, "outline")
      • +
    • HTML: data-icon="voucher" or data-icon="voucher" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website)) or @include icon(glyph(website), 24, "outline")
      • +
    • HTML: data-icon="website" or data-icon="website" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in)) or @include icon(glyph(zoom-in), 24, "outline")
      • +
    • HTML: data-icon="zoom-in" or data-icon="zoom-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out)) or @include icon(glyph(zoom-out), 24, "outline")
      • +
    • HTML: data-icon="zoom-out" or data-icon="zoom-out" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.markup-only.html new file mode 100644 index 0000000000..6a09473630 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.markup-only.html @@ -0,0 +1,117 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "outline")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10)) or @include icon(glyph(fast-backward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-10" or data-icon="fast-backward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30)) or @include icon(glyph(fast-backward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-30" or data-icon="fast-backward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty)) or @include icon(glyph(fast-backward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" or data-icon="fast-backward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "outline")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10)) or @include icon(glyph(fast-forward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-10" or data-icon="fast-forward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30)) or @include icon(glyph(fast-forward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-30" or data-icon="fast-forward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty)) or @include icon(glyph(fast-forward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" or data-icon="fast-forward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "outline")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause)) or @include icon(glyph(pause), 24, "outline")
      • +
    • HTML: data-icon="pause" or data-icon="pause" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "outline")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "outline")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "outline")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "outline")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles)) or @include icon(glyph(subtitles), 24, "outline")
      • +
    • HTML: data-icon="subtitles" or data-icon="subtitles" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down)) or @include icon(glyph(volume-down), 24, "outline")
      • +
    • HTML: data-icon="volume-down" or data-icon="volume-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute)) or @include icon(glyph(volume-mute), 24, "outline")
      • +
    • HTML: data-icon="volume-mute" or data-icon="volume-mute" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off)) or @include icon(glyph(volume-off), 24, "outline")
      • +
    • HTML: data-icon="volume-off" or data-icon="volume-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up)) or @include icon(glyph(volume-up), 24, "outline")
      • +
    • HTML: data-icon="volume-up" or data-icon="volume-up" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.rendered.html new file mode 100644 index 0000000000..056eaa3ec8 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.rendered.html @@ -0,0 +1,234 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "outline")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10)) or @include icon(glyph(fast-backward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-10" or data-icon="fast-backward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30)) or @include icon(glyph(fast-backward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-30" or data-icon="fast-backward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty)) or @include icon(glyph(fast-backward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" or data-icon="fast-backward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "outline")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10)) or @include icon(glyph(fast-forward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-10" or data-icon="fast-forward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30)) or @include icon(glyph(fast-forward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-30" or data-icon="fast-forward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty)) or @include icon(glyph(fast-forward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" or data-icon="fast-forward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "outline")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause)) or @include icon(glyph(pause), 24, "outline")
      • +
    • HTML: data-icon="pause" or data-icon="pause" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "outline")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "outline")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "outline")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "outline")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles)) or @include icon(glyph(subtitles), 24, "outline")
      • +
    • HTML: data-icon="subtitles" or data-icon="subtitles" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down)) or @include icon(glyph(volume-down), 24, "outline")
      • +
    • HTML: data-icon="volume-down" or data-icon="volume-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute)) or @include icon(glyph(volume-mute), 24, "outline")
      • +
    • HTML: data-icon="volume-mute" or data-icon="volume-mute" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off)) or @include icon(glyph(volume-off), 24, "outline")
      • +
    • HTML: data-icon="volume-off" or data-icon="volume-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up)) or @include icon(glyph(volume-up), 24, "outline")
      • +
    • HTML: data-icon="volume-up" or data-icon="volume-up" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.markup-only.html new file mode 100644 index 0000000000..9f98dc49b0 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.markup-only.html @@ -0,0 +1,9 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(logo)) or @include icon(glyph(logo), 24, "outline")
      • +
    • HTML: data-icon="logo" or data-icon="logo" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.rendered.html new file mode 100644 index 0000000000..80d0c3d456 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(logo)) or @include icon(glyph(logo), 24, "outline")
      • +
    • HTML: data-icon="logo" or data-icon="logo" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.markup-only.html new file mode 100644 index 0000000000..5a60aea434 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.markup-only.html @@ -0,0 +1,81 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(call)) or @include icon(glyph(call), 24, "outline")
      • +
    • HTML: data-icon="call" or data-icon="call" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat)) or @include icon(glyph(chat), 24, "outline")
      • +
    • HTML: data-icon="chat" or data-icon="chat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation)) or @include icon(glyph(conversation), 24, "outline")
      • +
    • HTML: data-icon="conversation" or data-icon="conversation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax)) or @include icon(glyph(fax), 24, "outline")
      • +
    • HTML: data-icon="fax" or data-icon="fax" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback)) or @include icon(glyph(feedback), 24, "outline")
      • +
    • HTML: data-icon="feedback" or data-icon="feedback" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail)) or @include icon(glyph(mail), 24, "outline")
      • +
    • HTML: data-icon="mail" or data-icon="mail" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone)) or @include icon(glyph(mobile-phone), 24, "outline")
      • +
    • HTML: data-icon="mobile-phone" or data-icon="mobile-phone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off)) or @include icon(glyph(mobile-off), 24, "outline")
      • +
    • HTML: data-icon="mobile-off" or data-icon="mobile-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question)) or @include icon(glyph(question), 24, "outline")
      • +
    • HTML: data-icon="question" or data-icon="question" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item)) or @include icon(glyph(receive-item), 24, "outline")
      • +
    • HTML: data-icon="receive-item" or data-icon="receive-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item)) or @include icon(glyph(share-item), 24, "outline")
      • +
    • HTML: data-icon="share-item" or data-icon="share-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi)) or @include icon(glyph(wifi), 24, "outline")
      • +
    • HTML: data-icon="wifi" or data-icon="wifi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off)) or @include icon(glyph(wifi-off), 24, "outline")
      • +
    • HTML: data-icon="wifi-off" or data-icon="wifi-off" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.rendered.html new file mode 100644 index 0000000000..142f9c7884 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.rendered.html @@ -0,0 +1,198 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(call)) or @include icon(glyph(call), 24, "outline")
      • +
    • HTML: data-icon="call" or data-icon="call" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat)) or @include icon(glyph(chat), 24, "outline")
      • +
    • HTML: data-icon="chat" or data-icon="chat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation)) or @include icon(glyph(conversation), 24, "outline")
      • +
    • HTML: data-icon="conversation" or data-icon="conversation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax)) or @include icon(glyph(fax), 24, "outline")
      • +
    • HTML: data-icon="fax" or data-icon="fax" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback)) or @include icon(glyph(feedback), 24, "outline")
      • +
    • HTML: data-icon="feedback" or data-icon="feedback" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail)) or @include icon(glyph(mail), 24, "outline")
      • +
    • HTML: data-icon="mail" or data-icon="mail" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone)) or @include icon(glyph(mobile-phone), 24, "outline")
      • +
    • HTML: data-icon="mobile-phone" or data-icon="mobile-phone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off)) or @include icon(glyph(mobile-off), 24, "outline")
      • +
    • HTML: data-icon="mobile-off" or data-icon="mobile-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question)) or @include icon(glyph(question), 24, "outline")
      • +
    • HTML: data-icon="question" or data-icon="question" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item)) or @include icon(glyph(receive-item), 24, "outline")
      • +
    • HTML: data-icon="receive-item" or data-icon="receive-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item)) or @include icon(glyph(share-item), 24, "outline")
      • +
    • HTML: data-icon="share-item" or data-icon="share-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi)) or @include icon(glyph(wifi), 24, "outline")
      • +
    • HTML: data-icon="wifi" or data-icon="wifi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off)) or @include icon(glyph(wifi-off), 24, "outline")
      • +
    • HTML: data-icon="wifi-off" or data-icon="wifi-off" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.markup-only.html new file mode 100644 index 0000000000..f68b7d1270 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.markup-only.html @@ -0,0 +1,9 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(mask)) or @include icon(glyph(mask), 24, "outline")
      • +
    • HTML: data-icon="mask" or data-icon="mask" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.rendered.html new file mode 100644 index 0000000000..ef566b2742 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(mask)) or @include icon(glyph(mask), 24, "outline")
      • +
    • HTML: data-icon="mask" or data-icon="mask" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.markup-only.html new file mode 100644 index 0000000000..38916df0ed --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.markup-only.html @@ -0,0 +1,63 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(playground)) or @include icon(glyph(playground), 24, "outline")
      • +
    • HTML: data-icon="playground" or data-icon="playground" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet)) or @include icon(glyph(restricted-mobility-toilet), 24, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" or data-icon="restricted-mobility-toilet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower)) or @include icon(glyph(shower), 24, "outline")
      • +
    • HTML: data-icon="shower" or data-icon="shower" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men)) or @include icon(glyph(shower-men), 24, "outline")
      • +
    • HTML: data-icon="shower-men" or data-icon="shower-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women)) or @include icon(glyph(shower-women), 24, "outline")
      • +
    • HTML: data-icon="shower-women" or data-icon="shower-women" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink)) or @include icon(glyph(sink), 24, "outline")
      • +
    • HTML: data-icon="sink" or data-icon="sink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc)) or @include icon(glyph(wc), 24, "outline")
      • +
    • HTML: data-icon="wc" or data-icon="wc" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men)) or @include icon(glyph(wc-men), 24, "outline")
      • +
    • HTML: data-icon="wc-men" or data-icon="wc-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign)) or @include icon(glyph(wc-sign), 24, "outline")
      • +
    • HTML: data-icon="wc-sign" or data-icon="wc-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman)) or @include icon(glyph(wc-woman), 24, "outline")
      • +
    • HTML: data-icon="wc-woman" or data-icon="wc-woman" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.rendered.html new file mode 100644 index 0000000000..702db5ae1d --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.rendered.html @@ -0,0 +1,180 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(playground)) or @include icon(glyph(playground), 24, "outline")
      • +
    • HTML: data-icon="playground" or data-icon="playground" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet)) or @include icon(glyph(restricted-mobility-toilet), 24, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" or data-icon="restricted-mobility-toilet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower)) or @include icon(glyph(shower), 24, "outline")
      • +
    • HTML: data-icon="shower" or data-icon="shower" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men)) or @include icon(glyph(shower-men), 24, "outline")
      • +
    • HTML: data-icon="shower-men" or data-icon="shower-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women)) or @include icon(glyph(shower-women), 24, "outline")
      • +
    • HTML: data-icon="shower-women" or data-icon="shower-women" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink)) or @include icon(glyph(sink), 24, "outline")
      • +
    • HTML: data-icon="sink" or data-icon="sink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc)) or @include icon(glyph(wc), 24, "outline")
      • +
    • HTML: data-icon="wc" or data-icon="wc" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men)) or @include icon(glyph(wc-men), 24, "outline")
      • +
    • HTML: data-icon="wc-men" or data-icon="wc-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign)) or @include icon(glyph(wc-sign), 24, "outline")
      • +
    • HTML: data-icon="wc-sign" or data-icon="wc-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman)) or @include icon(glyph(wc-woman), 24, "outline")
      • +
    • HTML: data-icon="wc-woman" or data-icon="wc-woman" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.markup-only.html new file mode 100644 index 0000000000..cf49dd5a4f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.markup-only.html @@ -0,0 +1,135 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition)) or @include icon(glyph(air-condition), 24, "outline")
      • +
    • HTML: data-icon="air-condition" or data-icon="air-condition" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy)) or @include icon(glyph(buggy), 24, "outline")
      • +
    • HTML: data-icon="buggy" or data-icon="buggy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger)) or @include icon(glyph(clothing-hanger), 24, "outline")
      • +
    • HTML: data-icon="clothing-hanger" or data-icon="clothing-hanger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day)) or @include icon(glyph(day), 24, "outline")
      • +
    • HTML: data-icon="day" or data-icon="day" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog)) or @include icon(glyph(dog), 24, "outline")
      • +
    • HTML: data-icon="dog" or data-icon="dog" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid)) or @include icon(glyph(entry-aid), 24, "outline")
      • +
    • HTML: data-icon="entry-aid" or data-icon="entry-aid" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check)) or @include icon(glyph(environmental-mobility-check), 24, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" or data-icon="environmental-mobility-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen)) or @include icon(glyph(hydrogen), 24, "outline")
      • +
    • HTML: data-icon="hydrogen" or data-icon="hydrogen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment)) or @include icon(glyph(luggage-compartment), 24, "outline")
      • +
    • HTML: data-icon="luggage-compartment" or data-icon="luggage-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack)) or @include icon(glyph(luggage-rack), 24, "outline")
      • +
    • HTML: data-icon="luggage-rack" or data-icon="luggage-rack" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace)) or @include icon(glyph(marketplace), 24, "outline")
      • +
    • HTML: data-icon="marketplace" or data-icon="marketplace" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical)) or @include icon(glyph(medical), 24, "outline")
      • +
    • HTML: data-icon="medical" or data-icon="medical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night)) or @include icon(glyph(night), 24, "outline")
      • +
    • HTML: data-icon="night" or data-icon="night" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking)) or @include icon(glyph(no-smoking), 24, "outline")
      • +
    • HTML: data-icon="no-smoking" or data-icon="no-smoking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane)) or @include icon(glyph(person-with-cane), 24, "outline")
      • +
    • HTML: data-icon="person-with-cane" or data-icon="person-with-cane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator)) or @include icon(glyph(person-with-rollator), 24, "outline")
      • +
    • HTML: data-icon="person-with-rollator" or data-icon="person-with-rollator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform)) or @include icon(glyph(platform), 24, "outline")
      • +
    • HTML: data-icon="platform" or data-icon="platform" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet)) or @include icon(glyph(power-outlet), 24, "outline")
      • +
    • HTML: data-icon="power-outlet" or data-icon="power-outlet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation)) or @include icon(glyph(reservation), 24, "outline")
      • +
    • HTML: data-icon="reservation" or data-icon="reservation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room)) or @include icon(glyph(standing-room), 24, "outline")
      • +
    • HTML: data-icon="standing-room" or data-icon="standing-room" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry)) or @include icon(glyph(steppless-entry), 24, "outline")
      • +
    • HTML: data-icon="steppless-entry" or data-icon="steppless-entry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog)) or @include icon(glyph(support-dog), 24, "outline")
      • +
    • HTML: data-icon="support-dog" or data-icon="support-dog" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.rendered.html new file mode 100644 index 0000000000..b7b1a89e4d --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.rendered.html @@ -0,0 +1,252 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition)) or @include icon(glyph(air-condition), 24, "outline")
      • +
    • HTML: data-icon="air-condition" or data-icon="air-condition" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy)) or @include icon(glyph(buggy), 24, "outline")
      • +
    • HTML: data-icon="buggy" or data-icon="buggy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger)) or @include icon(glyph(clothing-hanger), 24, "outline")
      • +
    • HTML: data-icon="clothing-hanger" or data-icon="clothing-hanger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day)) or @include icon(glyph(day), 24, "outline")
      • +
    • HTML: data-icon="day" or data-icon="day" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog)) or @include icon(glyph(dog), 24, "outline")
      • +
    • HTML: data-icon="dog" or data-icon="dog" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid)) or @include icon(glyph(entry-aid), 24, "outline")
      • +
    • HTML: data-icon="entry-aid" or data-icon="entry-aid" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check)) or @include icon(glyph(environmental-mobility-check), 24, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" or data-icon="environmental-mobility-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen)) or @include icon(glyph(hydrogen), 24, "outline")
      • +
    • HTML: data-icon="hydrogen" or data-icon="hydrogen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment)) or @include icon(glyph(luggage-compartment), 24, "outline")
      • +
    • HTML: data-icon="luggage-compartment" or data-icon="luggage-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack)) or @include icon(glyph(luggage-rack), 24, "outline")
      • +
    • HTML: data-icon="luggage-rack" or data-icon="luggage-rack" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace)) or @include icon(glyph(marketplace), 24, "outline")
      • +
    • HTML: data-icon="marketplace" or data-icon="marketplace" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical)) or @include icon(glyph(medical), 24, "outline")
      • +
    • HTML: data-icon="medical" or data-icon="medical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night)) or @include icon(glyph(night), 24, "outline")
      • +
    • HTML: data-icon="night" or data-icon="night" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking)) or @include icon(glyph(no-smoking), 24, "outline")
      • +
    • HTML: data-icon="no-smoking" or data-icon="no-smoking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane)) or @include icon(glyph(person-with-cane), 24, "outline")
      • +
    • HTML: data-icon="person-with-cane" or data-icon="person-with-cane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator)) or @include icon(glyph(person-with-rollator), 24, "outline")
      • +
    • HTML: data-icon="person-with-rollator" or data-icon="person-with-rollator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform)) or @include icon(glyph(platform), 24, "outline")
      • +
    • HTML: data-icon="platform" or data-icon="platform" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet)) or @include icon(glyph(power-outlet), 24, "outline")
      • +
    • HTML: data-icon="power-outlet" or data-icon="power-outlet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation)) or @include icon(glyph(reservation), 24, "outline")
      • +
    • HTML: data-icon="reservation" or data-icon="reservation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room)) or @include icon(glyph(standing-room), 24, "outline")
      • +
    • HTML: data-icon="standing-room" or data-icon="standing-room" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry)) or @include icon(glyph(steppless-entry), 24, "outline")
      • +
    • HTML: data-icon="steppless-entry" or data-icon="steppless-entry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog)) or @include icon(glyph(support-dog), 24, "outline")
      • +
    • HTML: data-icon="support-dog" or data-icon="support-dog" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.markup-only.html new file mode 100644 index 0000000000..5d6341026b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.markup-only.html @@ -0,0 +1,27 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast)) or @include icon(glyph(breakfast), 24, "outline")
      • +
    • HTML: data-icon="breakfast" or data-icon="breakfast" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup)) or @include icon(glyph(coffee-cup), 24, "outline")
      • +
    • HTML: data-icon="coffee-cup" or data-icon="coffee-cup" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink)) or @include icon(glyph(drink), 24, "outline")
      • +
    • HTML: data-icon="drink" or data-icon="drink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant)) or @include icon(glyph(restaurant), 24, "outline")
      • +
    • HTML: data-icon="restaurant" or data-icon="restaurant" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.rendered.html new file mode 100644 index 0000000000..7c263d2c54 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.rendered.html @@ -0,0 +1,144 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast)) or @include icon(glyph(breakfast), 24, "outline")
      • +
    • HTML: data-icon="breakfast" or data-icon="breakfast" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup)) or @include icon(glyph(coffee-cup), 24, "outline")
      • +
    • HTML: data-icon="coffee-cup" or data-icon="coffee-cup" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink)) or @include icon(glyph(drink), 24, "outline")
      • +
    • HTML: data-icon="drink" or data-icon="drink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant)) or @include icon(glyph(restaurant), 24, "outline")
      • +
    • HTML: data-icon="restaurant" or data-icon="restaurant" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.markup-only.html new file mode 100644 index 0000000000..e9a1acf0f1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 24, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.rendered.html new file mode 100644 index 0000000000..a78063a775 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 24, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.markup-only.html new file mode 100644 index 0000000000..0720dbf46a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.markup-only.html @@ -0,0 +1,87 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class)) or @include icon(glyph(1st-class), 24, "outline")
      • +
    • HTML: data-icon="1st-class" or data-icon="1st-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class)) or @include icon(glyph(2nd-class), 24, "outline")
      • +
    • HTML: data-icon="2nd-class" or data-icon="2nd-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection)) or @include icon(glyph(alternative-connection), 24, "outline")
      • +
    • HTML: data-icon="alternative-connection" or data-icon="alternative-connection" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking)) or @include icon(glyph(booking), 24, "outline")
      • +
    • HTML: data-icon="booking" or data-icon="booking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "outline")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop)) or @include icon(glyph(intermediary-stop), 24, "outline")
      • +
    • HTML: data-icon="intermediary-stop" or data-icon="intermediary-stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class)) or @include icon(glyph(mixed-class), 24, "outline")
      • +
    • HTML: data-icon="mixed-class" or data-icon="mixed-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip)) or @include icon(glyph(round-trip), 24, "outline")
      • +
    • HTML: data-icon="round-trip" or data-icon="round-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip)) or @include icon(glyph(single-trip), 24, "outline")
      • +
    • HTML: data-icon="single-trip" or data-icon="single-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start)) or @include icon(glyph(start), 24, "outline")
      • +
    • HTML: data-icon="start" or data-icon="start" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.rendered.html new file mode 100644 index 0000000000..22d3e1d3c6 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.rendered.html @@ -0,0 +1,204 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class)) or @include icon(glyph(1st-class), 24, "outline")
      • +
    • HTML: data-icon="1st-class" or data-icon="1st-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class)) or @include icon(glyph(2nd-class), 24, "outline")
      • +
    • HTML: data-icon="2nd-class" or data-icon="2nd-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection)) or @include icon(glyph(alternative-connection), 24, "outline")
      • +
    • HTML: data-icon="alternative-connection" or data-icon="alternative-connection" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking)) or @include icon(glyph(booking), 24, "outline")
      • +
    • HTML: data-icon="booking" or data-icon="booking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "outline")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop)) or @include icon(glyph(intermediary-stop), 24, "outline")
      • +
    • HTML: data-icon="intermediary-stop" or data-icon="intermediary-stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class)) or @include icon(glyph(mixed-class), 24, "outline")
      • +
    • HTML: data-icon="mixed-class" or data-icon="mixed-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip)) or @include icon(glyph(round-trip), 24, "outline")
      • +
    • HTML: data-icon="round-trip" or data-icon="round-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip)) or @include icon(glyph(single-trip), 24, "outline")
      • +
    • HTML: data-icon="single-trip" or data-icon="single-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start)) or @include icon(glyph(start), 24, "outline")
      • +
    • HTML: data-icon="start" or data-icon="start" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.markup-only.html new file mode 100644 index 0000000000..bd755baedc --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.markup-only.html @@ -0,0 +1,87 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "outline")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "outline")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home)) or @include icon(glyph(home), 24, "outline")
      • +
    • HTML: data-icon="home" or data-icon="home" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map)) or @include icon(glyph(map), 24, "outline")
      • +
    • HTML: data-icon="map" or data-icon="map" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight)) or @include icon(glyph(navigation-straight), 24, "outline")
      • +
    • HTML: data-icon="navigation-straight" or data-icon="navigation-straight" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left)) or @include icon(glyph(navigation-to-left), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-left" or data-icon="navigation-to-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right)) or @include icon(glyph(navigation-to-right), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-right" or data-icon="navigation-to-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn)) or @include icon(glyph(navigation-u-turn), 24, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" or data-icon="navigation-u-turn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign)) or @include icon(glyph(stop-sign), 24, "outline")
      • +
    • HTML: data-icon="stop-sign" or data-icon="stop-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking)) or @include icon(glyph(parking), 24, "outline")
      • +
    • HTML: data-icon="parking" or data-icon="parking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place)) or @include icon(glyph(place), 24, "outline")
      • +
    • HTML: data-icon="place" or data-icon="place" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position)) or @include icon(glyph(set-position), 24, "outline")
      • +
    • HTML: data-icon="set-position" or data-icon="set-position" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station)) or @include icon(glyph(station), 24, "outline")
      • +
    • HTML: data-icon="station" or data-icon="station" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station)) or @include icon(glyph(train-station), 24, "outline")
      • +
    • HTML: data-icon="train-station" or data-icon="train-station" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.rendered.html new file mode 100644 index 0000000000..e6d6f99ea4 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.rendered.html @@ -0,0 +1,204 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "outline")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "outline")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home)) or @include icon(glyph(home), 24, "outline")
      • +
    • HTML: data-icon="home" or data-icon="home" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map)) or @include icon(glyph(map), 24, "outline")
      • +
    • HTML: data-icon="map" or data-icon="map" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight)) or @include icon(glyph(navigation-straight), 24, "outline")
      • +
    • HTML: data-icon="navigation-straight" or data-icon="navigation-straight" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left)) or @include icon(glyph(navigation-to-left), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-left" or data-icon="navigation-to-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right)) or @include icon(glyph(navigation-to-right), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-right" or data-icon="navigation-to-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn)) or @include icon(glyph(navigation-u-turn), 24, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" or data-icon="navigation-u-turn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign)) or @include icon(glyph(stop-sign), 24, "outline")
      • +
    • HTML: data-icon="stop-sign" or data-icon="stop-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking)) or @include icon(glyph(parking), 24, "outline")
      • +
    • HTML: data-icon="parking" or data-icon="parking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place)) or @include icon(glyph(place), 24, "outline")
      • +
    • HTML: data-icon="place" or data-icon="place" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position)) or @include icon(glyph(set-position), 24, "outline")
      • +
    • HTML: data-icon="set-position" or data-icon="set-position" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station)) or @include icon(glyph(station), 24, "outline")
      • +
    • HTML: data-icon="station" or data-icon="station" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station)) or @include icon(glyph(train-station), 24, "outline")
      • +
    • HTML: data-icon="train-station" or data-icon="train-station" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.markup-only.html new file mode 100644 index 0000000000..ab87f79458 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.markup-only.html @@ -0,0 +1,123 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back)) or @include icon(glyph(arrow-back), 24, "outline")
      • +
    • HTML: data-icon="arrow-back" or data-icon="arrow-back" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down)) or @include icon(glyph(arrow-down), 24, "outline")
      • +
    • HTML: data-icon="arrow-down" or data-icon="arrow-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward)) or @include icon(glyph(arrow-forward), 24, "outline")
      • +
    • HTML: data-icon="arrow-forward" or data-icon="arrow-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up)) or @include icon(glyph(arrow-up), 24, "outline")
      • +
    • HTML: data-icon="arrow-up" or data-icon="arrow-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "outline")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left)) or @include icon(glyph(chevron-left), 24, "outline")
      • +
    • HTML: data-icon="chevron-left" or data-icon="chevron-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right)) or @include icon(glyph(chevron-right), 24, "outline")
      • +
    • HTML: data-icon="chevron-right" or data-icon="chevron-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close)) or @include icon(glyph(close), 24, "outline")
      • +
    • HTML: data-icon="close" or data-icon="close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less)) or @include icon(glyph(expand-less), 24, "outline")
      • +
    • HTML: data-icon="expand-less" or data-icon="expand-less" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more)) or @include icon(glyph(expand-more), 24, "outline")
      • +
    • HTML: data-icon="expand-more" or data-icon="expand-more" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen)) or @include icon(glyph(fullscreen), 24, "outline")
      • +
    • HTML: data-icon="fullscreen" or data-icon="fullscreen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit)) or @include icon(glyph(fullscreen-exit), 24, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" or data-icon="fullscreen-exit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view)) or @include icon(glyph(grid-view), 24, "outline")
      • +
    • HTML: data-icon="grid-view" or data-icon="grid-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link)) or @include icon(glyph(link), 24, "outline")
      • +
    • HTML: data-icon="link" or data-icon="link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external)) or @include icon(glyph(link-external), 24, "outline")
      • +
    • HTML: data-icon="link-external" or data-icon="link-external" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list)) or @include icon(glyph(list), 24, "outline")
      • +
    • HTML: data-icon="list" or data-icon="list" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu)) or @include icon(glyph(menu), 24, "outline")
      • +
    • HTML: data-icon="menu" or data-icon="menu" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal)) or @include icon(glyph(more-horizontal), 24, "outline")
      • +
    • HTML: data-icon="more-horizontal" or data-icon="more-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical)) or @include icon(glyph(more-vertical), 24, "outline")
      • +
    • HTML: data-icon="more-vertical" or data-icon="more-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh)) or @include icon(glyph(refresh), 24, "outline")
      • +
    • HTML: data-icon="refresh" or data-icon="refresh" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.rendered.html new file mode 100644 index 0000000000..0748940e50 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.rendered.html @@ -0,0 +1,240 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back)) or @include icon(glyph(arrow-back), 24, "outline")
      • +
    • HTML: data-icon="arrow-back" or data-icon="arrow-back" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down)) or @include icon(glyph(arrow-down), 24, "outline")
      • +
    • HTML: data-icon="arrow-down" or data-icon="arrow-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward)) or @include icon(glyph(arrow-forward), 24, "outline")
      • +
    • HTML: data-icon="arrow-forward" or data-icon="arrow-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up)) or @include icon(glyph(arrow-up), 24, "outline")
      • +
    • HTML: data-icon="arrow-up" or data-icon="arrow-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "outline")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left)) or @include icon(glyph(chevron-left), 24, "outline")
      • +
    • HTML: data-icon="chevron-left" or data-icon="chevron-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right)) or @include icon(glyph(chevron-right), 24, "outline")
      • +
    • HTML: data-icon="chevron-right" or data-icon="chevron-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close)) or @include icon(glyph(close), 24, "outline")
      • +
    • HTML: data-icon="close" or data-icon="close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less)) or @include icon(glyph(expand-less), 24, "outline")
      • +
    • HTML: data-icon="expand-less" or data-icon="expand-less" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more)) or @include icon(glyph(expand-more), 24, "outline")
      • +
    • HTML: data-icon="expand-more" or data-icon="expand-more" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen)) or @include icon(glyph(fullscreen), 24, "outline")
      • +
    • HTML: data-icon="fullscreen" or data-icon="fullscreen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit)) or @include icon(glyph(fullscreen-exit), 24, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" or data-icon="fullscreen-exit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view)) or @include icon(glyph(grid-view), 24, "outline")
      • +
    • HTML: data-icon="grid-view" or data-icon="grid-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link)) or @include icon(glyph(link), 24, "outline")
      • +
    • HTML: data-icon="link" or data-icon="link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external)) or @include icon(glyph(link-external), 24, "outline")
      • +
    • HTML: data-icon="link-external" or data-icon="link-external" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list)) or @include icon(glyph(list), 24, "outline")
      • +
    • HTML: data-icon="list" or data-icon="list" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu)) or @include icon(glyph(menu), 24, "outline")
      • +
    • HTML: data-icon="menu" or data-icon="menu" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal)) or @include icon(glyph(more-horizontal), 24, "outline")
      • +
    • HTML: data-icon="more-horizontal" or data-icon="more-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical)) or @include icon(glyph(more-vertical), 24, "outline")
      • +
    • HTML: data-icon="more-vertical" or data-icon="more-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh)) or @include icon(glyph(refresh), 24, "outline")
      • +
    • HTML: data-icon="refresh" or data-icon="refresh" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.markup-only.html new file mode 100644 index 0000000000..046debd59b --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.markup-only.html @@ -0,0 +1,27 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "outline")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify)) or @include icon(glyph(notify), 24, "outline")
      • +
    • HTML: data-icon="notify" or data-icon="notify" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff)) or @include icon(glyph(notify-cutoff), 24, "outline")
      • +
    • HTML: data-icon="notify-cutoff" or data-icon="notify-cutoff" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "outline")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.rendered.html new file mode 100644 index 0000000000..fa73e6db37 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.rendered.html @@ -0,0 +1,144 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "outline")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify)) or @include icon(glyph(notify), 24, "outline")
      • +
    • HTML: data-icon="notify" or data-icon="notify" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff)) or @include icon(glyph(notify-cutoff), 24, "outline")
      • +
    • HTML: data-icon="notify-cutoff" or data-icon="notify-cutoff" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "outline")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.markup-only.html new file mode 100644 index 0000000000..e0f146300a --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.markup-only.html @@ -0,0 +1,69 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle)) or @include icon(glyph(aisle), 24, "outline")
      • +
    • HTML: data-icon="aisle" or data-icon="aisle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available)) or @include icon(glyph(aisle-not-available), 24, "outline")
      • +
    • HTML: data-icon="aisle-not-available" or data-icon="aisle-not-available" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed)) or @include icon(glyph(bed), 24, "outline")
      • +
    • HTML: data-icon="bed" or data-icon="bed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment)) or @include icon(glyph(childrens-compartment), 24, "outline")
      • +
    • HTML: data-icon="childrens-compartment" or data-icon="childrens-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly)) or @include icon(glyph(elderly), 24, "outline")
      • +
    • HTML: data-icon="elderly" or data-icon="elderly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped)) or @include icon(glyph(handicapped), 24, "outline")
      • +
    • HTML: data-icon="handicapped" or data-icon="handicapped" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment)) or @include icon(glyph(parent-child-compartment), 24, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" or data-icon="parent-child-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority)) or @include icon(glyph(priority), 24, "outline")
      • +
    • HTML: data-icon="priority" or data-icon="priority" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone)) or @include icon(glyph(quiet-zone), 24, "outline")
      • +
    • HTML: data-icon="quiet-zone" or data-icon="quiet-zone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table)) or @include icon(glyph(table), 24, "outline")
      • +
    • HTML: data-icon="table" or data-icon="table" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window)) or @include icon(glyph(window), 24, "outline")
      • +
    • HTML: data-icon="window" or data-icon="window" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.rendered.html new file mode 100644 index 0000000000..86ad4ba307 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.rendered.html @@ -0,0 +1,186 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle)) or @include icon(glyph(aisle), 24, "outline")
      • +
    • HTML: data-icon="aisle" or data-icon="aisle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available)) or @include icon(glyph(aisle-not-available), 24, "outline")
      • +
    • HTML: data-icon="aisle-not-available" or data-icon="aisle-not-available" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed)) or @include icon(glyph(bed), 24, "outline")
      • +
    • HTML: data-icon="bed" or data-icon="bed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment)) or @include icon(glyph(childrens-compartment), 24, "outline")
      • +
    • HTML: data-icon="childrens-compartment" or data-icon="childrens-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly)) or @include icon(glyph(elderly), 24, "outline")
      • +
    • HTML: data-icon="elderly" or data-icon="elderly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped)) or @include icon(glyph(handicapped), 24, "outline")
      • +
    • HTML: data-icon="handicapped" or data-icon="handicapped" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment)) or @include icon(glyph(parent-child-compartment), 24, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" or data-icon="parent-child-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority)) or @include icon(glyph(priority), 24, "outline")
      • +
    • HTML: data-icon="priority" or data-icon="priority" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone)) or @include icon(glyph(quiet-zone), 24, "outline")
      • +
    • HTML: data-icon="quiet-zone" or data-icon="quiet-zone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table)) or @include icon(glyph(table), 24, "outline")
      • +
    • HTML: data-icon="table" or data-icon="table" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window)) or @include icon(glyph(window), 24, "outline")
      • +
    • HTML: data-icon="window" or data-icon="window" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.markup-only.html new file mode 100644 index 0000000000..8d0918830f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.markup-only.html @@ -0,0 +1,141 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus)) or @include icon(glyph(bahnbonus), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus" or data-icon="bahnbonus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card)) or @include icon(glyph(bahnbonus-card), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" or data-icon="bahnbonus-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard)) or @include icon(glyph(bahncard), 24, "outline")
      • +
    • HTML: data-icon="bahncard" or data-icon="bahncard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price)) or @include icon(glyph(best-price), 24, "outline")
      • +
    • HTML: data-icon="best-price" or data-icon="best-price" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket)) or @include icon(glyph(commuter-ticket), 24, "outline")
      • +
    • HTML: data-icon="commuter-ticket" or data-icon="commuter-ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in)) or @include icon(glyph(komfort-check-in), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in" or data-icon="komfort-check-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check)) or @include icon(glyph(komfort-check-in-check), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" or data-icon="komfort-check-in-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle)) or @include icon(glyph(komfort-check-in-circle), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" or data-icon="komfort-check-in-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards)) or @include icon(glyph(multiple-cards), 24, "outline")
      • +
    • HTML: data-icon="multiple-cards" or data-icon="multiple-cards" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger)) or @include icon(glyph(multiple-passenger), 24, "outline")
      • +
    • HTML: data-icon="multiple-passenger" or data-icon="multiple-passenger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel)) or @include icon(glyph(my-travel), 24, "outline")
      • +
    • HTML: data-icon="my-travel" or data-icon="my-travel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey)) or @include icon(glyph(outward-journey), 24, "outline")
      • +
    • HTML: data-icon="outward-journey" or data-icon="outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code)) or @include icon(glyph(qr-code), 24, "outline")
      • +
    • HTML: data-icon="qr-code" or data-icon="qr-code" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan)) or @include icon(glyph(qr-code-scan), 24, "outline")
      • +
    • HTML: data-icon="qr-code-scan" or data-icon="qr-code-scan" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey)) or @include icon(glyph(return-journey), 24, "outline")
      • +
    • HTML: data-icon="return-journey" or data-icon="return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket)) or @include icon(glyph(ticket), 24, "outline")
      • +
    • HTML: data-icon="ticket" or data-icon="ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount)) or @include icon(glyph(ticket-discount), 24, "outline")
      • +
    • HTML: data-icon="ticket-discount" or data-icon="ticket-discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple)) or @include icon(glyph(ticket-multiple), 24, "outline")
      • +
    • HTML: data-icon="ticket-multiple" or data-icon="ticket-multiple" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription)) or @include icon(glyph(ticket-subscription), 24, "outline")
      • +
    • HTML: data-icon="ticket-subscription" or data-icon="ticket-subscription" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey)) or @include icon(glyph(time-outward-journey), 24, "outline")
      • +
    • HTML: data-icon="time-outward-journey" or data-icon="time-outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey)) or @include icon(glyph(time-return-journey), 24, "outline")
      • +
    • HTML: data-icon="time-return-journey" or data-icon="time-return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable)) or @include icon(glyph(timetable), 24, "outline")
      • +
    • HTML: data-icon="timetable" or data-icon="timetable" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance)) or @include icon(glyph(travel-insurance), 24, "outline")
      • +
    • HTML: data-icon="travel-insurance" or data-icon="travel-insurance" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.rendered.html new file mode 100644 index 0000000000..2c305a254e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.rendered.html @@ -0,0 +1,258 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus)) or @include icon(glyph(bahnbonus), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus" or data-icon="bahnbonus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card)) or @include icon(glyph(bahnbonus-card), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" or data-icon="bahnbonus-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard)) or @include icon(glyph(bahncard), 24, "outline")
      • +
    • HTML: data-icon="bahncard" or data-icon="bahncard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price)) or @include icon(glyph(best-price), 24, "outline")
      • +
    • HTML: data-icon="best-price" or data-icon="best-price" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket)) or @include icon(glyph(commuter-ticket), 24, "outline")
      • +
    • HTML: data-icon="commuter-ticket" or data-icon="commuter-ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in)) or @include icon(glyph(komfort-check-in), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in" or data-icon="komfort-check-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check)) or @include icon(glyph(komfort-check-in-check), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" or data-icon="komfort-check-in-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle)) or @include icon(glyph(komfort-check-in-circle), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" or data-icon="komfort-check-in-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards)) or @include icon(glyph(multiple-cards), 24, "outline")
      • +
    • HTML: data-icon="multiple-cards" or data-icon="multiple-cards" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger)) or @include icon(glyph(multiple-passenger), 24, "outline")
      • +
    • HTML: data-icon="multiple-passenger" or data-icon="multiple-passenger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel)) or @include icon(glyph(my-travel), 24, "outline")
      • +
    • HTML: data-icon="my-travel" or data-icon="my-travel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey)) or @include icon(glyph(outward-journey), 24, "outline")
      • +
    • HTML: data-icon="outward-journey" or data-icon="outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code)) or @include icon(glyph(qr-code), 24, "outline")
      • +
    • HTML: data-icon="qr-code" or data-icon="qr-code" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan)) or @include icon(glyph(qr-code-scan), 24, "outline")
      • +
    • HTML: data-icon="qr-code-scan" or data-icon="qr-code-scan" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey)) or @include icon(glyph(return-journey), 24, "outline")
      • +
    • HTML: data-icon="return-journey" or data-icon="return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket)) or @include icon(glyph(ticket), 24, "outline")
      • +
    • HTML: data-icon="ticket" or data-icon="ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount)) or @include icon(glyph(ticket-discount), 24, "outline")
      • +
    • HTML: data-icon="ticket-discount" or data-icon="ticket-discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple)) or @include icon(glyph(ticket-multiple), 24, "outline")
      • +
    • HTML: data-icon="ticket-multiple" or data-icon="ticket-multiple" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription)) or @include icon(glyph(ticket-subscription), 24, "outline")
      • +
    • HTML: data-icon="ticket-subscription" or data-icon="ticket-subscription" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey)) or @include icon(glyph(time-outward-journey), 24, "outline")
      • +
    • HTML: data-icon="time-outward-journey" or data-icon="time-outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey)) or @include icon(glyph(time-return-journey), 24, "outline")
      • +
    • HTML: data-icon="time-return-journey" or data-icon="time-return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable)) or @include icon(glyph(timetable), 24, "outline")
      • +
    • HTML: data-icon="timetable" or data-icon="timetable" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance)) or @include icon(glyph(travel-insurance), 24, "outline")
      • +
    • HTML: data-icon="travel-insurance" or data-icon="travel-insurance" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.markup-only.html new file mode 100644 index 0000000000..66b0c05958 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.markup-only.html @@ -0,0 +1,189 @@ +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "outline")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "outline")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "outline")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "outline")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "outline")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence)) or @include icon(glyph(car-sequence), 24, "outline")
      • +
    • HTML: data-icon="car-sequence" or data-icon="car-sequence" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "outline")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "outline")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "outline")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "outline")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "outline")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "outline")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "outline")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view)) or @include icon(glyph(ice-side-view), 24, "outline")
      • +
    • HTML: data-icon="ice-side-view" or data-icon="ice-side-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "outline")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "outline")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "outline")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly)) or @include icon(glyph(rail-and-fly), 24, "outline")
      • +
    • HTML: data-icon="rail-and-fly" or data-icon="rail-and-fly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car)) or @include icon(glyph(railroad-car), 24, "outline")
      • +
    • HTML: data-icon="railroad-car" or data-icon="railroad-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "outline")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "outline")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev)) or @include icon(glyph(sev), 24, "outline")
      • +
    • HTML: data-icon="sev" or data-icon="sev" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "outline")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter)) or @include icon(glyph(sprinter), 24, "outline")
      • +
    • HTML: data-icon="sprinter" or data-icon="sprinter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "outline")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "outline")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "outline")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "outline")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "outline")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "outline")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.rendered.html new file mode 100644 index 0000000000..8f4c69a409 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.rendered.html @@ -0,0 +1,306 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "outline")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "outline")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "outline")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "outline")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "outline")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence)) or @include icon(glyph(car-sequence), 24, "outline")
      • +
    • HTML: data-icon="car-sequence" or data-icon="car-sequence" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "outline")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "outline")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "outline")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "outline")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "outline")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "outline")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "outline")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view)) or @include icon(glyph(ice-side-view), 24, "outline")
      • +
    • HTML: data-icon="ice-side-view" or data-icon="ice-side-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "outline")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "outline")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "outline")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly)) or @include icon(glyph(rail-and-fly), 24, "outline")
      • +
    • HTML: data-icon="rail-and-fly" or data-icon="rail-and-fly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car)) or @include icon(glyph(railroad-car), 24, "outline")
      • +
    • HTML: data-icon="railroad-car" or data-icon="railroad-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "outline")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "outline")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev)) or @include icon(glyph(sev), 24, "outline")
      • +
    • HTML: data-icon="sev" or data-icon="sev" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "outline")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter)) or @include icon(glyph(sprinter), 24, "outline")
      • +
    • HTML: data-icon="sprinter" or data-icon="sprinter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "outline")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "outline")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "outline")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "outline")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "outline")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "outline")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.markup-only.html new file mode 100644 index 0000000000..ce257d7f41 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.markup-only.html @@ -0,0 +1,75 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="32-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.rendered.html new file mode 100644 index 0000000000..af88011c87 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.rendered.html @@ -0,0 +1,192 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="32-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.markup-only.html new file mode 100644 index 0000000000..88d3e18902 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.markup-only.html @@ -0,0 +1,45 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.rendered.html new file mode 100644 index 0000000000..101ef91b01 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.markup-only.html new file mode 100644 index 0000000000..e68dbc6746 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.markup-only.html @@ -0,0 +1,15 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.rendered.html new file mode 100644 index 0000000000..754c2d6b54 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.markup-only.html new file mode 100644 index 0000000000..2baf5c9193 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.rendered.html new file mode 100644 index 0000000000..eadc2cefec --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.markup-only.html new file mode 100644 index 0000000000..b49491b477 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.markup-only.html @@ -0,0 +1,15 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.rendered.html new file mode 100644 index 0000000000..fd4d08b1b1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.markup-only.html new file mode 100644 index 0000000000..7159fdef35 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.markup-only.html @@ -0,0 +1,153 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.rendered.html new file mode 100644 index 0000000000..a9593461dd --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.rendered.html @@ -0,0 +1,270 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.markup-only.html new file mode 100644 index 0000000000..e608aefa70 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.markup-only.html @@ -0,0 +1,561 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 32, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 32, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 32, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 32, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 32, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 32, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 32, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 32, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 32, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 32, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 32, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 32, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 32, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 32, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 32, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 32, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 32, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 32, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 32, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 32, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 32, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 32, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 32, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 32, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 32, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 32, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 32, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 32, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 32, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 32, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 32, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 32, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 32, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 32, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 32, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 32, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 32, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 32, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 32, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 32, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 32, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 32, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 32, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 32, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 32, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 32, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 32, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 32, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 32, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 32, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 32, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 32, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 32, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 32, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 32, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 32, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 32, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 32, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 32, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 32, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 32, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 32, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 32, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 32, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 32, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 32, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 32, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 32, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 32, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 32, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 32, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 32, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 32, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 32, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 32, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 32, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 32, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.rendered.html new file mode 100644 index 0000000000..964407099e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.rendered.html @@ -0,0 +1,678 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 32, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 32, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 32, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 32, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 32, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 32, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 32, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 32, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 32, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 32, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 32, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 32, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 32, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 32, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 32, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 32, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 32, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 32, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 32, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 32, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 32, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 32, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 32, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 32, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 32, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 32, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 32, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 32, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 32, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 32, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 32, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 32, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 32, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 32, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 32, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 32, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 32, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 32, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 32, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 32, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 32, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 32, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 32, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 32, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 32, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 32, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 32, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 32, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 32, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 32, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 32, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 32, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 32, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 32, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 32, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 32, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 32, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 32, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 32, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 32, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 32, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 32, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 32, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 32, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 32, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 32, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 32, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 32, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 32, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 32, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 32, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 32, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 32, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 32, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 32, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 32, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 32, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.markup-only.html new file mode 100644 index 0000000000..5d88001701 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.markup-only.html @@ -0,0 +1,117 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 32, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 32, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 32, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 32, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 32, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 32, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.rendered.html new file mode 100644 index 0000000000..a9651b2189 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.rendered.html @@ -0,0 +1,234 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 32, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 32, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 32, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 32, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 32, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 32, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.markup-only.html new file mode 100644 index 0000000000..245e8c9362 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 32, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.rendered.html new file mode 100644 index 0000000000..810f24ea1d --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 32, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.markup-only.html new file mode 100644 index 0000000000..fe8dd6b2da --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.markup-only.html @@ -0,0 +1,81 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 32, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 32, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 32, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 32, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 32, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 32, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 32, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 32, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 32, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 32, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 32, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 32, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 32, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.rendered.html new file mode 100644 index 0000000000..6570ce5260 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.rendered.html @@ -0,0 +1,198 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 32, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 32, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 32, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 32, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 32, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 32, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 32, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 32, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 32, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 32, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 32, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 32, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 32, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.markup-only.html new file mode 100644 index 0000000000..a5d86a53c1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 32, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.rendered.html new file mode 100644 index 0000000000..c81baf765c --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 32, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.markup-only.html new file mode 100644 index 0000000000..84d28fcdf3 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.markup-only.html @@ -0,0 +1,63 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 32, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 32, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 32, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 32, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 32, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 32, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 32, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 32, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 32, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 32, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.rendered.html new file mode 100644 index 0000000000..48a12bdd90 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.rendered.html @@ -0,0 +1,180 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 32, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 32, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 32, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 32, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 32, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 32, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 32, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 32, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 32, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 32, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.markup-only.html new file mode 100644 index 0000000000..52362079ae --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.markup-only.html @@ -0,0 +1,135 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 32, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 32, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 32, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 32, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 32, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 32, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 32, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 32, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 32, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 32, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 32, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 32, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 32, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 32, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 32, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 32, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 32, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 32, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 32, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 32, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 32, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 32, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.rendered.html new file mode 100644 index 0000000000..29bb191545 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.rendered.html @@ -0,0 +1,252 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 32, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 32, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 32, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 32, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 32, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 32, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 32, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 32, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 32, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 32, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 32, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 32, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 32, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 32, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 32, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 32, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 32, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 32, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 32, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 32, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 32, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 32, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.markup-only.html new file mode 100644 index 0000000000..1ffe58b699 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.markup-only.html @@ -0,0 +1,27 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 32, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 32, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 32, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 32, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.rendered.html new file mode 100644 index 0000000000..9781cf6284 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.rendered.html @@ -0,0 +1,144 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 32, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 32, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 32, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 32, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.markup-only.html new file mode 100644 index 0000000000..053c19db47 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 32, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.rendered.html new file mode 100644 index 0000000000..bf1d138239 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 32, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.markup-only.html new file mode 100644 index 0000000000..4086a7587e --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.markup-only.html @@ -0,0 +1,87 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 32, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 32, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 32, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 32, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 32, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 32, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 32, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 32, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 32, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 32, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.rendered.html new file mode 100644 index 0000000000..aab24cf629 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.rendered.html @@ -0,0 +1,204 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 32, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 32, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 32, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 32, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 32, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 32, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 32, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 32, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 32, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 32, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.markup-only.html new file mode 100644 index 0000000000..018d1806e9 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.markup-only.html @@ -0,0 +1,87 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 32, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 32, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 32, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 32, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 32, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 32, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 32, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 32, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 32, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 32, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.rendered.html new file mode 100644 index 0000000000..798b4c19cf --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.rendered.html @@ -0,0 +1,204 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 32, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 32, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 32, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 32, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 32, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 32, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 32, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 32, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 32, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 32, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.markup-only.html new file mode 100644 index 0000000000..bcfd9adc47 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.markup-only.html @@ -0,0 +1,123 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 32, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 32, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 32, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 32, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 32, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 32, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 32, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 32, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 32, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 32, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 32, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 32, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 32, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 32, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 32, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 32, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 32, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 32, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 32, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.rendered.html new file mode 100644 index 0000000000..cbf2ccf9e4 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.rendered.html @@ -0,0 +1,240 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 32, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 32, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 32, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 32, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 32, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 32, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 32, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 32, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 32, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 32, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 32, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 32, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 32, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 32, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 32, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 32, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 32, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 32, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 32, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.markup-only.html new file mode 100644 index 0000000000..28594e52c9 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.markup-only.html @@ -0,0 +1,27 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 32, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 32, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.rendered.html new file mode 100644 index 0000000000..28f34c8872 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.rendered.html @@ -0,0 +1,144 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 32, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 32, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.markup-only.html new file mode 100644 index 0000000000..55a0c8f152 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.markup-only.html @@ -0,0 +1,69 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 32, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 32, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 32, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 32, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 32, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 32, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 32, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 32, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 32, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 32, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 32, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.rendered.html new file mode 100644 index 0000000000..905a037c2f --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.rendered.html @@ -0,0 +1,186 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 32, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 32, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 32, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 32, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 32, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 32, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 32, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 32, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 32, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 32, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 32, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.markup-only.html new file mode 100644 index 0000000000..6f58f30578 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.markup-only.html @@ -0,0 +1,141 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 32, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 32, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 32, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 32, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 32, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 32, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 32, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 32, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 32, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 32, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 32, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 32, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 32, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 32, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 32, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 32, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 32, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 32, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.rendered.html new file mode 100644 index 0000000000..db4b010c43 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.rendered.html @@ -0,0 +1,258 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 32, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 32, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 32, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 32, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 32, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 32, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 32, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 32, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 32, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 32, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 32, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 32, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 32, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 32, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 32, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 32, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 32, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 32, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.hbs b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.markup-only.html new file mode 100644 index 0000000000..48246a5ec0 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.markup-only.html @@ -0,0 +1,189 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 32, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 32, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 32, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 32, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 32, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 32, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.rendered.html new file mode 100644 index 0000000000..822aa439a3 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.rendered.html @@ -0,0 +1,306 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 32, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 32, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 32, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 32, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 32, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 32, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.markup-only.html new file mode 100644 index 0000000000..a3953d1862 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.markup-only.html @@ -0,0 +1,39 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.rendered.html new file mode 100644 index 0000000000..f7088b18d4 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.rendered.html @@ -0,0 +1,156 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.markup-only.html new file mode 100644 index 0000000000..83a4147c28 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.markup-only.html @@ -0,0 +1,45 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 48, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.rendered.html new file mode 100644 index 0000000000..a183fae0f1 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 48, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.hbs b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.markup-only.html new file mode 100644 index 0000000000..5542f50021 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 48, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="48-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.rendered.html new file mode 100644 index 0000000000..eb2ba70d58 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 48, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="48-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.markup-only.html new file mode 100644 index 0000000000..aa0d04a391 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.markup-only.html @@ -0,0 +1,39 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-filled"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.rendered.html new file mode 100644 index 0000000000..e2aa9860ba --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.rendered.html @@ -0,0 +1,156 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-filled"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.hbs b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.markup-only.html new file mode 100644 index 0000000000..9e89adbfe4 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.markup-only.html @@ -0,0 +1,45 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 64, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.rendered.html new file mode 100644 index 0000000000..0d8d6e85cb --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 64, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.hbs b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.markup-only.html new file mode 100644 index 0000000000..ad4796144c --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.markup-only.html @@ -0,0 +1,9 @@ + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 64, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="64-outline"
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.rendered.html new file mode 100644 index 0000000000..f0ea49e15d --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.rendered.html @@ -0,0 +1,126 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 64, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="64-outline"
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.hbs b/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.hbs new file mode 100644 index 0000000000..bedfe95b76 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.hbs @@ -0,0 +1,11 @@ +{{#if default}}

Please keep in mind that it's optional to set the variant and size for the following ones, as this size ({{ @root.icon-size }}) and style ({{ @root.icon-style }}) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

{{/if }} +
    + {{#each icons }} +
  • +
      +
    • SCSS: {{#if @root.default}}@include icon(glyph({{ icon-glyph }})) or {{/if }}@include icon(glyph({{ icon-glyph }}), {{ @root.icon-size }}, "{{ @root.icon-style }}")
      • +
    • HTML: {{#if @root.default}}data-icon="{{ icon-glyph }}" or {{/if }}data-icon="{{ icon-glyph }}" data-icon-variant="{{ @root.icon-size }}-{{ @root.icon-style }}"
      • +
    +
    • + {{/each }} +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.markup-only.html b/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.markup-only.html new file mode 100644 index 0000000000..4e5313a3fc --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.markup-only.html @@ -0,0 +1,3 @@ + +
    +
diff --git a/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.rendered.html b/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.rendered.html new file mode 100644 index 0000000000..8b594eaf36 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-icon-library/base-icons-icon-library.rendered.html @@ -0,0 +1,120 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.hbs b/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.hbs new file mode 100644 index 0000000000..bb78675df4 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.hbs @@ -0,0 +1,17 @@ +{{#each icons }} + {{#if @first }}{{/if }} +
{{ @key }}
+
    + {{#each this }}
  • +
      + {{#each @root.example-bgs }} +
    • + +
      • + {{/each }} +
    +
    • {{/each }} +
+{{/each }} diff --git a/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.markup-only.html b/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.markup-only.html new file mode 100644 index 0000000000..3b5cbddb5c --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.markup-only.html @@ -0,0 +1,3060 @@ + +
Action
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Communication
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Covid 19
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Devices
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Entertainment
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Feature
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Food /db_ic_il_ Drink
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Maps
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
News
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Station
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Ticket
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Transportation
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Travel
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Weather
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
diff --git a/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.rendered.html b/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.rendered.html new file mode 100644 index 0000000000..8dbf8a60b8 --- /dev/null +++ b/version/v2.18.3/patterns/base-icons-illustration-icons/base-icons-illustration-icons.rendered.html @@ -0,0 +1,3177 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Action
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Communication
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Covid 19
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Devices
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Entertainment
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Feature
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Food /db_ic_il_ Drink
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Maps
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
News
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Station
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Ticket
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Transportation
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Travel
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Weather
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-icons/index.html b/version/v2.18.3/patterns/base-icons/index.html new file mode 100644 index 0000000000..7ff9d6e6ff --- /dev/null +++ b/version/v2.18.3/patterns/base-icons/index.html @@ -0,0 +1,13892 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Icons +

+ +
+

New iconset

+

The included iconset has been developed in cooperation with the Center of Excellence @ Personenverkehr and replaces the previous enterprise only icons. More information: https://marketingportal.extranet.deutschebahn.com/marketingportal/Basiselemente/Icons/Funktionale-Icons-Architektur-und-Fahrzeuge

+

Usage

+

You could use the icons either within your SCSS code as described below, which is the recommended approach. +Alternatively you could also use the attribute based configuration.

+

And we're additionally providing the icons as the sources (SVG) files as well.

+

Icon font

+

Different glyphs

+

All of the available glyphs variables are shown on this page right next to the icon, with the SCSS and attribute based variables/values shown next to them.

+

SCSS (recommended)

+
Icon for element
+

Use the following SCSS mixin for setting an icon:

+
// schema
+@mixin icon(
+  $glyph: "",
+  $size: $icon-size,
+  $style: $icon-style,
+  $position: "before"
+);
+
+// example
+span.with-an-icon {
+  @include icon(glyph(account), 20, "outline");
+}
+
+

As both $icon-size and $icon-style are available to get configured with default values, and $position is only a variant (explained in the next paragraph) only the first one is really mandatory.

+
Displaying the icon after text
+

If you'd like to include the icon after the text, set the last parameter to after.

+
Hiding the text next to an icon
+

In case of the need to display only the icon and hide the text next to it, use the following mixin:

+
@include is-icon-text-replace();
+
+

Attribute based configuration

+
Icon for element
+

Use the data-icon and data-icon-variant HTML attributes for setting an icon:

+
<a href="#" data-icon="alarm" data-icon-variant="24-outline">Alarm</a>
+
+

The data-icon-variant is an optional attribute, that you don't need to declare in case that you'd like to use the default icon size and style, that are defined by the $icon-size and $icon-style SCSS variables (size: 24 and style: outline as defaults), that could obviously get overwritten by individual SCSS declarations; so you'll end up with a very simply definition when relying on the defaults:

+
<a href="#" data-icon="alarm">Alarm</a>
+
+

Of course this icons definition does as well have an equivalent for icons after the content: data-icon-variant-after

+
Displaying the icon after text
+

If you'd like to include the icon after the content/text, use the HTML attribute data-icon-after instead of data-icon, example:

+
<a
+  href="#"
+  data-icon-after="alarm"
+  data-icon-variant-after="24-outline"
+  class="elm-link"
+  >Alarm</a
+>
+
+
Hiding the text next to an icon
+

In case of the need to display only the icon and hide the text next to it, use the following class:

+
.is-icon-text-replace
+
+
Tweaking icons font-size
+

If you'd like to control the icons font-size any further (defining sizes in between all of the data-icon-variant declarations, like e.g. having an icon font-size of 23px instead of 24px when defining data-icon-variant="24-outline"), you could set set one of the CSS variables --icon-font-size-before or --icon-font-size-after (in this case --icon-font-size-before: 23px).

+
<a
+  href="#"
+  data-icon="alarm"
+  data-icon-variant="24-outline"
+  style="--icon-font-size-before: 23px"
+  >Alarm</a
+>
+
+

Further tweaking

+

SVG files

+

As mentioned above we're even also providing all of the icon sources (svg files) within this package in the folder node_modules/@db-ui/core/dist/icons/.

+

And we're enabling to change the colors for the illustrative icons ("pulse" and icon itself) as well as the functional icons (only the single-color icon), through the two following CSS variables / CSS custom properties, with their included default (second value):

+
var(--db-icon-color, currentColor)
+var(--db-icon-pulse-color, #EC0016)
+
+

Accessibility

+

Regarding accessibility icons are providing cognitive complementary visual support for sighted people (e.g. people with reading difficulties), as well as quick recognition of specific functionality and UX patterns like e.g. the bin/waste paper basket symbol for a delete action.

+

On the other hand icons shouldn't get recognized and output by assistive technologies like screenreaders, as those glyphs or signs being used in case of an icon webfont don't necessarly provide a meaning - and on the other hand each icon being used on the page should always as well get included in conjunction with some textual description both as a fallback as well as providing some meaning even and especially if the icon itself doesn't provide a unique meaning on it's own (to all users idependently from their skill level/experience, culture, etc.).

+

Additionally this pattern has been tested and approved regarding accessibility.

+

Inspirational external sources for this pattern

+ + +
+ +
+
+ +
+ +

+ + + Icon Library + + + + +

+ + + +
+ +
+
+ +
+ +
    +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 16, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 16, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 16, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="16-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 16, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="16-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 16, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 16, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="16-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(add), 16, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 16, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 16, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="16-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 16, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 16, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 16, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 16, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 16, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 16, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 16, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 16, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 16, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="16-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "filled")
      • +
    • HTML: data-icon="account" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "filled")
      • +
    • HTML: data-icon="block" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "filled")
      • +
    • HTML: data-icon="build" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "filled")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "filled")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "filled")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "filled")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "filled")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "filled")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "filled")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "filled")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "filled")
      • +
    • HTML: data-icon="image" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "filled")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "filled")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "filled")
      • +
    • HTML: data-icon="print" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "filled")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "filled")
      • +
    • HTML: data-icon="save" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "filled")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "filled")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "filled")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "filled")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "filled")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Communication + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "filled")
      • +
    • HTML: data-icon="call" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "filled")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "filled")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "filled")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "filled")
      • +
    • HTML: data-icon="question" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "filled")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "filled")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Feature + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "filled")
      • +
    • HTML: data-icon="day" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "filled")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "filled")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "filled")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "filled")
      • +
    • HTML: data-icon="night" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "filled")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "filled")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Food + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "filled")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "filled")
      • +
    • HTML: data-icon="database" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Journey + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "filled")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "filled")
      • +
    • HTML: data-icon="home" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "filled")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "filled")
      • +
    • HTML: data-icon="place" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "filled")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "filled")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Ticket + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "filled")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "filled")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "filled")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 20, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 20, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 20, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 20, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 20, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 20, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 20, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 20, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 20, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 20, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 20, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 20, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 20, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 20, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 20, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 20, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 20, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 20, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 20, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 20, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 20, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 20, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 20, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 20, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 20, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 20, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 20, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 20, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 20, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 20, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 20, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 20, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 20, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 20, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 20, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 20, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 20, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 20, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 20, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 20, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 20, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 20, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 20, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 20, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 20, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 20, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 20, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 20, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 20, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 20, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 20, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 20, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 20, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 20, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 20, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 20, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 20, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 20, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 20, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 20, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 20, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 20, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Communication + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 20, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 20, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 20, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 20, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 20, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 20, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Covid 19 + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 20, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Facilities + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 20, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 20, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 20, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 20, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 20, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 20, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 20, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 20, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 20, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 20, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Feature + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 20, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 20, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 20, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 20, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 20, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 20, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 20, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 20, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 20, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 20, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 20, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 20, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 20, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 20, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 20, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Food + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 20, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 20, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 20, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Journey + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 20, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 20, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 20, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 20, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 20, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 20, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 20, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 20, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 20, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 20, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 20, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 20, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 20, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 20, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 20, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 20, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 20, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 20, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 20, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 20, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 20, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 20, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 20, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 20, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 20, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 20, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 20, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 20, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 20, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 20, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 20, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 20, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 20, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 20, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 20, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Seat + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 20, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 20, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 20, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 20, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 20, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 20, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 20, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 20, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 20, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 20, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 20, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Ticket + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 20, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 20, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 20, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 20, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 20, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 20, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 20, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 20, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 20, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 20, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 20, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 20, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 20, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 20, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 20, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 20, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 20, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-bus), 20, "outline")
      • +
    • HTML: data-icon="ev-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-train), 20, "outline")
      • +
    • HTML: data-icon="ev-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 20, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 20, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 20, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 20, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 20, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "filled")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "filled")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "filled")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "filled")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "filled")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "filled")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "filled")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "filled")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "filled")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "filled")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "filled")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "filled")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "filled")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "filled")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "filled")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "filled")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "filled")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "filled")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "filled")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Journey + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "filled")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Maps + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "filled")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "filled")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "filled")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "filled")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "filled")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Transportation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "filled")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "filled")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "filled")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "filled")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "filled")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "filled")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "filled")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "filled")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "filled")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "filled")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "filled")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "filled")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "filled")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "filled")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "filled")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "filled")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "filled")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "filled")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "filled")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "filled")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "filled")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "filled")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "filled")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "filled")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(account)) or @include icon(glyph(account), 24, "outline")
      • +
    • HTML: data-icon="account" or data-icon="account" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add)) or @include icon(glyph(add), 24, "outline")
      • +
    • HTML: data-icon="add" or data-icon="add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "outline")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link)) or @include icon(glyph(add-link), 24, "outline")
      • +
    • HTML: data-icon="add-link" or data-icon="add-link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm)) or @include icon(glyph(alarm), 24, "outline")
      • +
    • HTML: data-icon="alarm" or data-icon="alarm" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add)) or @include icon(glyph(alarm-add), 24, "outline")
      • +
    • HTML: data-icon="alarm-add" or data-icon="alarm-add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "outline")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off)) or @include icon(glyph(alert-off), 24, "outline")
      • +
    • HTML: data-icon="alert-off" or data-icon="alert-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment)) or @include icon(glyph(attachment), 24, "outline")
      • +
    • HTML: data-icon="attachment" or data-icon="attachment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality)) or @include icon(glyph(augmented-reality), 24, "outline")
      • +
    • HTML: data-icon="augmented-reality" or data-icon="augmented-reality" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block)) or @include icon(glyph(block), 24, "outline")
      • +
    • HTML: data-icon="block" or data-icon="block" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "outline")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug)) or @include icon(glyph(bug), 24, "outline")
      • +
    • HTML: data-icon="bug" or data-icon="bug" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build)) or @include icon(glyph(build), 24, "outline")
      • +
    • HTML: data-icon="build" or data-icon="build" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar)) or @include icon(glyph(calendar), 24, "outline")
      • +
    • HTML: data-icon="calendar" or data-icon="calendar" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "outline")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash)) or @include icon(glyph(cash), 24, "outline")
      • +
    • HTML: data-icon="cash" or data-icon="cash" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "outline")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "outline")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download)) or @include icon(glyph(cloud-download), 24, "outline")
      • +
    • HTML: data-icon="cloud-download" or data-icon="cloud-download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload)) or @include icon(glyph(cloud-upload), 24, "outline")
      • +
    • HTML: data-icon="cloud-upload" or data-icon="cloud-upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass)) or @include icon(glyph(compass), 24, "outline")
      • +
    • HTML: data-icon="compass" or data-icon="compass" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy)) or @include icon(glyph(copy), 24, "outline")
      • +
    • HTML: data-icon="copy" or data-icon="copy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card)) or @include icon(glyph(credit-card), 24, "outline")
      • +
    • HTML: data-icon="credit-card" or data-icon="credit-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard)) or @include icon(glyph(dashboard), 24, "outline")
      • +
    • HTML: data-icon="dashboard" or data-icon="dashboard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete)) or @include icon(glyph(delete), 24, "outline")
      • +
    • HTML: data-icon="delete" or data-icon="delete" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount)) or @include icon(glyph(discount), 24, "outline")
      • +
    • HTML: data-icon="discount" or data-icon="discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document)) or @include icon(glyph(document), 24, "outline")
      • +
    • HTML: data-icon="document" or data-icon="document" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check)) or @include icon(glyph(document-check), 24, "outline")
      • +
    • HTML: data-icon="document-check" or data-icon="document-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done)) or @include icon(glyph(done), 24, "outline")
      • +
    • HTML: data-icon="done" or data-icon="done" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download)) or @include icon(glyph(download), 24, "outline")
      • +
    • HTML: data-icon="download" or data-icon="download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop)) or @include icon(glyph(drag-and-drop), 24, "outline")
      • +
    • HTML: data-icon="drag-and-drop" or data-icon="drag-and-drop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit)) or @include icon(glyph(edit), 24, "outline")
      • +
    • HTML: data-icon="edit" or data-icon="edit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted)) or @include icon(glyph(face-delighted), 24, "outline")
      • +
    • HTML: data-icon="face-delighted" or data-icon="face-delighted" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed)) or @include icon(glyph(face-disappointed), 24, "outline")
      • +
    • HTML: data-icon="face-disappointed" or data-icon="face-disappointed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral)) or @include icon(glyph(face-neutral), 24, "outline")
      • +
    • HTML: data-icon="face-neutral" or data-icon="face-neutral" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad)) or @include icon(glyph(face-sad), 24, "outline")
      • +
    • HTML: data-icon="face-sad" or data-icon="face-sad" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling)) or @include icon(glyph(face-smiling), 24, "outline")
      • +
    • HTML: data-icon="face-smiling" or data-icon="face-smiling" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter)) or @include icon(glyph(filter), 24, "outline")
      • +
    • HTML: data-icon="filter" or data-icon="filter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint)) or @include icon(glyph(fingerprint), 24, "outline")
      • +
    • HTML: data-icon="fingerprint" or data-icon="fingerprint" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder)) or @include icon(glyph(folder), 24, "outline")
      • +
    • HTML: data-icon="folder" or data-icon="folder" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open)) or @include icon(glyph(folder-open), 24, "outline")
      • +
    • HTML: data-icon="folder-open" or data-icon="folder-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card)) or @include icon(glyph(generic-card), 24, "outline")
      • +
    • HTML: data-icon="generic-card" or data-icon="generic-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard)) or @include icon(glyph(giftcard), 24, "outline")
      • +
    • HTML: data-icon="giftcard" or data-icon="giftcard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing)) or @include icon(glyph(hearing), 24, "outline")
      • +
    • HTML: data-icon="hearing" or data-icon="hearing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled)) or @include icon(glyph(hearing-disabled), 24, "outline")
      • +
    • HTML: data-icon="hearing-disabled" or data-icon="hearing-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "outline")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "outline")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image)) or @include icon(glyph(image), 24, "outline")
      • +
    • HTML: data-icon="image" or data-icon="image" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "outline")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key)) or @include icon(glyph(key), 24, "outline")
      • +
    • HTML: data-icon="key" or data-icon="key" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal)) or @include icon(glyph(legal), 24, "outline")
      • +
    • HTML: data-icon="legal" or data-icon="legal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb)) or @include icon(glyph(lightbulb), 24, "outline")
      • +
    • HTML: data-icon="lightbulb" or data-icon="lightbulb" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close)) or @include icon(glyph(lock-close), 24, "outline")
      • +
    • HTML: data-icon="lock-close" or data-icon="lock-close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open)) or @include icon(glyph(lock-open), 24, "outline")
      • +
    • HTML: data-icon="lock-open" or data-icon="lock-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out)) or @include icon(glyph(log-out), 24, "outline")
      • +
    • HTML: data-icon="log-out" or data-icon="log-out" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook)) or @include icon(glyph(logbook), 24, "outline")
      • +
    • HTML: data-icon="logbook" or data-icon="logbook" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus)) or @include icon(glyph(minus), 24, "outline")
      • +
    • HTML: data-icon="minus" or data-icon="minus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank)) or @include icon(glyph(piggybank), 24, "outline")
      • +
    • HTML: data-icon="piggybank" or data-icon="piggybank" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "outline")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print)) or @include icon(glyph(print), 24, "outline")
      • +
    • HTML: data-icon="print" or data-icon="print" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button)) or @include icon(glyph(push-button), 24, "outline")
      • +
    • HTML: data-icon="push-button" or data-icon="push-button" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "outline")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize)) or @include icon(glyph(resize), 24, "outline")
      • +
    • HTML: data-icon="resize" or data-icon="resize" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner)) or @include icon(glyph(resize-handle-corner), 24, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" or data-icon="resize-handle-corner" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save)) or @include icon(glyph(save), 24, "outline")
      • +
    • HTML: data-icon="save" or data-icon="save" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule)) or @include icon(glyph(schedule), 24, "outline")
      • +
    • HTML: data-icon="schedule" or data-icon="schedule" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search)) or @include icon(glyph(search), 24, "outline")
      • +
    • HTML: data-icon="search" or data-icon="search" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send)) or @include icon(glyph(send), 24, "outline")
      • +
    • HTML: data-icon="send" or data-icon="send" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa)) or @include icon(glyph(sepa), 24, "outline")
      • +
    • HTML: data-icon="sepa" or data-icon="sepa" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings)) or @include icon(glyph(settings), 24, "outline")
      • +
    • HTML: data-icon="settings" or data-icon="settings" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share)) or @include icon(glyph(share), 24, "outline")
      • +
    • HTML: data-icon="share" or data-icon="share" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag)) or @include icon(glyph(shopping-bag), 24, "outline")
      • +
    • HTML: data-icon="shopping-bag" or data-icon="shopping-bag" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket)) or @include icon(glyph(shopping-basket), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket" or data-icon="shopping-basket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled)) or @include icon(glyph(shopping-basket-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" or data-icon="shopping-basket-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart)) or @include icon(glyph(shopping-cart), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart" or data-icon="shopping-cart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled)) or @include icon(glyph(shopping-cart-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" or data-icon="shopping-cart-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down)) or @include icon(glyph(sort-down), 24, "outline")
      • +
    • HTML: data-icon="sort-down" or data-icon="sort-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up)) or @include icon(glyph(sort-up), 24, "outline")
      • +
    • HTML: data-icon="sort-up" or data-icon="sort-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "outline")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal)) or @include icon(glyph(swap-horizontal), 24, "outline")
      • +
    • HTML: data-icon="swap-horizontal" or data-icon="swap-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical)) or @include icon(glyph(swap-vertical), 24, "outline")
      • +
    • HTML: data-icon="swap-vertical" or data-icon="swap-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up)) or @include icon(glyph(thumb-up), 24, "outline")
      • +
    • HTML: data-icon="thumb-up" or data-icon="thumb-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down)) or @include icon(glyph(thumb-up-down), 24, "outline")
      • +
    • HTML: data-icon="thumb-up-down" or data-icon="thumb-up-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation)) or @include icon(glyph(translation), 24, "outline")
      • +
    • HTML: data-icon="translation" or data-icon="translation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo)) or @include icon(glyph(undo), 24, "outline")
      • +
    • HTML: data-icon="undo" or data-icon="undo" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload)) or @include icon(glyph(upload), 24, "outline")
      • +
    • HTML: data-icon="upload" or data-icon="upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility)) or @include icon(glyph(visibility), 24, "outline")
      • +
    • HTML: data-icon="visibility" or data-icon="visibility" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off)) or @include icon(glyph(visibility-off), 24, "outline")
      • +
    • HTML: data-icon="visibility-off" or data-icon="visibility-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher)) or @include icon(glyph(voucher), 24, "outline")
      • +
    • HTML: data-icon="voucher" or data-icon="voucher" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website)) or @include icon(glyph(website), 24, "outline")
      • +
    • HTML: data-icon="website" or data-icon="website" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in)) or @include icon(glyph(zoom-in), 24, "outline")
      • +
    • HTML: data-icon="zoom-in" or data-icon="zoom-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out)) or @include icon(glyph(zoom-out), 24, "outline")
      • +
    • HTML: data-icon="zoom-out" or data-icon="zoom-out" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "outline")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10)) or @include icon(glyph(fast-backward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-10" or data-icon="fast-backward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30)) or @include icon(glyph(fast-backward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-30" or data-icon="fast-backward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty)) or @include icon(glyph(fast-backward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" or data-icon="fast-backward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "outline")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10)) or @include icon(glyph(fast-forward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-10" or data-icon="fast-forward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30)) or @include icon(glyph(fast-forward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-30" or data-icon="fast-forward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty)) or @include icon(glyph(fast-forward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" or data-icon="fast-forward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "outline")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause)) or @include icon(glyph(pause), 24, "outline")
      • +
    • HTML: data-icon="pause" or data-icon="pause" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "outline")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "outline")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "outline")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "outline")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles)) or @include icon(glyph(subtitles), 24, "outline")
      • +
    • HTML: data-icon="subtitles" or data-icon="subtitles" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down)) or @include icon(glyph(volume-down), 24, "outline")
      • +
    • HTML: data-icon="volume-down" or data-icon="volume-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute)) or @include icon(glyph(volume-mute), 24, "outline")
      • +
    • HTML: data-icon="volume-mute" or data-icon="volume-mute" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off)) or @include icon(glyph(volume-off), 24, "outline")
      • +
    • HTML: data-icon="volume-off" or data-icon="volume-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up)) or @include icon(glyph(volume-up), 24, "outline")
      • +
    • HTML: data-icon="volume-up" or data-icon="volume-up" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(logo)) or @include icon(glyph(logo), 24, "outline")
      • +
    • HTML: data-icon="logo" or data-icon="logo" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Communication + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(call)) or @include icon(glyph(call), 24, "outline")
      • +
    • HTML: data-icon="call" or data-icon="call" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat)) or @include icon(glyph(chat), 24, "outline")
      • +
    • HTML: data-icon="chat" or data-icon="chat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation)) or @include icon(glyph(conversation), 24, "outline")
      • +
    • HTML: data-icon="conversation" or data-icon="conversation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax)) or @include icon(glyph(fax), 24, "outline")
      • +
    • HTML: data-icon="fax" or data-icon="fax" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback)) or @include icon(glyph(feedback), 24, "outline")
      • +
    • HTML: data-icon="feedback" or data-icon="feedback" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail)) or @include icon(glyph(mail), 24, "outline")
      • +
    • HTML: data-icon="mail" or data-icon="mail" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone)) or @include icon(glyph(mobile-phone), 24, "outline")
      • +
    • HTML: data-icon="mobile-phone" or data-icon="mobile-phone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off)) or @include icon(glyph(mobile-off), 24, "outline")
      • +
    • HTML: data-icon="mobile-off" or data-icon="mobile-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question)) or @include icon(glyph(question), 24, "outline")
      • +
    • HTML: data-icon="question" or data-icon="question" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item)) or @include icon(glyph(receive-item), 24, "outline")
      • +
    • HTML: data-icon="receive-item" or data-icon="receive-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item)) or @include icon(glyph(share-item), 24, "outline")
      • +
    • HTML: data-icon="share-item" or data-icon="share-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi)) or @include icon(glyph(wifi), 24, "outline")
      • +
    • HTML: data-icon="wifi" or data-icon="wifi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off)) or @include icon(glyph(wifi-off), 24, "outline")
      • +
    • HTML: data-icon="wifi-off" or data-icon="wifi-off" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Covid 19 + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(mask)) or @include icon(glyph(mask), 24, "outline")
      • +
    • HTML: data-icon="mask" or data-icon="mask" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Facilities + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(playground)) or @include icon(glyph(playground), 24, "outline")
      • +
    • HTML: data-icon="playground" or data-icon="playground" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet)) or @include icon(glyph(restricted-mobility-toilet), 24, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" or data-icon="restricted-mobility-toilet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower)) or @include icon(glyph(shower), 24, "outline")
      • +
    • HTML: data-icon="shower" or data-icon="shower" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men)) or @include icon(glyph(shower-men), 24, "outline")
      • +
    • HTML: data-icon="shower-men" or data-icon="shower-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women)) or @include icon(glyph(shower-women), 24, "outline")
      • +
    • HTML: data-icon="shower-women" or data-icon="shower-women" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink)) or @include icon(glyph(sink), 24, "outline")
      • +
    • HTML: data-icon="sink" or data-icon="sink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc)) or @include icon(glyph(wc), 24, "outline")
      • +
    • HTML: data-icon="wc" or data-icon="wc" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men)) or @include icon(glyph(wc-men), 24, "outline")
      • +
    • HTML: data-icon="wc-men" or data-icon="wc-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign)) or @include icon(glyph(wc-sign), 24, "outline")
      • +
    • HTML: data-icon="wc-sign" or data-icon="wc-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman)) or @include icon(glyph(wc-woman), 24, "outline")
      • +
    • HTML: data-icon="wc-woman" or data-icon="wc-woman" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Feature + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition)) or @include icon(glyph(air-condition), 24, "outline")
      • +
    • HTML: data-icon="air-condition" or data-icon="air-condition" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy)) or @include icon(glyph(buggy), 24, "outline")
      • +
    • HTML: data-icon="buggy" or data-icon="buggy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger)) or @include icon(glyph(clothing-hanger), 24, "outline")
      • +
    • HTML: data-icon="clothing-hanger" or data-icon="clothing-hanger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day)) or @include icon(glyph(day), 24, "outline")
      • +
    • HTML: data-icon="day" or data-icon="day" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog)) or @include icon(glyph(dog), 24, "outline")
      • +
    • HTML: data-icon="dog" or data-icon="dog" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid)) or @include icon(glyph(entry-aid), 24, "outline")
      • +
    • HTML: data-icon="entry-aid" or data-icon="entry-aid" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check)) or @include icon(glyph(environmental-mobility-check), 24, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" or data-icon="environmental-mobility-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen)) or @include icon(glyph(hydrogen), 24, "outline")
      • +
    • HTML: data-icon="hydrogen" or data-icon="hydrogen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment)) or @include icon(glyph(luggage-compartment), 24, "outline")
      • +
    • HTML: data-icon="luggage-compartment" or data-icon="luggage-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack)) or @include icon(glyph(luggage-rack), 24, "outline")
      • +
    • HTML: data-icon="luggage-rack" or data-icon="luggage-rack" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace)) or @include icon(glyph(marketplace), 24, "outline")
      • +
    • HTML: data-icon="marketplace" or data-icon="marketplace" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical)) or @include icon(glyph(medical), 24, "outline")
      • +
    • HTML: data-icon="medical" or data-icon="medical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night)) or @include icon(glyph(night), 24, "outline")
      • +
    • HTML: data-icon="night" or data-icon="night" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking)) or @include icon(glyph(no-smoking), 24, "outline")
      • +
    • HTML: data-icon="no-smoking" or data-icon="no-smoking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane)) or @include icon(glyph(person-with-cane), 24, "outline")
      • +
    • HTML: data-icon="person-with-cane" or data-icon="person-with-cane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator)) or @include icon(glyph(person-with-rollator), 24, "outline")
      • +
    • HTML: data-icon="person-with-rollator" or data-icon="person-with-rollator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform)) or @include icon(glyph(platform), 24, "outline")
      • +
    • HTML: data-icon="platform" or data-icon="platform" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet)) or @include icon(glyph(power-outlet), 24, "outline")
      • +
    • HTML: data-icon="power-outlet" or data-icon="power-outlet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation)) or @include icon(glyph(reservation), 24, "outline")
      • +
    • HTML: data-icon="reservation" or data-icon="reservation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room)) or @include icon(glyph(standing-room), 24, "outline")
      • +
    • HTML: data-icon="standing-room" or data-icon="standing-room" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry)) or @include icon(glyph(steppless-entry), 24, "outline")
      • +
    • HTML: data-icon="steppless-entry" or data-icon="steppless-entry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog)) or @include icon(glyph(support-dog), 24, "outline")
      • +
    • HTML: data-icon="support-dog" or data-icon="support-dog" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Food + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast)) or @include icon(glyph(breakfast), 24, "outline")
      • +
    • HTML: data-icon="breakfast" or data-icon="breakfast" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup)) or @include icon(glyph(coffee-cup), 24, "outline")
      • +
    • HTML: data-icon="coffee-cup" or data-icon="coffee-cup" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink)) or @include icon(glyph(drink), 24, "outline")
      • +
    • HTML: data-icon="drink" or data-icon="drink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant)) or @include icon(glyph(restaurant), 24, "outline")
      • +
    • HTML: data-icon="restaurant" or data-icon="restaurant" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 24, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Journey + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class)) or @include icon(glyph(1st-class), 24, "outline")
      • +
    • HTML: data-icon="1st-class" or data-icon="1st-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class)) or @include icon(glyph(2nd-class), 24, "outline")
      • +
    • HTML: data-icon="2nd-class" or data-icon="2nd-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection)) or @include icon(glyph(alternative-connection), 24, "outline")
      • +
    • HTML: data-icon="alternative-connection" or data-icon="alternative-connection" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking)) or @include icon(glyph(booking), 24, "outline")
      • +
    • HTML: data-icon="booking" or data-icon="booking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "outline")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop)) or @include icon(glyph(intermediary-stop), 24, "outline")
      • +
    • HTML: data-icon="intermediary-stop" or data-icon="intermediary-stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class)) or @include icon(glyph(mixed-class), 24, "outline")
      • +
    • HTML: data-icon="mixed-class" or data-icon="mixed-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip)) or @include icon(glyph(round-trip), 24, "outline")
      • +
    • HTML: data-icon="round-trip" or data-icon="round-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip)) or @include icon(glyph(single-trip), 24, "outline")
      • +
    • HTML: data-icon="single-trip" or data-icon="single-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start)) or @include icon(glyph(start), 24, "outline")
      • +
    • HTML: data-icon="start" or data-icon="start" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Maps + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "outline")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "outline")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home)) or @include icon(glyph(home), 24, "outline")
      • +
    • HTML: data-icon="home" or data-icon="home" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map)) or @include icon(glyph(map), 24, "outline")
      • +
    • HTML: data-icon="map" or data-icon="map" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight)) or @include icon(glyph(navigation-straight), 24, "outline")
      • +
    • HTML: data-icon="navigation-straight" or data-icon="navigation-straight" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left)) or @include icon(glyph(navigation-to-left), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-left" or data-icon="navigation-to-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right)) or @include icon(glyph(navigation-to-right), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-right" or data-icon="navigation-to-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn)) or @include icon(glyph(navigation-u-turn), 24, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" or data-icon="navigation-u-turn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign)) or @include icon(glyph(stop-sign), 24, "outline")
      • +
    • HTML: data-icon="stop-sign" or data-icon="stop-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking)) or @include icon(glyph(parking), 24, "outline")
      • +
    • HTML: data-icon="parking" or data-icon="parking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place)) or @include icon(glyph(place), 24, "outline")
      • +
    • HTML: data-icon="place" or data-icon="place" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position)) or @include icon(glyph(set-position), 24, "outline")
      • +
    • HTML: data-icon="set-position" or data-icon="set-position" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station)) or @include icon(glyph(station), 24, "outline")
      • +
    • HTML: data-icon="station" or data-icon="station" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station)) or @include icon(glyph(train-station), 24, "outline")
      • +
    • HTML: data-icon="train-station" or data-icon="train-station" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back)) or @include icon(glyph(arrow-back), 24, "outline")
      • +
    • HTML: data-icon="arrow-back" or data-icon="arrow-back" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down)) or @include icon(glyph(arrow-down), 24, "outline")
      • +
    • HTML: data-icon="arrow-down" or data-icon="arrow-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward)) or @include icon(glyph(arrow-forward), 24, "outline")
      • +
    • HTML: data-icon="arrow-forward" or data-icon="arrow-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up)) or @include icon(glyph(arrow-up), 24, "outline")
      • +
    • HTML: data-icon="arrow-up" or data-icon="arrow-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "outline")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left)) or @include icon(glyph(chevron-left), 24, "outline")
      • +
    • HTML: data-icon="chevron-left" or data-icon="chevron-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right)) or @include icon(glyph(chevron-right), 24, "outline")
      • +
    • HTML: data-icon="chevron-right" or data-icon="chevron-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close)) or @include icon(glyph(close), 24, "outline")
      • +
    • HTML: data-icon="close" or data-icon="close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less)) or @include icon(glyph(expand-less), 24, "outline")
      • +
    • HTML: data-icon="expand-less" or data-icon="expand-less" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more)) or @include icon(glyph(expand-more), 24, "outline")
      • +
    • HTML: data-icon="expand-more" or data-icon="expand-more" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen)) or @include icon(glyph(fullscreen), 24, "outline")
      • +
    • HTML: data-icon="fullscreen" or data-icon="fullscreen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit)) or @include icon(glyph(fullscreen-exit), 24, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" or data-icon="fullscreen-exit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view)) or @include icon(glyph(grid-view), 24, "outline")
      • +
    • HTML: data-icon="grid-view" or data-icon="grid-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link)) or @include icon(glyph(link), 24, "outline")
      • +
    • HTML: data-icon="link" or data-icon="link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external)) or @include icon(glyph(link-external), 24, "outline")
      • +
    • HTML: data-icon="link-external" or data-icon="link-external" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list)) or @include icon(glyph(list), 24, "outline")
      • +
    • HTML: data-icon="list" or data-icon="list" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu)) or @include icon(glyph(menu), 24, "outline")
      • +
    • HTML: data-icon="menu" or data-icon="menu" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal)) or @include icon(glyph(more-horizontal), 24, "outline")
      • +
    • HTML: data-icon="more-horizontal" or data-icon="more-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical)) or @include icon(glyph(more-vertical), 24, "outline")
      • +
    • HTML: data-icon="more-vertical" or data-icon="more-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh)) or @include icon(glyph(refresh), 24, "outline")
      • +
    • HTML: data-icon="refresh" or data-icon="refresh" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Notification + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "outline")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify)) or @include icon(glyph(notify), 24, "outline")
      • +
    • HTML: data-icon="notify" or data-icon="notify" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff)) or @include icon(glyph(notify-cutoff), 24, "outline")
      • +
    • HTML: data-icon="notify-cutoff" or data-icon="notify-cutoff" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "outline")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Seat + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle)) or @include icon(glyph(aisle), 24, "outline")
      • +
    • HTML: data-icon="aisle" or data-icon="aisle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available)) or @include icon(glyph(aisle-not-available), 24, "outline")
      • +
    • HTML: data-icon="aisle-not-available" or data-icon="aisle-not-available" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed)) or @include icon(glyph(bed), 24, "outline")
      • +
    • HTML: data-icon="bed" or data-icon="bed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment)) or @include icon(glyph(childrens-compartment), 24, "outline")
      • +
    • HTML: data-icon="childrens-compartment" or data-icon="childrens-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly)) or @include icon(glyph(elderly), 24, "outline")
      • +
    • HTML: data-icon="elderly" or data-icon="elderly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped)) or @include icon(glyph(handicapped), 24, "outline")
      • +
    • HTML: data-icon="handicapped" or data-icon="handicapped" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment)) or @include icon(glyph(parent-child-compartment), 24, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" or data-icon="parent-child-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority)) or @include icon(glyph(priority), 24, "outline")
      • +
    • HTML: data-icon="priority" or data-icon="priority" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone)) or @include icon(glyph(quiet-zone), 24, "outline")
      • +
    • HTML: data-icon="quiet-zone" or data-icon="quiet-zone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table)) or @include icon(glyph(table), 24, "outline")
      • +
    • HTML: data-icon="table" or data-icon="table" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window)) or @include icon(glyph(window), 24, "outline")
      • +
    • HTML: data-icon="window" or data-icon="window" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Ticket + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus)) or @include icon(glyph(bahnbonus), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus" or data-icon="bahnbonus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card)) or @include icon(glyph(bahnbonus-card), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" or data-icon="bahnbonus-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard)) or @include icon(glyph(bahncard), 24, "outline")
      • +
    • HTML: data-icon="bahncard" or data-icon="bahncard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price)) or @include icon(glyph(best-price), 24, "outline")
      • +
    • HTML: data-icon="best-price" or data-icon="best-price" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket)) or @include icon(glyph(commuter-ticket), 24, "outline")
      • +
    • HTML: data-icon="commuter-ticket" or data-icon="commuter-ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in)) or @include icon(glyph(komfort-check-in), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in" or data-icon="komfort-check-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check)) or @include icon(glyph(komfort-check-in-check), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" or data-icon="komfort-check-in-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle)) or @include icon(glyph(komfort-check-in-circle), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" or data-icon="komfort-check-in-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards)) or @include icon(glyph(multiple-cards), 24, "outline")
      • +
    • HTML: data-icon="multiple-cards" or data-icon="multiple-cards" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger)) or @include icon(glyph(multiple-passenger), 24, "outline")
      • +
    • HTML: data-icon="multiple-passenger" or data-icon="multiple-passenger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel)) or @include icon(glyph(my-travel), 24, "outline")
      • +
    • HTML: data-icon="my-travel" or data-icon="my-travel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey)) or @include icon(glyph(outward-journey), 24, "outline")
      • +
    • HTML: data-icon="outward-journey" or data-icon="outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code)) or @include icon(glyph(qr-code), 24, "outline")
      • +
    • HTML: data-icon="qr-code" or data-icon="qr-code" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan)) or @include icon(glyph(qr-code-scan), 24, "outline")
      • +
    • HTML: data-icon="qr-code-scan" or data-icon="qr-code-scan" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey)) or @include icon(glyph(return-journey), 24, "outline")
      • +
    • HTML: data-icon="return-journey" or data-icon="return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket)) or @include icon(glyph(ticket), 24, "outline")
      • +
    • HTML: data-icon="ticket" or data-icon="ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount)) or @include icon(glyph(ticket-discount), 24, "outline")
      • +
    • HTML: data-icon="ticket-discount" or data-icon="ticket-discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple)) or @include icon(glyph(ticket-multiple), 24, "outline")
      • +
    • HTML: data-icon="ticket-multiple" or data-icon="ticket-multiple" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription)) or @include icon(glyph(ticket-subscription), 24, "outline")
      • +
    • HTML: data-icon="ticket-subscription" or data-icon="ticket-subscription" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey)) or @include icon(glyph(time-outward-journey), 24, "outline")
      • +
    • HTML: data-icon="time-outward-journey" or data-icon="time-outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey)) or @include icon(glyph(time-return-journey), 24, "outline")
      • +
    • HTML: data-icon="time-return-journey" or data-icon="time-return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable)) or @include icon(glyph(timetable), 24, "outline")
      • +
    • HTML: data-icon="timetable" or data-icon="timetable" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance)) or @include icon(glyph(travel-insurance), 24, "outline")
      • +
    • HTML: data-icon="travel-insurance" or data-icon="travel-insurance" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Transportation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "outline")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "outline")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "outline")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "outline")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "outline")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence)) or @include icon(glyph(car-sequence), 24, "outline")
      • +
    • HTML: data-icon="car-sequence" or data-icon="car-sequence" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "outline")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "outline")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "outline")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "outline")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "outline")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "outline")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "outline")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view)) or @include icon(glyph(ice-side-view), 24, "outline")
      • +
    • HTML: data-icon="ice-side-view" or data-icon="ice-side-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "outline")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "outline")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "outline")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly)) or @include icon(glyph(rail-and-fly), 24, "outline")
      • +
    • HTML: data-icon="rail-and-fly" or data-icon="rail-and-fly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car)) or @include icon(glyph(railroad-car), 24, "outline")
      • +
    • HTML: data-icon="railroad-car" or data-icon="railroad-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "outline")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "outline")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev)) or @include icon(glyph(sev), 24, "outline")
      • +
    • HTML: data-icon="sev" or data-icon="sev" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "outline")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter)) or @include icon(glyph(sprinter), 24, "outline")
      • +
    • HTML: data-icon="sprinter" or data-icon="sprinter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "outline")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "outline")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "outline")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "outline")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "outline")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "outline")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 32, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 32, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 32, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 32, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 32, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 32, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 32, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 32, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 32, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 32, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 32, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 32, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 32, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 32, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 32, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 32, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 32, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 32, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 32, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 32, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 32, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 32, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 32, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 32, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 32, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 32, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 32, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 32, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 32, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 32, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 32, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 32, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 32, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 32, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 32, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 32, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 32, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 32, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 32, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 32, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 32, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 32, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 32, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 32, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 32, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 32, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 32, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 32, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 32, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 32, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 32, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 32, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 32, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 32, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 32, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 32, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 32, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 32, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 32, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 32, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 32, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 32, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 32, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 32, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 32, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 32, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 32, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 32, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 32, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 32, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 32, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 32, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 32, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 32, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 32, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 32, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 32, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 32, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 32, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 32, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 32, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 32, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 32, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 32, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Communication + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 32, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 32, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 32, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 32, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 32, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 32, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 32, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 32, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 32, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 32, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 32, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 32, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 32, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Covid 19 + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 32, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Facilities + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 32, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 32, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 32, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 32, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 32, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 32, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 32, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 32, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 32, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 32, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Feature + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 32, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 32, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 32, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 32, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 32, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 32, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 32, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 32, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 32, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 32, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 32, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 32, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 32, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 32, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 32, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 32, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 32, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 32, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 32, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 32, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 32, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 32, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Food + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 32, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 32, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 32, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 32, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 32, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Journey + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 32, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 32, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 32, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 32, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 32, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 32, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 32, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 32, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 32, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 32, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 32, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 32, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 32, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 32, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 32, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 32, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 32, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 32, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 32, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 32, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 32, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 32, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 32, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 32, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 32, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 32, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 32, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 32, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 32, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 32, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 32, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 32, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 32, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 32, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 32, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 32, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 32, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 32, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 32, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 32, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 32, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Seat + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 32, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 32, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 32, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 32, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 32, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 32, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 32, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 32, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 32, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 32, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 32, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Ticket + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 32, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 32, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 32, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 32, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 32, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 32, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 32, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 32, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 32, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 32, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 32, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 32, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 32, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 32, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 32, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 32, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 32, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 32, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 32, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 32, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 32, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 32, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 32, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 32, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 48x48 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 48x48 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 48, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 48x48 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 48, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="48-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 64x64 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 64x64 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 64, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 64x64 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 64, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="64-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Illustration Icons + + + + +

+ + + +
+ +
+
+ +
+ +
Action
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Communication
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Covid 19
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Devices
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Entertainment
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Feature
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Food /db_ic_il_ Drink
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Maps
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
News
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Station
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Ticket
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Transportation
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Travel
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Weather
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.hbs b/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.hbs new file mode 100644 index 0000000000..bc3373b282 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.hbs @@ -0,0 +1,10 @@ +
+ + {{#each headlines }} + {{> elements-headline }} + {{/each }} +

Primary font: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font italic: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font bold: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+ +
diff --git a/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.markup-only.html b/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.markup-only.html new file mode 100644 index 0000000000..0c15976350 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.markup-only.html @@ -0,0 +1,15 @@ +
+ + +

Headline 1

+ +

Headline 2

+ +

Headline 3

+ +

Headline 4

+

Primary font: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font italic: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font bold: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+ +
diff --git a/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.rendered.html b/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.rendered.html new file mode 100644 index 0000000000..a032a05480 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-fonts/base-type-fonts.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +

Headline 1

+ +

Headline 2

+ +

Headline 3

+ +

Headline 4

+

Primary font: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font italic: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font bold: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.hbs b/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.hbs new file mode 100644 index 0000000000..1c42356a50 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.hbs @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.markup-only.html b/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.markup-only.html new file mode 100644 index 0000000000..96d104016a --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.markup-only.html @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.rendered.html b/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.rendered.html new file mode 100644 index 0000000000..758a65bacd --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.rendered.html @@ -0,0 +1,121 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.hbs b/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.hbs new file mode 100644 index 0000000000..1c42356a50 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.hbs @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.markup-only.html b/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.markup-only.html new file mode 100644 index 0000000000..0793ef636e --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.markup-only.html @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.rendered.html b/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.rendered.html new file mode 100644 index 0000000000..c9f4fa4af5 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.rendered.html @@ -0,0 +1,121 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.hbs b/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.hbs new file mode 100644 index 0000000000..1c42356a50 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.hbs @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.markup-only.html b/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.markup-only.html new file mode 100644 index 0000000000..4aa7f3b7ad --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.markup-only.html @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.rendered.html b/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.rendered.html new file mode 100644 index 0000000000..735f161d47 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.rendered.html @@ -0,0 +1,121 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.hbs b/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.hbs new file mode 100644 index 0000000000..1c42356a50 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.hbs @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.markup-only.html b/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.markup-only.html new file mode 100644 index 0000000000..a11e48d870 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.markup-only.html @@ -0,0 +1,4 @@ +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
diff --git a/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.rendered.html b/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.rendered.html new file mode 100644 index 0000000000..586a3ff345 --- /dev/null +++ b/version/v2.18.3/patterns/base-type-highlight-colors-positive/base-type-highlight-colors-positive.rendered.html @@ -0,0 +1,121 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base-type/index.html b/version/v2.18.3/patterns/base-type/index.html new file mode 100644 index 0000000000..829c8f7633 --- /dev/null +++ b/version/v2.18.3/patterns/base-type/index.html @@ -0,0 +1,389 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Type +

+ +
+

We're delivering general font declarations and the web fonts for our generally used DB Screen Sans font.

+

In case that you need to use font sizes smaller than 16pt please switch to our font-family DB Screen Sans Digital Regular for better readability / accessibility.

+

Please find this rule and a lot of further information regarding and more information on typography: https://marketingportal.extranet.deutschebahn.com/marketingportal/Marke-und-Design/Basiselemente/Typografie/Fuer-digitale-Anwendungen

+ +
+ +
+
+ +
+ +

+ + + Fonts + + + + + +

+ + + +
+ +
+
+ +
+
+ + +

Headline 1

+ +

Headline 2

+ +

Headline 3

+ +

Headline 4

+

Primary font: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font italic: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font bold: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+ +
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors 1st Priority + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors 2nd Priority + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors Neutral + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors Positive + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/base/index.html b/version/v2.18.3/patterns/base/index.html new file mode 100644 index 0000000000..442b658b55 --- /dev/null +++ b/version/v2.18.3/patterns/base/index.html @@ -0,0 +1,15624 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Colors +

+ +
+

Source

+

We're using the colors provided by our other product DB UI Base, by which Design tokens are being provided.

+

Accessibility

+

Please have a look at the related page within the Marketingportal for more information as well: https://marketingportal.extranet.deutschebahn.com/marketingportal/Basiselemente/Farbe

+

Criteria

+

WCAG 2.1 (Level AA)

+

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

+

Large Text

+

Large-scale text and images of large-scale text have a contrast ratio of at least 3:1

+

DB color palette for InDesign, Illustrator and Photoshop

+

A file containing the Deutsche Bahn color palette for Adobe InDesign, Adobe Illustrator or Adobe Photoshop is provided by the DB Marketingportal.

+

Inspirational external sources for this pattern

+ + +
+ +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Primary + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + DB Red + + + + $db-color-red
    + #ec0016 +     +
    • +
  • + DB White + + + + $db-color-white
    + #FFFFFF +     +
    • +
  • + DB Black + + + + $db-color-black
    + #000000 +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Secondary + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + DB Yellow 100 + + + + $db-color-yellow-100
    + #FFFFDC +     +
    • +
  • + DB Yellow 200 + + + + $db-color-yellow-200
    + #FFFFAF +     +
    • +
  • + DB Yellow 300 + + + + $db-color-yellow-300
    + #FFF876 +     +
    • +
  • + DB Yellow 400 + + + + $db-color-yellow-400
    + #FFF000 +     +
    • +
  • + DB Yellow 500 + + + + $db-color-yellow-500
    + #FFD800 +     +
    • +
  • + DB Yellow 600 + + + + $db-color-yellow-600
    + #FFBB00 +     +
    • +
  • + DB Yellow 700 + + + + $db-color-yellow-700
    + #FF9B00 +     +
    • +
  • + DB Yellow 800 + + + + $db-color-yellow-800
    + #FF7A00 +     +
    • +
  • + DB Orange 100 + + + + $db-color-orange-100
    + #FFF4D8 +     +
    • +
  • + DB Orange 200 + + + + $db-color-orange-200
    + #FCE3B4 +     +
    • +
  • + DB Orange 300 + + + + $db-color-orange-300
    + #FACA7F +     +
    • +
  • + DB Orange 400 + + + + $db-color-orange-400
    + #F8AB37 +     +
    • +
  • + DB Orange 500 + + + + $db-color-orange-500
    + #F39200 +     +
    • +
  • + DB Orange 600 + + + + $db-color-orange-600
    + #D77B00 +     +
    • +
  • + DB Orange 700 + + + + $db-color-orange-700
    + #C05E00 +     +
    • +
  • + DB Orange 800 + + + + $db-color-orange-800
    + #A24800 +     +
    • +
  • + DB Red 100 + + + + $db-color-red-100
    + #fEE6E6 +     +
    • +
  • + DB Red 200 + + + + $db-color-red-200
    + #FCC8C3 +     +
    • +
  • + DB Red 300 + + + + $db-color-red-300
    + #FA9090 +     +
    • +
  • + DB Red 400 + + + + $db-color-red-400
    + #F75056 +     +
    • +
  • + DB Red 500 + + + + $db-color-red-500
    + #EC0016 +     +
    • +
  • + DB Red 600 + + + + $db-color-red-600
    + #C50014 +     +
    • +
  • + DB Red 700 + + + + $db-color-red-700
    + #9B000E +     +
    • +
  • + DB Red 800 + + + + $db-color-red-800
    + #740009 +     +
    • +
  • + DB Burgundy 100 + + + + $db-color-burgundy-100
    + #F4E8ED +     +
    • +
  • + DB Burgundy 200 + + + + $db-color-burgundy-200
    + #EDCBD6 +     +
    • +
  • + DB Burgundy 300 + + + + $db-color-burgundy-300
    + #DA9AA8 +     +
    • +
  • + DB Burgundy 400 + + + + $db-color-burgundy-400
    + #C0687B +     +
    • +
  • + DB Burgundy 500 + + + + $db-color-burgundy-500
    + #A9455D +     +
    • +
  • + DB Burgundy 600 + + + + $db-color-burgundy-600
    + #8C2E46 +     +
    • +
  • + DB Burgundy 700 + + + + $db-color-burgundy-700
    + #641E32 +     +
    • +
  • + DB Burgundy 800 + + + + $db-color-burgundy-800
    + #4D0820 +     +
    • +
  • + DB Pink 100 + + + + $db-color-pink-100
    + #FDEEF8 +     +
    • +
  • + DB Pink 200 + + + + $db-color-pink-200
    + #F9D2E5 +     +
    • +
  • + DB Pink 300 + + + + $db-color-pink-300
    + #F4AECE +     +
    • +
  • + DB Pink 400 + + + + $db-color-pink-400
    + #EE7BAE +     +
    • +
  • + DB Pink 500 + + + + $db-color-pink-500
    + #E93E8F +     +
    • +
  • + DB Pink 600 + + + + $db-color-pink-600
    + #DB0078 +     +
    • +
  • + DB Pink 700 + + + + $db-color-pink-700
    + #B80065 +     +
    • +
  • + DB Pink 800 + + + + $db-color-pink-800
    + #970052 +     +
    • +
  • + DB Violett 100 + + + + $db-color-violett-100
    + #F4EEFA +     +
    • +
  • + DB Violett 200 + + + + $db-color-violett-200
    + #E0CDE4 +     +
    • +
  • + DB Violett 300 + + + + $db-color-violett-300
    + #C2A1C7 +     +
    • +
  • + DB Violett 400 + + + + $db-color-violett-400
    + #9A6CA6 +     +
    • +
  • + DB Violett 500 + + + + $db-color-violett-500
    + #814997 +     +
    • +
  • + DB Violett 600 + + + + $db-color-violett-600
    + #6E368C +     +
    • +
  • + DB Violett 700 + + + + $db-color-violett-700
    + #581D70 +     +
    • +
  • + DB Violett 800 + + + + $db-color-violett-800
    + #421857 +     +
    • +
  • + DB Blue 100 + + + + $db-color-blue-100
    + #E0EFFB +     +
    • +
  • + DB Blue 200 + + + + $db-color-blue-200
    + #B4D5F6 +     +
    • +
  • + DB Blue 300 + + + + $db-color-blue-300
    + #73AEF4 +     +
    • +
  • + DB Blue 400 + + + + $db-color-blue-400
    + #347DE0 +     +
    • +
  • + DB Blue 500 + + + + $db-color-blue-500
    + #1455C0 +     +
    • +
  • + DB Blue 600 + + + + $db-color-blue-600
    + #0C3992 +     +
    • +
  • + DB Blue 700 + + + + $db-color-blue-700
    + #0A1E6E +     +
    • +
  • + DB Blue 800 + + + + $db-color-blue-800
    + #061350 +     +
    • +
  • + DB Cyan 100 + + + + $db-color-cyan-100
    + #E5FAFF +     +
    • +
  • + DB Cyan 200 + + + + $db-color-cyan-200
    + #BBE6F8 +     +
    • +
  • + DB Cyan 300 + + + + $db-color-cyan-300
    + #84CFEF +     +
    • +
  • + DB Cyan 400 + + + + $db-color-cyan-400
    + #55B9E6 +     +
    • +
  • + DB Cyan 500 + + + + $db-color-cyan-500
    + #309FD1 +     +
    • +
  • + DB Cyan 600 + + + + $db-color-cyan-600
    + #0087B9 +     +
    • +
  • + DB Cyan 700 + + + + $db-color-cyan-700
    + #006A96 +     +
    • +
  • + DB Cyan 800 + + + + $db-color-cyan-800
    + #004B6D +     +
    • +
  • + DB Turquoise 100 + + + + $db-color-turquoise-100
    + #E3F5F4 +     +
    • +
  • + DB Turquoise 200 + + + + $db-color-turquoise-200
    + #BEE2E5 +     +
    • +
  • + DB Turquoise 300 + + + + $db-color-turquoise-300
    + #83CACA +     +
    • +
  • + DB Turquoise 400 + + + + $db-color-turquoise-400
    + #3CB5AE +     +
    • +
  • + DB Turquoise 500 + + + + $db-color-turquoise-500
    + #00A099 +     +
    • +
  • + DB Turquoise 600 + + + + $db-color-turquoise-600
    + #008984 +     +
    • +
  • + DB Turquoise 700 + + + + $db-color-turquoise-700
    + #006E6B +     +
    • +
  • + DB Turquoise 800 + + + + $db-color-turquoise-800
    + #005752 +     +
    • +
  • + DB Green 100 + + + + $db-color-green-100
    + #E2f3E5 +     +
    • +
  • + DB Green 200 + + + + $db-color-green-200
    + #BDDBB9 +     +
    • +
  • + DB Green 300 + + + + $db-color-green-300
    + #8CBC80 +     +
    • +
  • + DB Green 400 + + + + $db-color-green-400
    + #66A558 +     +
    • +
  • + DB Green 500 + + + + $db-color-green-500
    + #408335 +     +
    • +
  • + DB Green 600 + + + + $db-color-green-600
    + #2A7230 +     +
    • +
  • + DB Green 700 + + + + $db-color-green-700
    + #165C27 +     +
    • +
  • + DB Green 800 + + + + $db-color-green-800
    + #154A26 +     +
    • +
  • + DB Light Green 100 + + + + $db-color-light-green-100
    + #EBF7DD +     +
    • +
  • + DB Light Green 200 + + + + $db-color-light-green-200
    + #C9EB9E +     +
    • +
  • + DB Light Green 300 + + + + $db-color-light-green-300
    + #9FD45F +     +
    • +
  • + DB Light Green 400 + + + + $db-color-light-green-400
    + #78BE14 +     +
    • +
  • + DB Light Green 500 + + + + $db-color-light-green-500
    + #63A615 +     +
    • +
  • + DB Light Green 600 + + + + $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Light Green 700 + + + + $db-color-light-green-700
    + #44741A +     +
    • +
  • + DB Light Green 800 + + + + $db-color-light-green-800
    + #375F15 +     +
    • +
  • + DB Warm Gray 100 + + + + $db-color-warm-gray-100
    + #F5F4F1 +     +
    • +
  • + DB Warm Gray 200 + + + + $db-color-warm-gray-200
    + #DDDED6 +     +
    • +
  • + DB Warm Gray 300 + + + + $db-color-warm-gray-300
    + #BCBBB2 +     +
    • +
  • + DB Warm Gray 400 + + + + $db-color-warm-gray-400
    + #9C9A8E +     +
    • +
  • + DB Warm Gray 500 + + + + $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + DB Warm Gray 600 + + + + $db-color-warm-gray-600
    + #747067 +     +
    • +
  • + DB Warm Gray 700 + + + + $db-color-warm-gray-700
    + #4F4B41 +     +
    • +
  • + DB Warm Gray 800 + + + + $db-color-warm-gray-800
    + #38342F +     +
    • +
  • + DB Cool Gray 100 + + + + $db-color-cool-gray-100
    + #F0F3F5 +     +
    • +
  • + DB Cool Gray 200 + + + + $db-color-cool-gray-200
    + #D7DCE1 +     +
    • +
  • + DB Cool Gray 300 + + + + $db-color-cool-gray-300
    + #AFB4BB +     +
    • +
  • + DB Cool Gray 400 + + + + $db-color-cool-gray-400
    + #878C96 +     +
    • +
  • + DB Cool Gray 500 + + + + $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + DB Cool Gray 600 + + + + $db-color-cool-gray-600
    + #3C414B +     +
    • +
  • + DB Cool Gray 700 + + + + $db-color-cool-gray-700
    + #282D37 +     +
    • +
  • + DB Cool Gray 800 + + + + $db-color-cool-gray-800
    + #131821 +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Feedback + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + DB Success + + + + $db-color-success: $db-color-light-green-600
    + #508B1B +     +
    • +
  • + DB Error + + + + $db-color-error: $db-color-red-500
    + #EC0016 +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - POI + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + food & drink + + + + $db-color-food-drink: $db-color-orange-500
    + #f39200 +     +
    • +
  • + health + + + + $db-color-health: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + things to know + + + + $db-color-things-to-know: $db-color-warm-gray-500
    + #858379 +     +
    • +
  • + community facilities + + + + $db-color-community-facilities: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + DB services & facilities + + + + $db-color-db-services-facilities: $db-color-blue-600
    + #0c3992 +     +
    • +
  • + shopping + + + + $db-color-shopping: $db-color-violett-500
    + #814997 +     +
    • +
  • + arts & culture + + + + $db-color-arts-culture: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + leisure + + + + $db-color-leisure: $db-color-green-500
    + #408335 +     +
    • +
  • + services + + + + $db-color-services: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + guidance + + + + $db-color-guidance: $db-color-cool-gray-600
    + #3c414b +     +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Marketingportal Brand Colors - Transport + + + + + +

+ + + +
+ +
+
+ +
+
    +
  • + ICE + + + + $db-color-ice: $db-color-cool-gray-700
    + #282d37 +     +
    • +
  • + IC + + + + $db-color-ic: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + EC + + + + $db-color-ec: $db-color-cool-gray-500
    + #646973 +     +
    • +
  • + RE + + + + $db-color-re: $db-color-cool-gray-400
    + #878c96 +     +
    • +
  • + RB + + + + $db-color-rb: $db-color-cool-gray-300
    + #afb4bb +     +
    • +
  • + S-Bahn + + + + $db-color-s-bahn: $db-color-green-500
    + #408335 +     +
    • +
  • + U-Bahn + + + + $db-color-u-bahn: $db-color-blue-500
    + #1455c0 +     +
    • +
  • + Tram + + + + $db-color-tram: $db-color-burgundy-500
    + #a9455d +     +
    • +
  • + Intercity Bus + + + + $db-color-intercity-bus: $db-color-pink-500
    + #e93e8f +     +
    • +
  • + Bus + + + + $db-color-bus: $db-color-violett-500
    + #814997 +     +
    • +
  • + ship + + + + $db-color-ship: $db-color-cyan-500
    + #309fd1 +     +
    • +
  • + plane + + + + $db-color-plane: $db-color-turquoise-500
    + #00a099 +     +
    • +
  • + taxi + + + + $db-color-taxi: $db-color-yellow-500
    + #ffd800 +     +
    • +
  • + carsharing + + + + $db-color-carsharing: $db-color-orange-500
    + #f39200 +     +
    • +
  • + bikesharing + + + + $db-color-bikesharing: $db-color-light-green-500
    + #63a615 +     +
    • +
  • + walking + + + + $db-color-walking: $db-color-cool-gray-200
    + #d7dce1 +     +
    • +
+ +
+ + + +
+
+ +

+ Icons +

+ +
+

New iconset

+

The included iconset has been developed in cooperation with the Center of Excellence @ Personenverkehr and replaces the previous enterprise only icons. More information: https://marketingportal.extranet.deutschebahn.com/marketingportal/Basiselemente/Icons/Funktionale-Icons-Architektur-und-Fahrzeuge

+

Usage

+

You could use the icons either within your SCSS code as described below, which is the recommended approach. +Alternatively you could also use the attribute based configuration.

+

And we're additionally providing the icons as the sources (SVG) files as well.

+

Icon font

+

Different glyphs

+

All of the available glyphs variables are shown on this page right next to the icon, with the SCSS and attribute based variables/values shown next to them.

+

SCSS (recommended)

+
Icon for element
+

Use the following SCSS mixin for setting an icon:

+
// schema
+@mixin icon(
+  $glyph: "",
+  $size: $icon-size,
+  $style: $icon-style,
+  $position: "before"
+);
+
+// example
+span.with-an-icon {
+  @include icon(glyph(account), 20, "outline");
+}
+
+

As both $icon-size and $icon-style are available to get configured with default values, and $position is only a variant (explained in the next paragraph) only the first one is really mandatory.

+
Displaying the icon after text
+

If you'd like to include the icon after the text, set the last parameter to after.

+
Hiding the text next to an icon
+

In case of the need to display only the icon and hide the text next to it, use the following mixin:

+
@include is-icon-text-replace();
+
+

Attribute based configuration

+
Icon for element
+

Use the data-icon and data-icon-variant HTML attributes for setting an icon:

+
<a href="#" data-icon="alarm" data-icon-variant="24-outline">Alarm</a>
+
+

The data-icon-variant is an optional attribute, that you don't need to declare in case that you'd like to use the default icon size and style, that are defined by the $icon-size and $icon-style SCSS variables (size: 24 and style: outline as defaults), that could obviously get overwritten by individual SCSS declarations; so you'll end up with a very simply definition when relying on the defaults:

+
<a href="#" data-icon="alarm">Alarm</a>
+
+

Of course this icons definition does as well have an equivalent for icons after the content: data-icon-variant-after

+
Displaying the icon after text
+

If you'd like to include the icon after the content/text, use the HTML attribute data-icon-after instead of data-icon, example:

+
<a
+  href="#"
+  data-icon-after="alarm"
+  data-icon-variant-after="24-outline"
+  class="elm-link"
+  >Alarm</a
+>
+
+
Hiding the text next to an icon
+

In case of the need to display only the icon and hide the text next to it, use the following class:

+
.is-icon-text-replace
+
+
Tweaking icons font-size
+

If you'd like to control the icons font-size any further (defining sizes in between all of the data-icon-variant declarations, like e.g. having an icon font-size of 23px instead of 24px when defining data-icon-variant="24-outline"), you could set set one of the CSS variables --icon-font-size-before or --icon-font-size-after (in this case --icon-font-size-before: 23px).

+
<a
+  href="#"
+  data-icon="alarm"
+  data-icon-variant="24-outline"
+  style="--icon-font-size-before: 23px"
+  >Alarm</a
+>
+
+

Further tweaking

+

SVG files

+

As mentioned above we're even also providing all of the icon sources (svg files) within this package in the folder node_modules/@db-ui/core/dist/icons/.

+

And we're enabling to change the colors for the illustrative icons ("pulse" and icon itself) as well as the functional icons (only the single-color icon), through the two following CSS variables / CSS custom properties, with their included default (second value):

+
var(--db-icon-color, currentColor)
+var(--db-icon-pulse-color, #EC0016)
+
+

Accessibility

+

Regarding accessibility icons are providing cognitive complementary visual support for sighted people (e.g. people with reading difficulties), as well as quick recognition of specific functionality and UX patterns like e.g. the bin/waste paper basket symbol for a delete action.

+

On the other hand icons shouldn't get recognized and output by assistive technologies like screenreaders, as those glyphs or signs being used in case of an icon webfont don't necessarly provide a meaning - and on the other hand each icon being used on the page should always as well get included in conjunction with some textual description both as a fallback as well as providing some meaning even and especially if the icon itself doesn't provide a unique meaning on it's own (to all users idependently from their skill level/experience, culture, etc.).

+

Additionally this pattern has been tested and approved regarding accessibility.

+

Inspirational external sources for this pattern

+ + +
+ +
+
+ +
+ +

+ + + Icon Library + + + + +

+ + + +
+ +
+
+ +
+ +
    +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 16, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 16, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 16, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="16-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 16, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="16-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 16, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="16-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 16, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="16-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(add), 16, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 16, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 16, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="16-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 16x16 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 16, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 16, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 16, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 16, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 16, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 16, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 16, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 16, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="16-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 16, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="16-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "filled")
      • +
    • HTML: data-icon="account" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "filled")
      • +
    • HTML: data-icon="block" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "filled")
      • +
    • HTML: data-icon="build" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "filled")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "filled")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "filled")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "filled")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "filled")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "filled")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "filled")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "filled")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "filled")
      • +
    • HTML: data-icon="image" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "filled")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "filled")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "filled")
      • +
    • HTML: data-icon="print" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "filled")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "filled")
      • +
    • HTML: data-icon="save" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "filled")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "filled")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "filled")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "filled")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "filled")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "filled")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Communication + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "filled")
      • +
    • HTML: data-icon="call" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "filled")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "filled")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "filled")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "filled")
      • +
    • HTML: data-icon="question" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "filled")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "filled")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Feature + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "filled")
      • +
    • HTML: data-icon="day" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "filled")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "filled")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "filled")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "filled")
      • +
    • HTML: data-icon="night" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "filled")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "filled")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Food + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "filled")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "filled")
      • +
    • HTML: data-icon="database" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Journey + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "filled")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "filled")
      • +
    • HTML: data-icon="home" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "filled")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "filled")
      • +
    • HTML: data-icon="place" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "filled")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "filled")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Ticket + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "filled")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "filled")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "filled")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Filled - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 20, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 20, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 20, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 20, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 20, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 20, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 20, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 20, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 20, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 20, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 20, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 20, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 20, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 20, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 20, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 20, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 20, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 20, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 20, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 20, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 20, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 20, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 20, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 20, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 20, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 20, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 20, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 20, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 20, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 20, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 20, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 20, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 20, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 20, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 20, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 20, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 20, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 20, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 20, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 20, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 20, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 20, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 20, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 20, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 20, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 20, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 20, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 20, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 20, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 20, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 20, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 20, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 20, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 20, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 20, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 20, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 20, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 20, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 20, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 20, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 20, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 20, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 20, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 20, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 20, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 20, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 20, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 20, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 20, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 20, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 20, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 20, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 20, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 20, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 20, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 20, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 20, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 20, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 20, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 20, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 20, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 20, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 20, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 20, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 20, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 20, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 20, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 20, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 20, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 20, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 20, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 20, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 20, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 20, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 20, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 20, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 20, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 20, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 20, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 20, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 20, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 20, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 20, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 20, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 20, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Communication + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 20, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 20, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 20, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 20, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 20, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 20, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 20, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 20, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 20, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 20, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 20, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 20, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 20, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Covid 19 + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 20, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Facilities + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 20, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 20, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 20, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 20, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 20, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 20, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 20, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 20, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 20, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 20, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Feature + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 20, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 20, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 20, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 20, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 20, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 20, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 20, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 20, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 20, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 20, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 20, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 20, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 20, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 20, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 20, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 20, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 20, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 20, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 20, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 20, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 20, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 20, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Food + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 20, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 20, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 20, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 20, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 20, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Journey + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 20, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 20, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 20, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 20, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 20, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 20, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 20, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 20, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 20, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 20, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 20, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 20, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 20, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 20, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 20, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 20, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 20, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 20, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 20, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 20, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 20, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 20, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 20, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 20, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 20, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 20, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 20, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 20, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 20, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 20, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 20, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 20, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 20, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 20, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 20, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 20, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 20, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 20, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 20, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 20, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 20, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 20, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 20, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 20, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 20, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 20, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 20, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 20, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Seat + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 20, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 20, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 20, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 20, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 20, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 20, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 20, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 20, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 20, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 20, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 20, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Ticket + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 20, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 20, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 20, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 20, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 20, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 20, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 20, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 20, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 20, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 20, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 20, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 20, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 20, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 20, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 20, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 20, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 20, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 20, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 20, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 20, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 20x20 - Outline - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 20, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 20, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 20, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 20, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 20, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 20, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 20, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 20, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 20, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-bus), 20, "outline")
      • +
    • HTML: data-icon="ev-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 20, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-train), 20, "outline")
      • +
    • HTML: data-icon="ev-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 20, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 20, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 20, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 20, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 20, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 20, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 20, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 20, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 20, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 20, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 20, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 20, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 20, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 20, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 20, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 20, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 20, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 20, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 20, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 20, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="20-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 20, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="20-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "filled")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "filled")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "filled")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "filled")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "filled")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "filled")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "filled")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "filled")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "filled")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "filled")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "filled")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "filled")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "filled")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "filled")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "filled")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "filled")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "filled")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "filled")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "filled")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Journey + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "filled")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "filled")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Maps + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "filled")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "filled")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "filled")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "filled")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "filled")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Filled - Transportation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "filled")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "filled")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "filled")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "filled")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "filled")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "filled")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "filled")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "filled")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "filled")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "filled")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "filled")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "filled")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "filled")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "filled")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "filled")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "filled")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "filled")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "filled")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "filled")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "filled")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "filled")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "filled")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "filled")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "filled")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(account)) or @include icon(glyph(account), 24, "outline")
      • +
    • HTML: data-icon="account" or data-icon="account" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add)) or @include icon(glyph(add), 24, "outline")
      • +
    • HTML: data-icon="add" or data-icon="add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "outline")
      • +
    • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link)) or @include icon(glyph(add-link), 24, "outline")
      • +
    • HTML: data-icon="add-link" or data-icon="add-link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm)) or @include icon(glyph(alarm), 24, "outline")
      • +
    • HTML: data-icon="alarm" or data-icon="alarm" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add)) or @include icon(glyph(alarm-add), 24, "outline")
      • +
    • HTML: data-icon="alarm-add" or data-icon="alarm-add" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "outline")
      • +
    • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off)) or @include icon(glyph(alert-off), 24, "outline")
      • +
    • HTML: data-icon="alert-off" or data-icon="alert-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment)) or @include icon(glyph(attachment), 24, "outline")
      • +
    • HTML: data-icon="attachment" or data-icon="attachment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality)) or @include icon(glyph(augmented-reality), 24, "outline")
      • +
    • HTML: data-icon="augmented-reality" or data-icon="augmented-reality" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block)) or @include icon(glyph(block), 24, "outline")
      • +
    • HTML: data-icon="block" or data-icon="block" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "outline")
      • +
    • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug)) or @include icon(glyph(bug), 24, "outline")
      • +
    • HTML: data-icon="bug" or data-icon="bug" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build)) or @include icon(glyph(build), 24, "outline")
      • +
    • HTML: data-icon="build" or data-icon="build" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar)) or @include icon(glyph(calendar), 24, "outline")
      • +
    • HTML: data-icon="calendar" or data-icon="calendar" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "outline")
      • +
    • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash)) or @include icon(glyph(cash), 24, "outline")
      • +
    • HTML: data-icon="cash" or data-icon="cash" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "outline")
      • +
    • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "outline")
      • +
    • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download)) or @include icon(glyph(cloud-download), 24, "outline")
      • +
    • HTML: data-icon="cloud-download" or data-icon="cloud-download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload)) or @include icon(glyph(cloud-upload), 24, "outline")
      • +
    • HTML: data-icon="cloud-upload" or data-icon="cloud-upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass)) or @include icon(glyph(compass), 24, "outline")
      • +
    • HTML: data-icon="compass" or data-icon="compass" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy)) or @include icon(glyph(copy), 24, "outline")
      • +
    • HTML: data-icon="copy" or data-icon="copy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card)) or @include icon(glyph(credit-card), 24, "outline")
      • +
    • HTML: data-icon="credit-card" or data-icon="credit-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard)) or @include icon(glyph(dashboard), 24, "outline")
      • +
    • HTML: data-icon="dashboard" or data-icon="dashboard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete)) or @include icon(glyph(delete), 24, "outline")
      • +
    • HTML: data-icon="delete" or data-icon="delete" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount)) or @include icon(glyph(discount), 24, "outline")
      • +
    • HTML: data-icon="discount" or data-icon="discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document)) or @include icon(glyph(document), 24, "outline")
      • +
    • HTML: data-icon="document" or data-icon="document" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check)) or @include icon(glyph(document-check), 24, "outline")
      • +
    • HTML: data-icon="document-check" or data-icon="document-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done)) or @include icon(glyph(done), 24, "outline")
      • +
    • HTML: data-icon="done" or data-icon="done" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download)) or @include icon(glyph(download), 24, "outline")
      • +
    • HTML: data-icon="download" or data-icon="download" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop)) or @include icon(glyph(drag-and-drop), 24, "outline")
      • +
    • HTML: data-icon="drag-and-drop" or data-icon="drag-and-drop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit)) or @include icon(glyph(edit), 24, "outline")
      • +
    • HTML: data-icon="edit" or data-icon="edit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted)) or @include icon(glyph(face-delighted), 24, "outline")
      • +
    • HTML: data-icon="face-delighted" or data-icon="face-delighted" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed)) or @include icon(glyph(face-disappointed), 24, "outline")
      • +
    • HTML: data-icon="face-disappointed" or data-icon="face-disappointed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral)) or @include icon(glyph(face-neutral), 24, "outline")
      • +
    • HTML: data-icon="face-neutral" or data-icon="face-neutral" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad)) or @include icon(glyph(face-sad), 24, "outline")
      • +
    • HTML: data-icon="face-sad" or data-icon="face-sad" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling)) or @include icon(glyph(face-smiling), 24, "outline")
      • +
    • HTML: data-icon="face-smiling" or data-icon="face-smiling" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter)) or @include icon(glyph(filter), 24, "outline")
      • +
    • HTML: data-icon="filter" or data-icon="filter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint)) or @include icon(glyph(fingerprint), 24, "outline")
      • +
    • HTML: data-icon="fingerprint" or data-icon="fingerprint" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder)) or @include icon(glyph(folder), 24, "outline")
      • +
    • HTML: data-icon="folder" or data-icon="folder" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open)) or @include icon(glyph(folder-open), 24, "outline")
      • +
    • HTML: data-icon="folder-open" or data-icon="folder-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card)) or @include icon(glyph(generic-card), 24, "outline")
      • +
    • HTML: data-icon="generic-card" or data-icon="generic-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard)) or @include icon(glyph(giftcard), 24, "outline")
      • +
    • HTML: data-icon="giftcard" or data-icon="giftcard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing)) or @include icon(glyph(hearing), 24, "outline")
      • +
    • HTML: data-icon="hearing" or data-icon="hearing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled)) or @include icon(glyph(hearing-disabled), 24, "outline")
      • +
    • HTML: data-icon="hearing-disabled" or data-icon="hearing-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "outline")
      • +
    • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "outline")
      • +
    • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image)) or @include icon(glyph(image), 24, "outline")
      • +
    • HTML: data-icon="image" or data-icon="image" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "outline")
      • +
    • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key)) or @include icon(glyph(key), 24, "outline")
      • +
    • HTML: data-icon="key" or data-icon="key" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal)) or @include icon(glyph(legal), 24, "outline")
      • +
    • HTML: data-icon="legal" or data-icon="legal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb)) or @include icon(glyph(lightbulb), 24, "outline")
      • +
    • HTML: data-icon="lightbulb" or data-icon="lightbulb" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close)) or @include icon(glyph(lock-close), 24, "outline")
      • +
    • HTML: data-icon="lock-close" or data-icon="lock-close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open)) or @include icon(glyph(lock-open), 24, "outline")
      • +
    • HTML: data-icon="lock-open" or data-icon="lock-open" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out)) or @include icon(glyph(log-out), 24, "outline")
      • +
    • HTML: data-icon="log-out" or data-icon="log-out" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook)) or @include icon(glyph(logbook), 24, "outline")
      • +
    • HTML: data-icon="logbook" or data-icon="logbook" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus)) or @include icon(glyph(minus), 24, "outline")
      • +
    • HTML: data-icon="minus" or data-icon="minus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank)) or @include icon(glyph(piggybank), 24, "outline")
      • +
    • HTML: data-icon="piggybank" or data-icon="piggybank" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "outline")
      • +
    • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print)) or @include icon(glyph(print), 24, "outline")
      • +
    • HTML: data-icon="print" or data-icon="print" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button)) or @include icon(glyph(push-button), 24, "outline")
      • +
    • HTML: data-icon="push-button" or data-icon="push-button" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "outline")
      • +
    • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize)) or @include icon(glyph(resize), 24, "outline")
      • +
    • HTML: data-icon="resize" or data-icon="resize" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner)) or @include icon(glyph(resize-handle-corner), 24, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" or data-icon="resize-handle-corner" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save)) or @include icon(glyph(save), 24, "outline")
      • +
    • HTML: data-icon="save" or data-icon="save" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule)) or @include icon(glyph(schedule), 24, "outline")
      • +
    • HTML: data-icon="schedule" or data-icon="schedule" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search)) or @include icon(glyph(search), 24, "outline")
      • +
    • HTML: data-icon="search" or data-icon="search" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send)) or @include icon(glyph(send), 24, "outline")
      • +
    • HTML: data-icon="send" or data-icon="send" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa)) or @include icon(glyph(sepa), 24, "outline")
      • +
    • HTML: data-icon="sepa" or data-icon="sepa" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings)) or @include icon(glyph(settings), 24, "outline")
      • +
    • HTML: data-icon="settings" or data-icon="settings" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share)) or @include icon(glyph(share), 24, "outline")
      • +
    • HTML: data-icon="share" or data-icon="share" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag)) or @include icon(glyph(shopping-bag), 24, "outline")
      • +
    • HTML: data-icon="shopping-bag" or data-icon="shopping-bag" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket)) or @include icon(glyph(shopping-basket), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket" or data-icon="shopping-basket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled)) or @include icon(glyph(shopping-basket-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" or data-icon="shopping-basket-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart)) or @include icon(glyph(shopping-cart), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart" or data-icon="shopping-cart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled)) or @include icon(glyph(shopping-cart-disabled), 24, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" or data-icon="shopping-cart-disabled" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down)) or @include icon(glyph(sort-down), 24, "outline")
      • +
    • HTML: data-icon="sort-down" or data-icon="sort-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up)) or @include icon(glyph(sort-up), 24, "outline")
      • +
    • HTML: data-icon="sort-up" or data-icon="sort-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "outline")
      • +
    • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal)) or @include icon(glyph(swap-horizontal), 24, "outline")
      • +
    • HTML: data-icon="swap-horizontal" or data-icon="swap-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical)) or @include icon(glyph(swap-vertical), 24, "outline")
      • +
    • HTML: data-icon="swap-vertical" or data-icon="swap-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up)) or @include icon(glyph(thumb-up), 24, "outline")
      • +
    • HTML: data-icon="thumb-up" or data-icon="thumb-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down)) or @include icon(glyph(thumb-up-down), 24, "outline")
      • +
    • HTML: data-icon="thumb-up-down" or data-icon="thumb-up-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation)) or @include icon(glyph(translation), 24, "outline")
      • +
    • HTML: data-icon="translation" or data-icon="translation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo)) or @include icon(glyph(undo), 24, "outline")
      • +
    • HTML: data-icon="undo" or data-icon="undo" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload)) or @include icon(glyph(upload), 24, "outline")
      • +
    • HTML: data-icon="upload" or data-icon="upload" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility)) or @include icon(glyph(visibility), 24, "outline")
      • +
    • HTML: data-icon="visibility" or data-icon="visibility" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off)) or @include icon(glyph(visibility-off), 24, "outline")
      • +
    • HTML: data-icon="visibility-off" or data-icon="visibility-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher)) or @include icon(glyph(voucher), 24, "outline")
      • +
    • HTML: data-icon="voucher" or data-icon="voucher" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website)) or @include icon(glyph(website), 24, "outline")
      • +
    • HTML: data-icon="website" or data-icon="website" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in)) or @include icon(glyph(zoom-in), 24, "outline")
      • +
    • HTML: data-icon="zoom-in" or data-icon="zoom-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out)) or @include icon(glyph(zoom-out), 24, "outline")
      • +
    • HTML: data-icon="zoom-out" or data-icon="zoom-out" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "outline")
      • +
    • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10)) or @include icon(glyph(fast-backward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-10" or data-icon="fast-backward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30)) or @include icon(glyph(fast-backward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-30" or data-icon="fast-backward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty)) or @include icon(glyph(fast-backward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" or data-icon="fast-backward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "outline")
      • +
    • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10)) or @include icon(glyph(fast-forward-10), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-10" or data-icon="fast-forward-10" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30)) or @include icon(glyph(fast-forward-30), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-30" or data-icon="fast-forward-30" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty)) or @include icon(glyph(fast-forward-empty), 24, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" or data-icon="fast-forward-empty" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "outline")
      • +
    • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause)) or @include icon(glyph(pause), 24, "outline")
      • +
    • HTML: data-icon="pause" or data-icon="pause" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "outline")
      • +
    • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "outline")
      • +
    • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "outline")
      • +
    • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "outline")
      • +
    • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles)) or @include icon(glyph(subtitles), 24, "outline")
      • +
    • HTML: data-icon="subtitles" or data-icon="subtitles" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down)) or @include icon(glyph(volume-down), 24, "outline")
      • +
    • HTML: data-icon="volume-down" or data-icon="volume-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute)) or @include icon(glyph(volume-mute), 24, "outline")
      • +
    • HTML: data-icon="volume-mute" or data-icon="volume-mute" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off)) or @include icon(glyph(volume-off), 24, "outline")
      • +
    • HTML: data-icon="volume-off" or data-icon="volume-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up)) or @include icon(glyph(volume-up), 24, "outline")
      • +
    • HTML: data-icon="volume-up" or data-icon="volume-up" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(logo)) or @include icon(glyph(logo), 24, "outline")
      • +
    • HTML: data-icon="logo" or data-icon="logo" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Communication + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(call)) or @include icon(glyph(call), 24, "outline")
      • +
    • HTML: data-icon="call" or data-icon="call" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat)) or @include icon(glyph(chat), 24, "outline")
      • +
    • HTML: data-icon="chat" or data-icon="chat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation)) or @include icon(glyph(conversation), 24, "outline")
      • +
    • HTML: data-icon="conversation" or data-icon="conversation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax)) or @include icon(glyph(fax), 24, "outline")
      • +
    • HTML: data-icon="fax" or data-icon="fax" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback)) or @include icon(glyph(feedback), 24, "outline")
      • +
    • HTML: data-icon="feedback" or data-icon="feedback" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail)) or @include icon(glyph(mail), 24, "outline")
      • +
    • HTML: data-icon="mail" or data-icon="mail" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone)) or @include icon(glyph(mobile-phone), 24, "outline")
      • +
    • HTML: data-icon="mobile-phone" or data-icon="mobile-phone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off)) or @include icon(glyph(mobile-off), 24, "outline")
      • +
    • HTML: data-icon="mobile-off" or data-icon="mobile-off" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question)) or @include icon(glyph(question), 24, "outline")
      • +
    • HTML: data-icon="question" or data-icon="question" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item)) or @include icon(glyph(receive-item), 24, "outline")
      • +
    • HTML: data-icon="receive-item" or data-icon="receive-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item)) or @include icon(glyph(share-item), 24, "outline")
      • +
    • HTML: data-icon="share-item" or data-icon="share-item" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi)) or @include icon(glyph(wifi), 24, "outline")
      • +
    • HTML: data-icon="wifi" or data-icon="wifi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off)) or @include icon(glyph(wifi-off), 24, "outline")
      • +
    • HTML: data-icon="wifi-off" or data-icon="wifi-off" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Covid 19 + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(mask)) or @include icon(glyph(mask), 24, "outline")
      • +
    • HTML: data-icon="mask" or data-icon="mask" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Facilities + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(playground)) or @include icon(glyph(playground), 24, "outline")
      • +
    • HTML: data-icon="playground" or data-icon="playground" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet)) or @include icon(glyph(restricted-mobility-toilet), 24, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" or data-icon="restricted-mobility-toilet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower)) or @include icon(glyph(shower), 24, "outline")
      • +
    • HTML: data-icon="shower" or data-icon="shower" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men)) or @include icon(glyph(shower-men), 24, "outline")
      • +
    • HTML: data-icon="shower-men" or data-icon="shower-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women)) or @include icon(glyph(shower-women), 24, "outline")
      • +
    • HTML: data-icon="shower-women" or data-icon="shower-women" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink)) or @include icon(glyph(sink), 24, "outline")
      • +
    • HTML: data-icon="sink" or data-icon="sink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc)) or @include icon(glyph(wc), 24, "outline")
      • +
    • HTML: data-icon="wc" or data-icon="wc" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men)) or @include icon(glyph(wc-men), 24, "outline")
      • +
    • HTML: data-icon="wc-men" or data-icon="wc-men" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign)) or @include icon(glyph(wc-sign), 24, "outline")
      • +
    • HTML: data-icon="wc-sign" or data-icon="wc-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman)) or @include icon(glyph(wc-woman), 24, "outline")
      • +
    • HTML: data-icon="wc-woman" or data-icon="wc-woman" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Feature + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition)) or @include icon(glyph(air-condition), 24, "outline")
      • +
    • HTML: data-icon="air-condition" or data-icon="air-condition" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy)) or @include icon(glyph(buggy), 24, "outline")
      • +
    • HTML: data-icon="buggy" or data-icon="buggy" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger)) or @include icon(glyph(clothing-hanger), 24, "outline")
      • +
    • HTML: data-icon="clothing-hanger" or data-icon="clothing-hanger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day)) or @include icon(glyph(day), 24, "outline")
      • +
    • HTML: data-icon="day" or data-icon="day" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog)) or @include icon(glyph(dog), 24, "outline")
      • +
    • HTML: data-icon="dog" or data-icon="dog" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid)) or @include icon(glyph(entry-aid), 24, "outline")
      • +
    • HTML: data-icon="entry-aid" or data-icon="entry-aid" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check)) or @include icon(glyph(environmental-mobility-check), 24, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" or data-icon="environmental-mobility-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen)) or @include icon(glyph(hydrogen), 24, "outline")
      • +
    • HTML: data-icon="hydrogen" or data-icon="hydrogen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment)) or @include icon(glyph(luggage-compartment), 24, "outline")
      • +
    • HTML: data-icon="luggage-compartment" or data-icon="luggage-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack)) or @include icon(glyph(luggage-rack), 24, "outline")
      • +
    • HTML: data-icon="luggage-rack" or data-icon="luggage-rack" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace)) or @include icon(glyph(marketplace), 24, "outline")
      • +
    • HTML: data-icon="marketplace" or data-icon="marketplace" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical)) or @include icon(glyph(medical), 24, "outline")
      • +
    • HTML: data-icon="medical" or data-icon="medical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night)) or @include icon(glyph(night), 24, "outline")
      • +
    • HTML: data-icon="night" or data-icon="night" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking)) or @include icon(glyph(no-smoking), 24, "outline")
      • +
    • HTML: data-icon="no-smoking" or data-icon="no-smoking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane)) or @include icon(glyph(person-with-cane), 24, "outline")
      • +
    • HTML: data-icon="person-with-cane" or data-icon="person-with-cane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator)) or @include icon(glyph(person-with-rollator), 24, "outline")
      • +
    • HTML: data-icon="person-with-rollator" or data-icon="person-with-rollator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform)) or @include icon(glyph(platform), 24, "outline")
      • +
    • HTML: data-icon="platform" or data-icon="platform" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet)) or @include icon(glyph(power-outlet), 24, "outline")
      • +
    • HTML: data-icon="power-outlet" or data-icon="power-outlet" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation)) or @include icon(glyph(reservation), 24, "outline")
      • +
    • HTML: data-icon="reservation" or data-icon="reservation" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room)) or @include icon(glyph(standing-room), 24, "outline")
      • +
    • HTML: data-icon="standing-room" or data-icon="standing-room" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry)) or @include icon(glyph(steppless-entry), 24, "outline")
      • +
    • HTML: data-icon="steppless-entry" or data-icon="steppless-entry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog)) or @include icon(glyph(support-dog), 24, "outline")
      • +
    • HTML: data-icon="support-dog" or data-icon="support-dog" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Food + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast)) or @include icon(glyph(breakfast), 24, "outline")
      • +
    • HTML: data-icon="breakfast" or data-icon="breakfast" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup)) or @include icon(glyph(coffee-cup), 24, "outline")
      • +
    • HTML: data-icon="coffee-cup" or data-icon="coffee-cup" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink)) or @include icon(glyph(drink), 24, "outline")
      • +
    • HTML: data-icon="drink" or data-icon="drink" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant)) or @include icon(glyph(restaurant), 24, "outline")
      • +
    • HTML: data-icon="restaurant" or data-icon="restaurant" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 24, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Journey + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class)) or @include icon(glyph(1st-class), 24, "outline")
      • +
    • HTML: data-icon="1st-class" or data-icon="1st-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class)) or @include icon(glyph(2nd-class), 24, "outline")
      • +
    • HTML: data-icon="2nd-class" or data-icon="2nd-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection)) or @include icon(glyph(alternative-connection), 24, "outline")
      • +
    • HTML: data-icon="alternative-connection" or data-icon="alternative-connection" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking)) or @include icon(glyph(booking), 24, "outline")
      • +
    • HTML: data-icon="booking" or data-icon="booking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "outline")
      • +
    • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop)) or @include icon(glyph(intermediary-stop), 24, "outline")
      • +
    • HTML: data-icon="intermediary-stop" or data-icon="intermediary-stop" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class)) or @include icon(glyph(mixed-class), 24, "outline")
      • +
    • HTML: data-icon="mixed-class" or data-icon="mixed-class" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip)) or @include icon(glyph(round-trip), 24, "outline")
      • +
    • HTML: data-icon="round-trip" or data-icon="round-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip)) or @include icon(glyph(single-trip), 24, "outline")
      • +
    • HTML: data-icon="single-trip" or data-icon="single-trip" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start)) or @include icon(glyph(start), 24, "outline")
      • +
    • HTML: data-icon="start" or data-icon="start" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Maps + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "outline")
      • +
    • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "outline")
      • +
    • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home)) or @include icon(glyph(home), 24, "outline")
      • +
    • HTML: data-icon="home" or data-icon="home" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map)) or @include icon(glyph(map), 24, "outline")
      • +
    • HTML: data-icon="map" or data-icon="map" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight)) or @include icon(glyph(navigation-straight), 24, "outline")
      • +
    • HTML: data-icon="navigation-straight" or data-icon="navigation-straight" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left)) or @include icon(glyph(navigation-to-left), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-left" or data-icon="navigation-to-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right)) or @include icon(glyph(navigation-to-right), 24, "outline")
      • +
    • HTML: data-icon="navigation-to-right" or data-icon="navigation-to-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn)) or @include icon(glyph(navigation-u-turn), 24, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" or data-icon="navigation-u-turn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign)) or @include icon(glyph(stop-sign), 24, "outline")
      • +
    • HTML: data-icon="stop-sign" or data-icon="stop-sign" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking)) or @include icon(glyph(parking), 24, "outline")
      • +
    • HTML: data-icon="parking" or data-icon="parking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place)) or @include icon(glyph(place), 24, "outline")
      • +
    • HTML: data-icon="place" or data-icon="place" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position)) or @include icon(glyph(set-position), 24, "outline")
      • +
    • HTML: data-icon="set-position" or data-icon="set-position" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station)) or @include icon(glyph(station), 24, "outline")
      • +
    • HTML: data-icon="station" or data-icon="station" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station)) or @include icon(glyph(train-station), 24, "outline")
      • +
    • HTML: data-icon="train-station" or data-icon="train-station" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back)) or @include icon(glyph(arrow-back), 24, "outline")
      • +
    • HTML: data-icon="arrow-back" or data-icon="arrow-back" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down)) or @include icon(glyph(arrow-down), 24, "outline")
      • +
    • HTML: data-icon="arrow-down" or data-icon="arrow-down" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward)) or @include icon(glyph(arrow-forward), 24, "outline")
      • +
    • HTML: data-icon="arrow-forward" or data-icon="arrow-forward" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up)) or @include icon(glyph(arrow-up), 24, "outline")
      • +
    • HTML: data-icon="arrow-up" or data-icon="arrow-up" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "outline")
      • +
    • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left)) or @include icon(glyph(chevron-left), 24, "outline")
      • +
    • HTML: data-icon="chevron-left" or data-icon="chevron-left" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right)) or @include icon(glyph(chevron-right), 24, "outline")
      • +
    • HTML: data-icon="chevron-right" or data-icon="chevron-right" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close)) or @include icon(glyph(close), 24, "outline")
      • +
    • HTML: data-icon="close" or data-icon="close" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less)) or @include icon(glyph(expand-less), 24, "outline")
      • +
    • HTML: data-icon="expand-less" or data-icon="expand-less" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more)) or @include icon(glyph(expand-more), 24, "outline")
      • +
    • HTML: data-icon="expand-more" or data-icon="expand-more" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen)) or @include icon(glyph(fullscreen), 24, "outline")
      • +
    • HTML: data-icon="fullscreen" or data-icon="fullscreen" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit)) or @include icon(glyph(fullscreen-exit), 24, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" or data-icon="fullscreen-exit" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view)) or @include icon(glyph(grid-view), 24, "outline")
      • +
    • HTML: data-icon="grid-view" or data-icon="grid-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link)) or @include icon(glyph(link), 24, "outline")
      • +
    • HTML: data-icon="link" or data-icon="link" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external)) or @include icon(glyph(link-external), 24, "outline")
      • +
    • HTML: data-icon="link-external" or data-icon="link-external" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list)) or @include icon(glyph(list), 24, "outline")
      • +
    • HTML: data-icon="list" or data-icon="list" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu)) or @include icon(glyph(menu), 24, "outline")
      • +
    • HTML: data-icon="menu" or data-icon="menu" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal)) or @include icon(glyph(more-horizontal), 24, "outline")
      • +
    • HTML: data-icon="more-horizontal" or data-icon="more-horizontal" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical)) or @include icon(glyph(more-vertical), 24, "outline")
      • +
    • HTML: data-icon="more-vertical" or data-icon="more-vertical" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh)) or @include icon(glyph(refresh), 24, "outline")
      • +
    • HTML: data-icon="refresh" or data-icon="refresh" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Notification + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "outline")
      • +
    • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify)) or @include icon(glyph(notify), 24, "outline")
      • +
    • HTML: data-icon="notify" or data-icon="notify" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff)) or @include icon(glyph(notify-cutoff), 24, "outline")
      • +
    • HTML: data-icon="notify-cutoff" or data-icon="notify-cutoff" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "outline")
      • +
    • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Seat + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle)) or @include icon(glyph(aisle), 24, "outline")
      • +
    • HTML: data-icon="aisle" or data-icon="aisle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available)) or @include icon(glyph(aisle-not-available), 24, "outline")
      • +
    • HTML: data-icon="aisle-not-available" or data-icon="aisle-not-available" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed)) or @include icon(glyph(bed), 24, "outline")
      • +
    • HTML: data-icon="bed" or data-icon="bed" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment)) or @include icon(glyph(childrens-compartment), 24, "outline")
      • +
    • HTML: data-icon="childrens-compartment" or data-icon="childrens-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly)) or @include icon(glyph(elderly), 24, "outline")
      • +
    • HTML: data-icon="elderly" or data-icon="elderly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped)) or @include icon(glyph(handicapped), 24, "outline")
      • +
    • HTML: data-icon="handicapped" or data-icon="handicapped" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment)) or @include icon(glyph(parent-child-compartment), 24, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" or data-icon="parent-child-compartment" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority)) or @include icon(glyph(priority), 24, "outline")
      • +
    • HTML: data-icon="priority" or data-icon="priority" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone)) or @include icon(glyph(quiet-zone), 24, "outline")
      • +
    • HTML: data-icon="quiet-zone" or data-icon="quiet-zone" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table)) or @include icon(glyph(table), 24, "outline")
      • +
    • HTML: data-icon="table" or data-icon="table" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window)) or @include icon(glyph(window), 24, "outline")
      • +
    • HTML: data-icon="window" or data-icon="window" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Ticket + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus)) or @include icon(glyph(bahnbonus), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus" or data-icon="bahnbonus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card)) or @include icon(glyph(bahnbonus-card), 24, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" or data-icon="bahnbonus-card" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard)) or @include icon(glyph(bahncard), 24, "outline")
      • +
    • HTML: data-icon="bahncard" or data-icon="bahncard" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price)) or @include icon(glyph(best-price), 24, "outline")
      • +
    • HTML: data-icon="best-price" or data-icon="best-price" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket)) or @include icon(glyph(commuter-ticket), 24, "outline")
      • +
    • HTML: data-icon="commuter-ticket" or data-icon="commuter-ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in)) or @include icon(glyph(komfort-check-in), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in" or data-icon="komfort-check-in" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check)) or @include icon(glyph(komfort-check-in-check), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" or data-icon="komfort-check-in-check" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle)) or @include icon(glyph(komfort-check-in-circle), 24, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" or data-icon="komfort-check-in-circle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards)) or @include icon(glyph(multiple-cards), 24, "outline")
      • +
    • HTML: data-icon="multiple-cards" or data-icon="multiple-cards" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger)) or @include icon(glyph(multiple-passenger), 24, "outline")
      • +
    • HTML: data-icon="multiple-passenger" or data-icon="multiple-passenger" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel)) or @include icon(glyph(my-travel), 24, "outline")
      • +
    • HTML: data-icon="my-travel" or data-icon="my-travel" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey)) or @include icon(glyph(outward-journey), 24, "outline")
      • +
    • HTML: data-icon="outward-journey" or data-icon="outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code)) or @include icon(glyph(qr-code), 24, "outline")
      • +
    • HTML: data-icon="qr-code" or data-icon="qr-code" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan)) or @include icon(glyph(qr-code-scan), 24, "outline")
      • +
    • HTML: data-icon="qr-code-scan" or data-icon="qr-code-scan" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey)) or @include icon(glyph(return-journey), 24, "outline")
      • +
    • HTML: data-icon="return-journey" or data-icon="return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket)) or @include icon(glyph(ticket), 24, "outline")
      • +
    • HTML: data-icon="ticket" or data-icon="ticket" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount)) or @include icon(glyph(ticket-discount), 24, "outline")
      • +
    • HTML: data-icon="ticket-discount" or data-icon="ticket-discount" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple)) or @include icon(glyph(ticket-multiple), 24, "outline")
      • +
    • HTML: data-icon="ticket-multiple" or data-icon="ticket-multiple" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription)) or @include icon(glyph(ticket-subscription), 24, "outline")
      • +
    • HTML: data-icon="ticket-subscription" or data-icon="ticket-subscription" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey)) or @include icon(glyph(time-outward-journey), 24, "outline")
      • +
    • HTML: data-icon="time-outward-journey" or data-icon="time-outward-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey)) or @include icon(glyph(time-return-journey), 24, "outline")
      • +
    • HTML: data-icon="time-return-journey" or data-icon="time-return-journey" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable)) or @include icon(glyph(timetable), 24, "outline")
      • +
    • HTML: data-icon="timetable" or data-icon="timetable" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance)) or @include icon(glyph(travel-insurance), 24, "outline")
      • +
    • HTML: data-icon="travel-insurance" or data-icon="travel-insurance" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 24x24 - Outline - Transportation + + + + + +

+ + + +
+ +
+
+ +
+

Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

+
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "outline")
      • +
    • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "outline")
      • +
    • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "outline")
      • +
    • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "outline")
      • +
    • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "outline")
      • +
    • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence)) or @include icon(glyph(car-sequence), 24, "outline")
      • +
    • HTML: data-icon="car-sequence" or data-icon="car-sequence" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "outline")
      • +
    • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "outline")
      • +
    • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "outline")
      • +
    • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "outline")
      • +
    • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "outline")
      • +
    • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "outline")
      • +
    • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "outline")
      • +
    • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view)) or @include icon(glyph(ice-side-view), 24, "outline")
      • +
    • HTML: data-icon="ice-side-view" or data-icon="ice-side-view" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "outline")
      • +
    • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "outline")
      • +
    • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "outline")
      • +
    • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly)) or @include icon(glyph(rail-and-fly), 24, "outline")
      • +
    • HTML: data-icon="rail-and-fly" or data-icon="rail-and-fly" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car)) or @include icon(glyph(railroad-car), 24, "outline")
      • +
    • HTML: data-icon="railroad-car" or data-icon="railroad-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "outline")
      • +
    • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "outline")
      • +
    • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev)) or @include icon(glyph(sev), 24, "outline")
      • +
    • HTML: data-icon="sev" or data-icon="sev" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "outline")
      • +
    • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter)) or @include icon(glyph(sprinter), 24, "outline")
      • +
    • HTML: data-icon="sprinter" or data-icon="sprinter" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "outline")
      • +
    • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "outline")
      • +
    • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "outline")
      • +
    • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "outline")
      • +
    • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "outline")
      • +
    • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "outline")
      • +
    • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "filled")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "filled")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "filled")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "filled")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "filled")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "filled")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "filled")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "filled")
      • +
    • HTML: data-icon="help" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "filled")
      • +
    • HTML: data-icon="info" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "filled")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "filled")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "filled")
      • +
    • HTML: data-icon="star" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "filled")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "filled")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "filled")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "filled")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "filled")
      • +
    • HTML: data-icon="error" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "filled")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Filled - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "filled")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "filled")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "filled")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "filled")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "filled")
      • +
    • HTML: data-icon="car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "filled")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "filled")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "filled")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "filled")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "filled")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "filled")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "filled")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "filled")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "filled")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "filled")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "filled")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "filled")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "filled")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "filled")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "filled")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "filled")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "filled")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "filled")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "filled")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "filled")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Action + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(account), 32, "outline")
      • +
    • HTML: data-icon="account" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add), 32, "outline")
      • +
    • HTML: data-icon="add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-circle), 32, "outline")
      • +
    • HTML: data-icon="add-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(add-link), 32, "outline")
      • +
    • HTML: data-icon="add-link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm), 32, "outline")
      • +
    • HTML: data-icon="alarm" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alarm-add), 32, "outline")
      • +
    • HTML: data-icon="alarm-add" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert), 32, "outline")
      • +
    • HTML: data-icon="alert" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alert-off), 32, "outline")
      • +
    • HTML: data-icon="alert-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(attachment), 32, "outline")
      • +
    • HTML: data-icon="attachment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(augmented-reality), 32, "outline")
      • +
    • HTML: data-icon="augmented-reality" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(block), 32, "outline")
      • +
    • HTML: data-icon="block" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bookmark), 32, "outline")
      • +
    • HTML: data-icon="bookmark" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bug), 32, "outline")
      • +
    • HTML: data-icon="bug" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(build), 32, "outline")
      • +
    • HTML: data-icon="build" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(calendar), 32, "outline")
      • +
    • HTML: data-icon="calendar" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(camera), 32, "outline")
      • +
    • HTML: data-icon="camera" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cash), 32, "outline")
      • +
    • HTML: data-icon="cash" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(check-circle), 32, "outline")
      • +
    • HTML: data-icon="check-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud), 32, "outline")
      • +
    • HTML: data-icon="cloud" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-download), 32, "outline")
      • +
    • HTML: data-icon="cloud-download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cloud-upload), 32, "outline")
      • +
    • HTML: data-icon="cloud-upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(compass), 32, "outline")
      • +
    • HTML: data-icon="compass" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(copy), 32, "outline")
      • +
    • HTML: data-icon="copy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(credit-card), 32, "outline")
      • +
    • HTML: data-icon="credit-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dashboard), 32, "outline")
      • +
    • HTML: data-icon="dashboard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(delete), 32, "outline")
      • +
    • HTML: data-icon="delete" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(discount), 32, "outline")
      • +
    • HTML: data-icon="discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document), 32, "outline")
      • +
    • HTML: data-icon="document" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(document-check), 32, "outline")
      • +
    • HTML: data-icon="document-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(done), 32, "outline")
      • +
    • HTML: data-icon="done" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(download), 32, "outline")
      • +
    • HTML: data-icon="download" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drag-and-drop), 32, "outline")
      • +
    • HTML: data-icon="drag-and-drop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(edit), 32, "outline")
      • +
    • HTML: data-icon="edit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-delighted), 32, "outline")
      • +
    • HTML: data-icon="face-delighted" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-disappointed), 32, "outline")
      • +
    • HTML: data-icon="face-disappointed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-neutral), 32, "outline")
      • +
    • HTML: data-icon="face-neutral" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-sad), 32, "outline")
      • +
    • HTML: data-icon="face-sad" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(face-smiling), 32, "outline")
      • +
    • HTML: data-icon="face-smiling" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(filter), 32, "outline")
      • +
    • HTML: data-icon="filter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fingerprint), 32, "outline")
      • +
    • HTML: data-icon="fingerprint" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder), 32, "outline")
      • +
    • HTML: data-icon="folder" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(folder-open), 32, "outline")
      • +
    • HTML: data-icon="folder-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(generic-card), 32, "outline")
      • +
    • HTML: data-icon="generic-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(giftcard), 32, "outline")
      • +
    • HTML: data-icon="giftcard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing), 32, "outline")
      • +
    • HTML: data-icon="hearing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hearing-disabled), 32, "outline")
      • +
    • HTML: data-icon="hearing-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(heart), 32, "outline")
      • +
    • HTML: data-icon="heart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(help), 32, "outline")
      • +
    • HTML: data-icon="help" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(image), 32, "outline")
      • +
    • HTML: data-icon="image" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(info), 32, "outline")
      • +
    • HTML: data-icon="info" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(key), 32, "outline")
      • +
    • HTML: data-icon="key" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(legal), 32, "outline")
      • +
    • HTML: data-icon="legal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lightbulb), 32, "outline")
      • +
    • HTML: data-icon="lightbulb" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-close), 32, "outline")
      • +
    • HTML: data-icon="lock-close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(lock-open), 32, "outline")
      • +
    • HTML: data-icon="lock-open" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(log-out), 32, "outline")
      • +
    • HTML: data-icon="log-out" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(logbook), 32, "outline")
      • +
    • HTML: data-icon="logbook" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(minus), 32, "outline")
      • +
    • HTML: data-icon="minus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(piggybank), 32, "outline")
      • +
    • HTML: data-icon="piggybank" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pin), 32, "outline")
      • +
    • HTML: data-icon="pin" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(print), 32, "outline")
      • +
    • HTML: data-icon="print" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(push-button), 32, "outline")
      • +
    • HTML: data-icon="push-button" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(remove), 32, "outline")
      • +
    • HTML: data-icon="remove" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize), 32, "outline")
      • +
    • HTML: data-icon="resize" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(resize-handle-corner), 32, "outline")
      • +
    • HTML: data-icon="resize-handle-corner" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(save), 32, "outline")
      • +
    • HTML: data-icon="save" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(schedule), 32, "outline")
      • +
    • HTML: data-icon="schedule" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(search), 32, "outline")
      • +
    • HTML: data-icon="search" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(send), 32, "outline")
      • +
    • HTML: data-icon="send" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sepa), 32, "outline")
      • +
    • HTML: data-icon="sepa" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(settings), 32, "outline")
      • +
    • HTML: data-icon="settings" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share), 32, "outline")
      • +
    • HTML: data-icon="share" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-bag), 32, "outline")
      • +
    • HTML: data-icon="shopping-bag" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-basket-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-basket-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shopping-cart-disabled), 32, "outline")
      • +
    • HTML: data-icon="shopping-cart-disabled" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-down), 32, "outline")
      • +
    • HTML: data-icon="sort-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sort-up), 32, "outline")
      • +
    • HTML: data-icon="sort-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(star), 32, "outline")
      • +
    • HTML: data-icon="star" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-horizontal), 32, "outline")
      • +
    • HTML: data-icon="swap-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(swap-vertical), 32, "outline")
      • +
    • HTML: data-icon="swap-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up), 32, "outline")
      • +
    • HTML: data-icon="thumb-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(thumb-up-down), 32, "outline")
      • +
    • HTML: data-icon="thumb-up-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(translation), 32, "outline")
      • +
    • HTML: data-icon="translation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(undo), 32, "outline")
      • +
    • HTML: data-icon="undo" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(upload), 32, "outline")
      • +
    • HTML: data-icon="upload" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility), 32, "outline")
      • +
    • HTML: data-icon="visibility" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(visibility-off), 32, "outline")
      • +
    • HTML: data-icon="visibility-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(voucher), 32, "outline")
      • +
    • HTML: data-icon="voucher" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(website), 32, "outline")
      • +
    • HTML: data-icon="website" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-in), 32, "outline")
      • +
    • HTML: data-icon="zoom-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(zoom-out), 32, "outline")
      • +
    • HTML: data-icon="zoom-out" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 32, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-backward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 32, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-10), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-10" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-30), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-30" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward-empty), 32, "outline")
      • +
    • HTML: data-icon="fast-forward-empty" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(microphone), 32, "outline")
      • +
    • HTML: data-icon="microphone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 32, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 32, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 32, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 32, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 32, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subtitles), 32, "outline")
      • +
    • HTML: data-icon="subtitles" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-down), 32, "outline")
      • +
    • HTML: data-icon="volume-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-mute), 32, "outline")
      • +
    • HTML: data-icon="volume-mute" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-off), 32, "outline")
      • +
    • HTML: data-icon="volume-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(volume-up), 32, "outline")
      • +
    • HTML: data-icon="volume-up" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 32, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Communication + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(call), 32, "outline")
      • +
    • HTML: data-icon="call" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chat), 32, "outline")
      • +
    • HTML: data-icon="chat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(conversation), 32, "outline")
      • +
    • HTML: data-icon="conversation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fax), 32, "outline")
      • +
    • HTML: data-icon="fax" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(feedback), 32, "outline")
      • +
    • HTML: data-icon="feedback" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mail), 32, "outline")
      • +
    • HTML: data-icon="mail" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-phone), 32, "outline")
      • +
    • HTML: data-icon="mobile-phone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mobile-off), 32, "outline")
      • +
    • HTML: data-icon="mobile-off" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(question), 32, "outline")
      • +
    • HTML: data-icon="question" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(receive-item), 32, "outline")
      • +
    • HTML: data-icon="receive-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(share-item), 32, "outline")
      • +
    • HTML: data-icon="share-item" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi), 32, "outline")
      • +
    • HTML: data-icon="wifi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wifi-off), 32, "outline")
      • +
    • HTML: data-icon="wifi-off" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Covid 19 + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(mask), 32, "outline")
      • +
    • HTML: data-icon="mask" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Facilities + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(playground), 32, "outline")
      • +
    • HTML: data-icon="playground" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restricted-mobility-toilet), 32, "outline")
      • +
    • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower), 32, "outline")
      • +
    • HTML: data-icon="shower" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-men), 32, "outline")
      • +
    • HTML: data-icon="shower-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(shower-women), 32, "outline")
      • +
    • HTML: data-icon="shower-women" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sink), 32, "outline")
      • +
    • HTML: data-icon="sink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc), 32, "outline")
      • +
    • HTML: data-icon="wc" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-men), 32, "outline")
      • +
    • HTML: data-icon="wc-men" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-sign), 32, "outline")
      • +
    • HTML: data-icon="wc-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(wc-woman), 32, "outline")
      • +
    • HTML: data-icon="wc-woman" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Feature + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(air-condition), 32, "outline")
      • +
    • HTML: data-icon="air-condition" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(buggy), 32, "outline")
      • +
    • HTML: data-icon="buggy" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(clothing-hanger), 32, "outline")
      • +
    • HTML: data-icon="clothing-hanger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(day), 32, "outline")
      • +
    • HTML: data-icon="day" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(dog), 32, "outline")
      • +
    • HTML: data-icon="dog" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(entry-aid), 32, "outline")
      • +
    • HTML: data-icon="entry-aid" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(environmental-mobility-check), 32, "outline")
      • +
    • HTML: data-icon="environmental-mobility-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(hydrogen), 32, "outline")
      • +
    • HTML: data-icon="hydrogen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-compartment), 32, "outline")
      • +
    • HTML: data-icon="luggage-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(luggage-rack), 32, "outline")
      • +
    • HTML: data-icon="luggage-rack" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(marketplace), 32, "outline")
      • +
    • HTML: data-icon="marketplace" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(medical), 32, "outline")
      • +
    • HTML: data-icon="medical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(night), 32, "outline")
      • +
    • HTML: data-icon="night" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(no-smoking), 32, "outline")
      • +
    • HTML: data-icon="no-smoking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-cane), 32, "outline")
      • +
    • HTML: data-icon="person-with-cane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(person-with-rollator), 32, "outline")
      • +
    • HTML: data-icon="person-with-rollator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(platform), 32, "outline")
      • +
    • HTML: data-icon="platform" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(power-outlet), 32, "outline")
      • +
    • HTML: data-icon="power-outlet" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(reservation), 32, "outline")
      • +
    • HTML: data-icon="reservation" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(standing-room), 32, "outline")
      • +
    • HTML: data-icon="standing-room" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(steppless-entry), 32, "outline")
      • +
    • HTML: data-icon="steppless-entry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(support-dog), 32, "outline")
      • +
    • HTML: data-icon="support-dog" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Food + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(breakfast), 32, "outline")
      • +
    • HTML: data-icon="breakfast" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(coffee-cup), 32, "outline")
      • +
    • HTML: data-icon="coffee-cup" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(drink), 32, "outline")
      • +
    • HTML: data-icon="drink" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(restaurant), 32, "outline")
      • +
    • HTML: data-icon="restaurant" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - IT + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(database), 32, "outline")
      • +
    • HTML: data-icon="database" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Journey + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(1st-class), 32, "outline")
      • +
    • HTML: data-icon="1st-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(2nd-class), 32, "outline")
      • +
    • HTML: data-icon="2nd-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(alternative-connection), 32, "outline")
      • +
    • HTML: data-icon="alternative-connection" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(booking), 32, "outline")
      • +
    • HTML: data-icon="booking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-high), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-high" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(capacity-indicator-low), 32, "outline")
      • +
    • HTML: data-icon="capacity-indicator-low" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(destination), 32, "outline")
      • +
    • HTML: data-icon="destination" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intermediary-stop), 32, "outline")
      • +
    • HTML: data-icon="intermediary-stop" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(mixed-class), 32, "outline")
      • +
    • HTML: data-icon="mixed-class" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(round-trip), 32, "outline")
      • +
    • HTML: data-icon="round-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(single-trip), 32, "outline")
      • +
    • HTML: data-icon="single-trip" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(start), 32, "outline")
      • +
    • HTML: data-icon="start" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Maps + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(gps), 32, "outline")
      • +
    • HTML: data-icon="gps" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(gps-north), 32, "outline")
      • +
    • HTML: data-icon="gps-north" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(home), 32, "outline")
      • +
    • HTML: data-icon="home" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(map), 32, "outline")
      • +
    • HTML: data-icon="map" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-straight), 32, "outline")
      • +
    • HTML: data-icon="navigation-straight" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-left), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-to-right), 32, "outline")
      • +
    • HTML: data-icon="navigation-to-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(navigation-u-turn), 32, "outline")
      • +
    • HTML: data-icon="navigation-u-turn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parking), 32, "outline")
      • +
    • HTML: data-icon="parking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(place), 32, "outline")
      • +
    • HTML: data-icon="place" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(set-position), 32, "outline")
      • +
    • HTML: data-icon="set-position" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(station), 32, "outline")
      • +
    • HTML: data-icon="station" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop-sign), 32, "outline")
      • +
    • HTML: data-icon="stop-sign" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-station), 32, "outline")
      • +
    • HTML: data-icon="train-station" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Navigation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(arrow-back), 32, "outline")
      • +
    • HTML: data-icon="arrow-back" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-down), 32, "outline")
      • +
    • HTML: data-icon="arrow-down" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-forward), 32, "outline")
      • +
    • HTML: data-icon="arrow-forward" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(arrow-up), 32, "outline")
      • +
    • HTML: data-icon="arrow-up" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(cancel), 32, "outline")
      • +
    • HTML: data-icon="cancel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-left), 32, "outline")
      • +
    • HTML: data-icon="chevron-left" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(chevron-right), 32, "outline")
      • +
    • HTML: data-icon="chevron-right" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(close), 32, "outline")
      • +
    • HTML: data-icon="close" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-less), 32, "outline")
      • +
    • HTML: data-icon="expand-less" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(expand-more), 32, "outline")
      • +
    • HTML: data-icon="expand-more" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen), 32, "outline")
      • +
    • HTML: data-icon="fullscreen" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fullscreen-exit), 32, "outline")
      • +
    • HTML: data-icon="fullscreen-exit" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(grid-view), 32, "outline")
      • +
    • HTML: data-icon="grid-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link), 32, "outline")
      • +
    • HTML: data-icon="link" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(link-external), 32, "outline")
      • +
    • HTML: data-icon="link-external" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(list), 32, "outline")
      • +
    • HTML: data-icon="list" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(menu), 32, "outline")
      • +
    • HTML: data-icon="menu" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-horizontal), 32, "outline")
      • +
    • HTML: data-icon="more-horizontal" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(more-vertical), 32, "outline")
      • +
    • HTML: data-icon="more-vertical" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(refresh), 32, "outline")
      • +
    • HTML: data-icon="refresh" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Notification + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(error), 32, "outline")
      • +
    • HTML: data-icon="error" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify), 32, "outline")
      • +
    • HTML: data-icon="notify" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(notify-cutoff), 32, "outline")
      • +
    • HTML: data-icon="notify-cutoff" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(warning), 32, "outline")
      • +
    • HTML: data-icon="warning" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Seat + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(aisle), 32, "outline")
      • +
    • HTML: data-icon="aisle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(aisle-not-available), 32, "outline")
      • +
    • HTML: data-icon="aisle-not-available" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bed), 32, "outline")
      • +
    • HTML: data-icon="bed" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(childrens-compartment), 32, "outline")
      • +
    • HTML: data-icon="childrens-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(elderly), 32, "outline")
      • +
    • HTML: data-icon="elderly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handicapped), 32, "outline")
      • +
    • HTML: data-icon="handicapped" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(parent-child-compartment), 32, "outline")
      • +
    • HTML: data-icon="parent-child-compartment" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(priority), 32, "outline")
      • +
    • HTML: data-icon="priority" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(quiet-zone), 32, "outline")
      • +
    • HTML: data-icon="quiet-zone" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(table), 32, "outline")
      • +
    • HTML: data-icon="table" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(window), 32, "outline")
      • +
    • HTML: data-icon="window" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Ticket + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus-card), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus-card" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahnbonus), 32, "outline")
      • +
    • HTML: data-icon="bahnbonus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bahncard), 32, "outline")
      • +
    • HTML: data-icon="bahncard" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(best-price), 32, "outline")
      • +
    • HTML: data-icon="best-price" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(commuter-ticket), 32, "outline")
      • +
    • HTML: data-icon="commuter-ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-check), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-check" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in-circle), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in-circle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(komfort-check-in), 32, "outline")
      • +
    • HTML: data-icon="komfort-check-in" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-cards), 32, "outline")
      • +
    • HTML: data-icon="multiple-cards" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(multiple-passenger), 32, "outline")
      • +
    • HTML: data-icon="multiple-passenger" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(my-travel), 32, "outline")
      • +
    • HTML: data-icon="my-travel" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(outward-journey), 32, "outline")
      • +
    • HTML: data-icon="outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code), 32, "outline")
      • +
    • HTML: data-icon="qr-code" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(qr-code-scan), 32, "outline")
      • +
    • HTML: data-icon="qr-code-scan" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(return-journey), 32, "outline")
      • +
    • HTML: data-icon="return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket), 32, "outline")
      • +
    • HTML: data-icon="ticket" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-discount), 32, "outline")
      • +
    • HTML: data-icon="ticket-discount" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-multiple), 32, "outline")
      • +
    • HTML: data-icon="ticket-multiple" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ticket-subscription), 32, "outline")
      • +
    • HTML: data-icon="ticket-subscription" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-outward-journey), 32, "outline")
      • +
    • HTML: data-icon="time-outward-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(time-return-journey), 32, "outline")
      • +
    • HTML: data-icon="time-return-journey" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(timetable), 32, "outline")
      • +
    • HTML: data-icon="timetable" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(travel-insurance), 32, "outline")
      • +
    • HTML: data-icon="travel-insurance" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 32x32 - Outline - Transportation + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(airplane), 32, "outline")
      • +
    • HTML: data-icon="airplane" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle), 32, "outline")
      • +
    • HTML: data-icon="bicycle" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(bicycle-trailer), 32, "outline")
      • +
    • HTML: data-icon="bicycle-trailer" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(call-a-bike), 32, "outline")
      • +
    • HTML: data-icon="call-a-bike" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car), 32, "outline")
      • +
    • HTML: data-icon="car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(carsharing), 32, "outline")
      • +
    • HTML: data-icon="carsharing" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(car-sequence), 32, "outline")
      • +
    • HTML: data-icon="car-sequence" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-locomotive), 32, "outline")
      • +
    • HTML: data-icon="electric-locomotive" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(electric-scooter), 32, "outline")
      • +
    • HTML: data-icon="electric-scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ev-car), 32, "outline")
      • +
    • HTML: data-icon="ev-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ferry), 32, "outline")
      • +
    • HTML: data-icon="ferry" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(handcart), 32, "outline")
      • +
    • HTML: data-icon="handcart" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice), 32, "outline")
      • +
    • HTML: data-icon="ice" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(intercity-train), 32, "outline")
      • +
    • HTML: data-icon="intercity-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(ice-side-view), 32, "outline")
      • +
    • HTML: data-icon="ice-side-view" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-bus), 32, "outline")
      • +
    • HTML: data-icon="local-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(long-distance-bus), 32, "outline")
      • +
    • HTML: data-icon="long-distance-bus" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(local-train), 32, "outline")
      • +
    • HTML: data-icon="local-train" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(rail-and-fly), 32, "outline")
      • +
    • HTML: data-icon="rail-and-fly" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(railroad-car), 32, "outline")
      • +
    • HTML: data-icon="railroad-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(s-bahn), 32, "outline")
      • +
    • HTML: data-icon="s-bahn" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(scooter), 32, "outline")
      • +
    • HTML: data-icon="scooter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sev), 32, "outline")
      • +
    • HTML: data-icon="sev" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(speedboat), 32, "outline")
      • +
    • HTML: data-icon="speedboat" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(sprinter), 32, "outline")
      • +
    • HTML: data-icon="sprinter" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(subway), 32, "outline")
      • +
    • HTML: data-icon="subway" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(taxi), 32, "outline")
      • +
    • HTML: data-icon="taxi" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(train-and-car), 32, "outline")
      • +
    • HTML: data-icon="train-and-car" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(tram), 32, "outline")
      • +
    • HTML: data-icon="tram" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking), 32, "outline")
      • +
    • HTML: data-icon="walking" data-icon-variant="32-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(walking-fast), 32, "outline")
      • +
    • HTML: data-icon="walking-fast" data-icon-variant="32-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 48x48 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 48x48 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 48, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 48, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 48, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 48, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 48, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 48, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="48-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 48, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="48-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 48x48 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 48, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="48-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 64x64 - Filled - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "filled")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "filled")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "filled")
      • +
    • HTML: data-icon="play" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "filled")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "filled")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-filled"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "filled")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-filled"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 64x64 - Outline - AV + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(fast-backward), 64, "outline")
      • +
    • HTML: data-icon="fast-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(fast-forward), 64, "outline")
      • +
    • HTML: data-icon="fast-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(pause), 64, "outline")
      • +
    • HTML: data-icon="pause" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(play), 64, "outline")
      • +
    • HTML: data-icon="play" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-backward), 64, "outline")
      • +
    • HTML: data-icon="skip-backward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(skip-forward), 64, "outline")
      • +
    • HTML: data-icon="skip-forward" data-icon-variant="64-outline"
      • +
    +
    • +
  • +
      +
    • SCSS: @include icon(glyph(stop), 64, "outline")
      • +
    • HTML: data-icon="stop" data-icon-variant="64-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + DB Icons 64x64 - Outline - Brand + + + + + +

+ + + +
+ +
+
+ +
+ +
    +
  • +
      +
    • SCSS: @include icon(glyph(logo), 64, "outline")
      • +
    • HTML: data-icon="logo" data-icon-variant="64-outline"
      • +
    +
    • +
+ +
+ + + +
+
+ +
+ +

+ + + Illustration Icons + + + + +

+ + + +
+ +
+
+ +
+ +
Action
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Communication
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Covid 19
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Devices
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Entertainment
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Feature
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Food /db_ic_il_ Drink
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Maps
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
News
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Station
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Ticket
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Transportation
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Travel
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
Weather
+
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
  • +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • +
+ +
+ + + +
+
+ +

+ Type +

+ +
+

We're delivering general font declarations and the web fonts for our generally used DB Screen Sans font.

+

In case that you need to use font sizes smaller than 16pt please switch to our font-family DB Screen Sans Digital Regular for better readability / accessibility.

+

Please find this rule and a lot of further information regarding and more information on typography: https://marketingportal.extranet.deutschebahn.com/marketingportal/Marke-und-Design/Basiselemente/Typografie/Fuer-digitale-Anwendungen

+ +
+ +
+
+ +
+ +

+ + + Fonts + + + + + +

+ + + +
+ +
+
+ +
+
+ + +

Headline 1

+ +

Headline 2

+ +

Headline 3

+ +

Headline 4

+

Primary font: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font italic: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+

Primary font bold: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

+ +
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors 1st Priority + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors 2nd Priority + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors Neutral + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+
+ +
+ +

+ + + Highlight Colors Positive + + + + +

+ + + +
+ +
+
+ +
+
+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+

Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

+
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.hbs b/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.hbs new file mode 100644 index 0000000000..ef7b700470 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.hbs @@ -0,0 +1,6 @@ +
+ {{ summary }} +

{{ details }}

+
diff --git a/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.markup-only.html b/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.markup-only.html new file mode 100644 index 0000000000..1606a94d1c --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.markup-only.html @@ -0,0 +1,6 @@ +
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
diff --git a/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.rendered.html b/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.rendered.html new file mode 100644 index 0000000000..a99debd48d --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.rendered.html @@ -0,0 +1,123 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.hbs b/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.hbs new file mode 100644 index 0000000000..1d497a8880 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.hbs @@ -0,0 +1,5 @@ +{{#each sizes }} + {{#if @first }}{{/if }} +

{{ label }}

+ {{> components-accordion size=size summary=@root.summary details=@root.details }} +{{/each }} diff --git a/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.markup-only.html b/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.markup-only.html new file mode 100644 index 0000000000..2f8eb876ab --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.markup-only.html @@ -0,0 +1,24 @@ + +

Small

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +

Regular (default, data-size attribute is optional)

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +

Large

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
diff --git a/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.rendered.html b/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.rendered.html new file mode 100644 index 0000000000..25ca07a043 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion-sizes/components-accordion-accordion-sizes.rendered.html @@ -0,0 +1,141 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Small

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +

Regular (default, data-size attribute is optional)

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +

Large

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.hbs b/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.hbs new file mode 100644 index 0000000000..ef7b700470 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.hbs @@ -0,0 +1,6 @@ +
+ {{ summary }} +

{{ details }}

+
diff --git a/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.markup-only.html b/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.markup-only.html new file mode 100644 index 0000000000..032ffcdfd1 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.markup-only.html @@ -0,0 +1,6 @@ +
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
diff --git a/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.rendered.html b/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.rendered.html new file mode 100644 index 0000000000..481aed0ac4 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion-accordion/components-accordion-accordion.rendered.html @@ -0,0 +1,123 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-accordion/index.html b/version/v2.18.3/patterns/components-accordion/index.html new file mode 100644 index 0000000000..970b9fb883 --- /dev/null +++ b/version/v2.18.3/patterns/components-accordion/index.html @@ -0,0 +1,318 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Accordion +

+ +
+

Variations/configurability

+

Size

+

SCSS (recommended)

+

Extend one of the size SCSS placeholders in case that you don't want the default (regular): %size-Small or %size-Large

+

HTML attribute

+

You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

+

Emphasis

+

The regular sized accordion could even also get enhanced to a higher emphasis.

+

SCSS (recommended)

+

Extend the related placeholder: %emphasis-High

+

HTML attribute

+

You could set the high emphasis via the data-emphasis attribute.

+

JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

+

In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

+ +
+ +
+
+ +
+ +

+ + + Accordion + + + + +

+ + + +
+ +
+
+ +
+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +
+ + + +
+
+ +
+ +

+ + + Accordion High Emphasis + + + + +

+ + + +
+ +
+
+ +
+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +
+ + + +
+
+ +
+ +

+ + + Accordion Sizes + + + + +

+ + + +
+ +
+
+ +
+ +

Small

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +

Regular (default, data-size attribute is optional)

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +

Large

+
+ Summary +

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+ +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.hbs b/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.hbs new file mode 100644 index 0000000000..9a62cd7f31 --- /dev/null +++ b/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.hbs @@ -0,0 +1,6 @@ +
+ + {{> elements-image src='../../images/db_logo.svg' alt='Deutsche Bahn Logo' styleModifier='is-logo' elementtiming='logo' }} + + {{#if sitename }}{{ sitename }}{{/if }} +
diff --git a/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.markup-only.html b/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.markup-only.html new file mode 100644 index 0000000000..0788c79afe --- /dev/null +++ b/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.markup-only.html @@ -0,0 +1,10 @@ +
+ + + + + + + UI Core +
diff --git a/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.rendered.html b/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.rendered.html new file mode 100644 index 0000000000..b85198605d --- /dev/null +++ b/version/v2.18.3/patterns/components-brand-_brand/components-brand-_brand.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + UI Core +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.hbs b/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.hbs new file mode 100644 index 0000000000..590e96e397 --- /dev/null +++ b/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.hbs @@ -0,0 +1,10 @@ + diff --git a/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.markup-only.html b/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.markup-only.html new file mode 100644 index 0000000000..5064f671dc --- /dev/null +++ b/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.markup-only.html @@ -0,0 +1,118 @@ + diff --git a/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.rendered.html b/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.rendered.html new file mode 100644 index 0000000000..69a15cf1d8 --- /dev/null +++ b/version/v2.18.3/patterns/components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.rendered.html @@ -0,0 +1,235 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-breadcrumb/index.html b/version/v2.18.3/patterns/components-breadcrumb/index.html new file mode 100644 index 0000000000..de3faa6a48 --- /dev/null +++ b/version/v2.18.3/patterns/components-breadcrumb/index.html @@ -0,0 +1,301 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ +

+ Breadcrumb +

+ +
+ +
+ +
+
+ +
+ +

+ + + Breadcrumb + + + + + +

+ + + +
+ +
+
+ +
+ + +
+ + + +
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.hbs b/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.hbs new file mode 100644 index 0000000000..5251c3d2f1 --- /dev/null +++ b/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.hbs @@ -0,0 +1,18 @@ +
  • + {{#if link }}{{/if }} +
    + {{#if_eq variant "banner" }} + + {{else}} + {{> elements-image src="../../icons/functional/images/navigation/db_ic_list_20.svg" alt="" }} + {{/if_eq }} +
    + +

    {{ title }}

    + {{#if text }}

    {{{ text }}}

    {{/if }} +
    +
    + {{#if link }}    {{/if }} +
    • diff --git a/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.markup-only.html b/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.markup-only.html new file mode 100644 index 0000000000..97294e224d --- /dev/null +++ b/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.markup-only.html @@ -0,0 +1,16 @@ +
  • + +
    + + + + +
    + +

    Title text

    + +
    +
    +     +
    • diff --git a/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.rendered.html b/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.rendered.html new file mode 100644 index 0000000000..8c1ba32c58 --- /dev/null +++ b/version/v2.18.3/patterns/components-cards-_card/components-cards-_card.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
  • + +
    + + + + +
    + +

    Title text

    + +
    +
    +     +
    • + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.hbs b/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.hbs new file mode 100644 index 0000000000..4399375d71 --- /dev/null +++ b/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.hbs @@ -0,0 +1,5 @@ +
      + {{#each cards }} + {{> components-card variant=../variant }} + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.markup-only.html b/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.markup-only.html new file mode 100644 index 0000000000..31defbb0c6 --- /dev/null +++ b/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.markup-only.html @@ -0,0 +1,58 @@ +
      +
    • + +
      + +
      + +

      Angebote 01

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 02

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 03

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 04

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    diff --git a/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.rendered.html b/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.rendered.html new file mode 100644 index 0000000000..dea3ae3ba5 --- /dev/null +++ b/version/v2.18.3/patterns/components-cards-cards-banner/components-cards-cards-banner.rendered.html @@ -0,0 +1,175 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      +
    • + +
      + +
      + +

      Angebote 01

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 02

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 03

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 04

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-cards/index.html b/version/v2.18.3/patterns/components-cards/index.html new file mode 100644 index 0000000000..12962a85b1 --- /dev/null +++ b/version/v2.18.3/patterns/components-cards/index.html @@ -0,0 +1,241 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Cards +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Cards Banner + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      + +
      + +

      Angebote 01

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 02

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 03

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 04

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-button-alignment-end.js b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-button-alignment-end.js new file mode 100644 index 0000000000..449849cbf9 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-button-alignment-end.js @@ -0,0 +1,72 @@ +// from: https://gist.github.com/samthor/babe9fad4a65625b301ba482dad284d1 +/** + * Updates the passed dialog to retain focus and restore it when the dialog is closed. Won't + * upgrade a dialog more than once. Supports IE11+ and is a no-op otherwise. + * @param {!HTMLDialogElement} dialog to upgrade + */ +var registerFocusRestoreDialog = (function() { + if (!window.WeakMap || !window.MutationObserver) { + return function() {}; + } + var registered = new WeakMap(); + + // store previous focused node centrally + var previousFocus = null; + document.addEventListener('focusout', function(ev) { + previousFocus = ev.target; + }, true); + + return function registerFocusRestoreDialog(dialog) { + if (dialog.localName !== 'dialog') { + throw new Error('Failed to upgrade focus on dialog: The element is not a dialog.'); + } + if (registered.has(dialog)) { return; } + registered.set(dialog, null); + + // replace showModal method directly, to save focus + var realShowModal = dialog.showModal; + dialog.showModal = function() { + var savedFocus = document.activeElement; + if (savedFocus === document || savedFocus === document.body) { + // some browsers read activeElement as body + savedFocus = previousFocus; + } + registered.set(dialog, savedFocus); + realShowModal.call(this); + }; + + // watch for 'open' change and clear saved + var mo = new MutationObserver(function() { + if (!dialog.hasAttribute('open')) { + registered.set(dialog, null); + } else { + // if open was cleared/set in the same frame, then the dialog will still be a modal (Y) + } + }); + mo.observe(dialog, {attributes: true, attributeFilter: ['open']}); + + // on close, try to focus saved, if possible + dialog.addEventListener('close', function(ev) { + if (dialog.hasAttribute('open')) { + return; // in native, this fires the frame later + } + var savedFocus = registered.get(dialog); + if (document.contains(savedFocus)) { + var wasFocus = document.activeElement; + savedFocus.focus(); + if (document.activeElement !== savedFocus) { + wasFocus.focus(); // restore focus, we couldn't focus saved + } + } + savedFocus = null; + }); + + // FIXME: If a modal dialog is readded to the page (either remove/add or .appendChild), it will + // be a non-modal. It will still have its 'close' handler called and try to focus on the saved + // element. + // + // These could basically be solved if 'close' yielded whether it was a modal or non-modal + // being closed. But it doesn't. It could also be solved by a permanent MutationObserver, as is + // done inside the polyfill. + } +}()); diff --git a/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.hbs b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.hbs new file mode 100644 index 0000000000..5f3681a9a7 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.hbs @@ -0,0 +1,17 @@ +{{#if opener }} +{{> elements-link anchorlink=id value='Dialog öffnen' }} +{{/if }} + +
    + + {{> elements-headline type='2' text='Modal' id='' }} + {{> elements-link styleModifier='is-close' href='#' value='Close' title='Close the dialog' }} +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    + + {{> elements-button variant="secondary" value='Secondary' }} + {{> elements-button variant="brand-primary" value='Primary' }} + +     diff --git a/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.markup-only.html b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.markup-only.html new file mode 100644 index 0000000000..addf63e6de --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.markup-only.html @@ -0,0 +1,72 @@ +Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     diff --git a/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.rendered.html b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.rendered.html new file mode 100644 index 0000000000..dd98b22a36 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.rendered.html @@ -0,0 +1,189 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.hbs b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.hbs new file mode 100644 index 0000000000..5f3681a9a7 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.hbs @@ -0,0 +1,17 @@ +{{#if opener }} +{{> elements-link anchorlink=id value='Dialog öffnen' }} +{{/if }} + +
    + + {{> elements-headline type='2' text='Modal' id='' }} + {{> elements-link styleModifier='is-close' href='#' value='Close' title='Close the dialog' }} +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    + + {{> elements-button variant="secondary" value='Secondary' }} + {{> elements-button variant="brand-primary" value='Primary' }} + +     diff --git a/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.markup-only.html b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.markup-only.html new file mode 100644 index 0000000000..5988f114fb --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.markup-only.html @@ -0,0 +1,72 @@ +Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     diff --git a/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.rendered.html b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.rendered.html new file mode 100644 index 0000000000..595b1ffe61 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog-dialog.rendered.html @@ -0,0 +1,189 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-dialog-dialog/components-dialog.js b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog.js new file mode 100644 index 0000000000..d57bd88922 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog-dialog/components-dialog.js @@ -0,0 +1,88 @@ +/* global dialogPolyfill */ + +(function () { + // Bind the click events for links (that we'll check for later on) + document.addEventListener('click', (event) => { + // Determine whether the target of the current link is a dialog + if ( + event.target && + event.target.tagName && + event.target.tagName.toLowerCase() === 'a' && + event.target.attributes.href.value.slice(0, 1) === '#' + ) { + const link = event.target; + let type, dialog; + + // Determine whether the link is included within a dialog and is the close link + if ( + link.attributes.href.value === '#' && + link.closest('dialog') && + link.matches('.elm-link.is-close') + ) { + type = 'close'; + dialog = link.closest('dialog'); + } else if ( + link.hash && + document.querySelector(link.hash) && + document.querySelector(link.hash).tagName.toLowerCase() === + 'dialog' + ) { + type = 'dialog'; + dialog = document.querySelector(link.hash); + } else { + return; + } + + // Check for whether the dialog has been registered even already + if (type === 'dialog') { + if (!dialog.dataset.polyfilled) { + // Initially registering the dialog + dialogPolyfill.registerDialog(dialog); + + dialog.dataset.polyfilled = true; + } + + dialog.showModal(); + } else { + dialog.close(); + } + + // Prevent the default behaviour of the link + event.preventDefault(); + } + }); +})(); +var mo = new MutationObserver(function() { + if (!dialog.hasAttribute('open')) { + registered.set(dialog, null); + } else { + // if open was cleared/set in the same frame, then the dialog will still be a modal (Y) + } + }); + mo.observe(dialog, {attributes: true, attributeFilter: ['open']}); + + // on close, try to focus saved, if possible + dialog.addEventListener('close', function(ev) { + if (dialog.hasAttribute('open')) { + return; // in native, this fires the frame later + } + var savedFocus = registered.get(dialog); + if (document.contains(savedFocus)) { + var wasFocus = document.activeElement; + savedFocus.focus(); + if (document.activeElement !== savedFocus) { + wasFocus.focus(); // restore focus, we couldn't focus saved + } + } + savedFocus = null; + }); + + // FIXME: If a modal dialog is readded to the page (either remove/add or .appendChild), it will + // be a non-modal. It will still have its 'close' handler called and try to focus on the saved + // element. + // + // These could basically be solved if 'close' yielded whether it was a modal or non-modal + // being closed. But it doesn't. It could also be solved by a permanent MutationObserver, as is + // done inside the polyfill. + } +}()); diff --git a/version/v2.18.3/patterns/components-dialog/index.html b/version/v2.18.3/patterns/components-dialog/index.html new file mode 100644 index 0000000000..bede035233 --- /dev/null +++ b/version/v2.18.3/patterns/components-dialog/index.html @@ -0,0 +1,371 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Dialog +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Dialog + + + + + +

    + + + +
    + +
    +
    + +
    + Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + +
    + + + +
    +
    + +
    + +

    + + + Dialog Button Alignment End + + + + + +

    + + + +
    + +
    +
    + +
    + Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.hbs b/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.hbs new file mode 100644 index 0000000000..df02cbdd3a --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.hbs @@ -0,0 +1 @@ +{{> components-overflow-menu patternName="cmp-dropdown" entry01="Profileinstellungen" entry02="Logout" }} diff --git a/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.markup-only.html b/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.markup-only.html new file mode 100644 index 0000000000..38d3e1bac1 --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.markup-only.html @@ -0,0 +1,32 @@ + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    diff --git a/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.rendered.html b/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.rendered.html new file mode 100644 index 0000000000..23cb7e5335 --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.rendered.html @@ -0,0 +1,149 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.hbs b/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.hbs new file mode 100644 index 0000000000..df02cbdd3a --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.hbs @@ -0,0 +1 @@ +{{> components-overflow-menu patternName="cmp-dropdown" entry01="Profileinstellungen" entry02="Logout" }} diff --git a/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.markup-only.html b/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.markup-only.html new file mode 100644 index 0000000000..d465285461 --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.markup-only.html @@ -0,0 +1,32 @@ + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    diff --git a/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.rendered.html b/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.rendered.html new file mode 100644 index 0000000000..b691bb2781 --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown-dropdown/components-dropdown-dropdown.rendered.html @@ -0,0 +1,149 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-dropdown/index.html b/version/v2.18.3/patterns/components-dropdown/index.html new file mode 100644 index 0000000000..80fd3c3e1a --- /dev/null +++ b/version/v2.18.3/patterns/components-dropdown/index.html @@ -0,0 +1,298 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Dropdown +

    + +
    +

    This component is mainly meant to get used within the header section. If you're looking for a similar one within the content section, please refer to the overflow menu component.

    +

    Variation to display the overflow menu on the opposite side

    +

    This component expected to be placed at the end of the header regularly and thatfor opens the overlay to its opposite side (to the right on left-to-right reading direction). If you'd like to change this behaviour e.g. to implement some kind of a collision mechanism (most likely with JavaScript) and flip the overlays orientation to the opposite side, you could use the following attribute to configure this orientation change, compare to the examples below as well:

    +
    data-horizontal-position="opposite"
+
    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Dropdown + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Dropdown (within the header area) / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.hbs b/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.hbs new file mode 100644 index 0000000000..466b75513c --- /dev/null +++ b/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.hbs @@ -0,0 +1,9 @@ +
    +
    + Please choose a flavour + {{> elements-radio label="Vanilla" value="vanilla" id="input-vanilla" name="flavour[]" }}
    + {{> elements-radio label="Strawberry" value="strawberry" id="input-strawberry" name="flavour[]" }}
    + {{> elements-radio label="Chocolate" value="chocolate" id="input-chocolate" name="flavour[]" }} +
    + {{> elements-button buttontype="submit" value="Order your icecream" }} +
    diff --git a/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.markup-only.html b/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.markup-only.html new file mode 100644 index 0000000000..9f9968122a --- /dev/null +++ b/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.markup-only.html @@ -0,0 +1,52 @@ +
    +
    + Please choose a flavour + + +
    + + +
    + + +
    + +
    diff --git a/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.rendered.html b/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.rendered.html new file mode 100644 index 0000000000..c811cea572 --- /dev/null +++ b/version/v2.18.3/patterns/components-form-example-form/components-form-example-form.rendered.html @@ -0,0 +1,169 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + Please choose a flavour + + +
    + + +
    + + +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-form/index.html b/version/v2.18.3/patterns/components-form/index.html new file mode 100644 index 0000000000..d3c9c4d049 --- /dev/null +++ b/version/v2.18.3/patterns/components-form/index.html @@ -0,0 +1,258 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Form +

    + +
    +

    General information

    +

    Forms in general are being built out of elements like form, input, textarea, button and fieldset.

    +

    For more information reach out to https://developer.mozilla.org/en-US/docs/Learn/Forms

    +

    Best practices

    +

    Best practice, research insights and examples: https://gerireid.com/forms.html

    +

    Form validation

    +

    It's best to use the built-in and standard form validation, as these are standards based API implementations, that are as well providing compatible and consistent states both for CSS and JS:

    +
      +
    • Interoperability
      • +
    • semantic (machine readable/understandable) state, even also keep a11y in mind
      • +
    • Single source of truth regarding the form (elements) state within the browser itself
      • +
    • Built-in localized validation messages
      • +
    +

    Additionally this way you're following the principles of Progressive Enhancement - and in other words, any JavaScript only solution doesn't provide a graceful degradation and puts that whole functionality to the weakest layer in the stack even only.

    +

    Nevertheless additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute on the elements input, radio, select and textarea. +We can't toggle any given/static attribute in the DB UI Core product itself, as we don't want to use JavaScript in this basic product. As you'd also need to add individual error messages, please find some inspiration on the necessary HTML code implementation e.g. on http://mars.dequecloud.com/demo/form-alert3.htm

    +

    Please find some more informations on the following pages:

    + +

    Accessibility

    +

    Forms can be tricky, so read through the W3C forms WAI tutorials for some guidance around how to implement accessibility successfully.

    + +
    + +
    +
    + +
    + +

    + + + Example Form + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Please choose a flavour + + +
    + + +
    + + +
    + +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.hbs b/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.hbs new file mode 100644 index 0000000000..d10b088e60 --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.hbs @@ -0,0 +1,24 @@ +{{#if spa}}{{/if }} +
      + + {{#unless spa}} + {{> elements-link href='#' hreflang='en' value='EN' title='English language' rel='alternate' }} + {{else}} + {{> elements-button type='button' value='EN' title='English language' variant='tertiary-plain' }} + {{/unless }} + + + {{#unless spa}} + {{> elements-link href='#' hreflang='de' value='DE' title='Deutsche Sprache' rel='bookmark' }} + {{else}} + {{> elements-button type='button' value='DE' title='Deutsche Sprache' variant='tertiary-plain' }} + {{/unless }} + + + {{#unless spa}} + {{> elements-link href='#' hreflang='fr' value='FR' title='Langue française' rel='alternate' }} + {{else}} + {{> elements-button type='button' value='FR' title='Langue française' variant='tertiary-plain' }} + {{/unless }} + +
    diff --git a/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.markup-only.html b/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.markup-only.html new file mode 100644 index 0000000000..f4937e81c6 --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.markup-only.html @@ -0,0 +1,45 @@ + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    diff --git a/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.rendered.html b/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.rendered.html new file mode 100644 index 0000000000..2289b39280 --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.rendered.html @@ -0,0 +1,162 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.hbs b/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.hbs new file mode 100644 index 0000000000..d10b088e60 --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.hbs @@ -0,0 +1,24 @@ +{{#if spa}}{{/if }} +
      + + {{#unless spa}} + {{> elements-link href='#' hreflang='en' value='EN' title='English language' rel='alternate' }} + {{else}} + {{> elements-button type='button' value='EN' title='English language' variant='tertiary-plain' }} + {{/unless }} + + + {{#unless spa}} + {{> elements-link href='#' hreflang='de' value='DE' title='Deutsche Sprache' rel='bookmark' }} + {{else}} + {{> elements-button type='button' value='DE' title='Deutsche Sprache' variant='tertiary-plain' }} + {{/unless }} + + + {{#unless spa}} + {{> elements-link href='#' hreflang='fr' value='FR' title='Langue française' rel='alternate' }} + {{else}} + {{> elements-button type='button' value='FR' title='Langue française' variant='tertiary-plain' }} + {{/unless }} + +
    diff --git a/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.markup-only.html b/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.markup-only.html new file mode 100644 index 0000000000..3beedfc0ee --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.markup-only.html @@ -0,0 +1,63 @@ + + diff --git a/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.rendered.html b/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.rendered.html new file mode 100644 index 0000000000..2333597dfe --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher-language-switcher/components-language-switcher-language-switcher.rendered.html @@ -0,0 +1,180 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-language-switcher/index.html b/version/v2.18.3/patterns/components-language-switcher/index.html new file mode 100644 index 0000000000..0d557b1aff --- /dev/null +++ b/version/v2.18.3/patterns/components-language-switcher/index.html @@ -0,0 +1,339 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Language Switcher +

    + +
    +

    You could either use the language switcher component with hyperlinks, which would be the recommended way, to link to another language based page, which is addressable by a different URL.

    +

    The other way (especially for Single Page Applications) would be to use <button type="button"> elements, that have some JavaScript events attached to them to handle the switch directly. Please keep in mind to announce a change of contents e.g. to screenreaders in this case.

    +

    In both cases there's a slightly different HTML approach that you could inspect within the different examples below.

    +

    Please keep in mind that the styling is optimized to look good included within the header section of the page and doesn't "shine" included in here.

    + +
    + +
    +
    + +
    + +

    + + + Language switcher + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Language switcher with buttons + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.hbs b/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.hbs new file mode 100644 index 0000000000..621f79b4f1 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.hbs @@ -0,0 +1,6 @@ +
    + {{!-- {{ type }} --}} + {{#if type}}{{ type }}: {{/if }}{{ @root/excerpt.slim }} +
    diff --git a/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.markup-only.html b/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.markup-only.html new file mode 100644 index 0000000000..aa70bfba71 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.markup-only.html @@ -0,0 +1,5 @@ +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    diff --git a/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.rendered.html b/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.rendered.html new file mode 100644 index 0000000000..c955a11bab --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-_notification/components-notifications-_notification.rendered.html @@ -0,0 +1,122 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.hbs b/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.hbs new file mode 100644 index 0000000000..eb5c6a5413 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.hbs @@ -0,0 +1,15 @@ +
    + {{#each notifications}} + {{#if_eq live 'polite' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    + +
    + {{#each notifications}} + {{#if_eq live 'assertive' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.markup-only.html b/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.markup-only.html new file mode 100644 index 0000000000..b948fdca67 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.markup-only.html @@ -0,0 +1,10 @@ +
    +
    + +
    + +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.rendered.html b/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.rendered.html new file mode 100644 index 0000000000..1e69118f1b --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.hbs b/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.hbs new file mode 100644 index 0000000000..eb5c6a5413 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.hbs @@ -0,0 +1,15 @@ +
    + {{#each notifications}} + {{#if_eq live 'polite' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    + +
    + {{#each notifications}} + {{#if_eq live 'assertive' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.markup-only.html b/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.markup-only.html new file mode 100644 index 0000000000..b6b09bc351 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.markup-only.html @@ -0,0 +1,10 @@ +
    +
    + +
    + +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.rendered.html b/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.rendered.html new file mode 100644 index 0000000000..885e00a754 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.hbs b/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.hbs new file mode 100644 index 0000000000..eb5c6a5413 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.hbs @@ -0,0 +1,15 @@ +
    + {{#each notifications}} + {{#if_eq live 'polite' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    + +
    + {{#each notifications}} + {{#if_eq live 'assertive' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.markup-only.html b/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.markup-only.html new file mode 100644 index 0000000000..477f5066fd --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.markup-only.html @@ -0,0 +1,30 @@ +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.rendered.html b/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.rendered.html new file mode 100644 index 0000000000..e97a13fb53 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-hovering/components-notifications-notifications-hovering.rendered.html @@ -0,0 +1,147 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.hbs b/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.hbs new file mode 100644 index 0000000000..eb5c6a5413 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.hbs @@ -0,0 +1,15 @@ +
    + {{#each notifications}} + {{#if_eq live 'polite' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    + +
    + {{#each notifications}} + {{#if_eq live 'assertive' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.markup-only.html b/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.markup-only.html new file mode 100644 index 0000000000..842d401bb3 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.markup-only.html @@ -0,0 +1,30 @@ +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.rendered.html b/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.rendered.html new file mode 100644 index 0000000000..1c992f5a26 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications-variants/components-notifications-notifications-variants.rendered.html @@ -0,0 +1,147 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.hbs b/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.hbs new file mode 100644 index 0000000000..eb5c6a5413 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.hbs @@ -0,0 +1,15 @@ +
    + {{#each notifications}} + {{#if_eq live 'polite' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    + +
    + {{#each notifications}} + {{#if_eq live 'assertive' }} + {{> components-notification type=type role=role icon-before=icon-before icon-after=icon-after }} + {{/if_eq }} + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.markup-only.html b/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.markup-only.html new file mode 100644 index 0000000000..f4734cec41 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.markup-only.html @@ -0,0 +1,5 @@ +
    +
    + +
    +
    diff --git a/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.rendered.html b/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.rendered.html new file mode 100644 index 0000000000..a53e42795d --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications-notifications/components-notifications-notifications.rendered.html @@ -0,0 +1,122 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-notifications/index.html b/version/v2.18.3/patterns/components-notifications/index.html new file mode 100644 index 0000000000..d3d2e102e4 --- /dev/null +++ b/version/v2.18.3/patterns/components-notifications/index.html @@ -0,0 +1,458 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Notifications +

    + +
    +

    Best practices

    +

    Best practice, research insights and examples: https://gerireid.com/forms.html#notifications

    +

    Accessibility

    +

    Notifications are intended to be small interruptions to your visitors or users, so to help those with screen readers and similar assistive technologies, you should wrap your notifications in an aria-live region. Changes to live regions (such as injecting/updating a notification component) are automatically announced by screen readers without needing to move the user’s focus or otherwise interrupt the user.

    +

    Additionally, if you'd like to update existing notifications incrementally, include aria-atomic="true" to ensure that the entire notification is always announced as a single (atomic) unit, rather than announcing what was changed (which could lead to problems if you only update part of the notification’s content, or if displaying the same notification content at a later point in time). It's still recommended to remove and add cmp-notification components as a whole within the section.

    +

    Note that the live region needs to be present in the markup before the notification is generated or updated. If you dynamically generate both at the same time and inject them into the page, they will generally not be announced by assistive technologies.

    +

    You also need to adapt the role and aria-live level depending on the content. If it’s an important message like an error, use role="alert" and aria-live="assertive", otherwise use role="status"and aria-live="polite" attributes.

    +

    Adapted from https://getbootstrap.com/docs/4.3/components/toasts/

    +

    And we're not using aria-relevant="additions", as the default behaviour is even already what we expect with the default (additions text), compare to e.g. https://medium.com/dev-channel/why-authors-should-avoid-aria-relevant-5d3164fab1e3 and https://github.com/w3c/aria/issues/712#issuecomment-529848465

    +

    Live regions

    +
    +

    Live regions are perceivable regions of a web page that are typically updated as a result of an external event when user focus may be elsewhere. These regions are not always updated as a result of a user interaction. This practice has become commonplace with the growing use of Ajax. Examples of live regions include a chat log, stock ticker, or a sport scoring section that updates periodically to reflect game statistics. Since these asynchronous areas are expected to update outside the user's area of focus, assistive technologies such as screen readers have either been unaware of their existence or unable to process them for the user. WAI-ARIA has provided a collection of properties that allow the author to identify these live regions and process them: aria-live, aria-relevant, aria-atomic, and aria-busy.

    +
    +

    Source: https://www.w3.org/TR/wai-aria/#terms

    +

    Conveying meaning to assistive technologies

    +
    +

    Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers. Ensure that information denoted by the color is either obvious from the content itself (e.g. the visible text), or is included through alternative means, such as additional visibly hidden text.

    +
    +

    Source: https://getbootstrap.com/docs/4.3/components/alerts/

    + +
    + +
    +
    + +
    + +

    + + + Notifications + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications Variants + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications Hovering + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications - Leading Icon + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications - Trailing Icon + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    + +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.hbs b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.hbs new file mode 100644 index 0000000000..43de0cc80d --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.hbs @@ -0,0 +1,13 @@ +{{#if linkEntries }}{{/if }} + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.markup-only.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.markup-only.html new file mode 100644 index 0000000000..455cf7e1d6 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.markup-only.html @@ -0,0 +1,44 @@ + + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.rendered.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.rendered.html new file mode 100644 index 0000000000..69e5adbd4d --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.rendered.html @@ -0,0 +1,161 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.hbs b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.hbs new file mode 100644 index 0000000000..43de0cc80d --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.hbs @@ -0,0 +1,13 @@ +{{#if linkEntries }}{{/if }} + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.markup-only.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.markup-only.html new file mode 100644 index 0000000000..e619e193e7 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.markup-only.html @@ -0,0 +1,44 @@ + + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.rendered.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.rendered.html new file mode 100644 index 0000000000..cc37578221 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.rendered.html @@ -0,0 +1,161 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.hbs b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.hbs new file mode 100644 index 0000000000..43de0cc80d --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.hbs @@ -0,0 +1,13 @@ +{{#if linkEntries }}{{/if }} + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.markup-only.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.markup-only.html new file mode 100644 index 0000000000..24ae34ada9 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.markup-only.html @@ -0,0 +1,32 @@ + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.rendered.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.rendered.html new file mode 100644 index 0000000000..7d85a05c09 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.rendered.html @@ -0,0 +1,149 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.hbs b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.hbs new file mode 100644 index 0000000000..43de0cc80d --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.hbs @@ -0,0 +1,13 @@ +{{#if linkEntries }}{{/if }} + diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.markup-only.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.markup-only.html new file mode 100644 index 0000000000..0cadb4bba5 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.markup-only.html @@ -0,0 +1,32 @@ + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    diff --git a/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.rendered.html b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.rendered.html new file mode 100644 index 0000000000..14193626c4 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.rendered.html @@ -0,0 +1,149 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-overflow-menu/index.html b/version/v2.18.3/patterns/components-overflow-menu/index.html new file mode 100644 index 0000000000..e88ecd3694 --- /dev/null +++ b/version/v2.18.3/patterns/components-overflow-menu/index.html @@ -0,0 +1,473 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Overflow Menu +

    + +
    +

    Variation to display the overflow menu on the opposite side

    +

    If you're either using this component at the very end of a main content part that will most likely always get displayed at the opposite viewport border or you'd like to implement some kind of a collision mechanism (most likely with JavaScript) and flip the overlays orientation to the opposite side (from regularly left to right positioned on left-to-right reading direction), you could use the following attribute to configure this orientation change, compare to the examples below as well:

    +
    data-horizontal-position="opposite"
+
    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Overflow menu + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu - Navigation / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.hbs b/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.hbs new file mode 100644 index 0000000000..0381aa46a0 --- /dev/null +++ b/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.hbs @@ -0,0 +1,13 @@ +{{! TODO: evaluate on the correct role and aria-label in here - there's a duplication currently with both label and labelledby (prefered); and probably we won't need a nav element }} + diff --git a/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.markup-only.html b/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.markup-only.html new file mode 100644 index 0000000000..5662b38564 --- /dev/null +++ b/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.markup-only.html @@ -0,0 +1,103 @@ + diff --git a/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.rendered.html b/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.rendered.html new file mode 100644 index 0000000000..83b47e4101 --- /dev/null +++ b/version/v2.18.3/patterns/components-pagination-pagination/components-pagination-pagination.rendered.html @@ -0,0 +1,220 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-pagination/index.html b/version/v2.18.3/patterns/components-pagination/index.html new file mode 100644 index 0000000000..3f24657405 --- /dev/null +++ b/version/v2.18.3/patterns/components-pagination/index.html @@ -0,0 +1,286 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Pagination +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Pagination + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.hbs b/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.hbs new file mode 100644 index 0000000000..b50900c897 --- /dev/null +++ b/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.hbs @@ -0,0 +1,10 @@ + diff --git a/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.markup-only.html b/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.markup-only.html new file mode 100644 index 0000000000..a82f1e82ca --- /dev/null +++ b/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.markup-only.html @@ -0,0 +1,118 @@ + diff --git a/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.rendered.html b/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.rendered.html new file mode 100644 index 0000000000..78b13d982d --- /dev/null +++ b/version/v2.18.3/patterns/components-sidenavi-sidenavi/components-sidenavi-sidenavi.rendered.html @@ -0,0 +1,235 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-sidenavi/index.html b/version/v2.18.3/patterns/components-sidenavi/index.html new file mode 100644 index 0000000000..d109e099ed --- /dev/null +++ b/version/v2.18.3/patterns/components-sidenavi/index.html @@ -0,0 +1,303 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Sidenavi +

    + +
    +

    Icons

    +

    The sidenavi pattern includes some general icons defined for some general rel values. Please feel free to define further by yourself depending on your needs, either within your SCSS code (recommended) or via attributes.

    + +
    + +
    +
    + +
    + +

    + + + Sidenavi + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.hbs b/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.hbs new file mode 100644 index 0000000000..5fbeabc5ac --- /dev/null +++ b/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.hbs @@ -0,0 +1,5 @@ +{{! TODO: Weitere Komponenten korrekt inkludieren }} + diff --git a/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.markup-only.html b/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.markup-only.html new file mode 100644 index 0000000000..816ef744a5 --- /dev/null +++ b/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.markup-only.html @@ -0,0 +1,35 @@ + diff --git a/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.rendered.html b/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.rendered.html new file mode 100644 index 0000000000..7edac71a63 --- /dev/null +++ b/version/v2.18.3/patterns/components-sitesearch-_sitesearch/components-sitesearch-_sitesearch.rendered.html @@ -0,0 +1,152 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.hbs b/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.hbs new file mode 100644 index 0000000000..18348c395f --- /dev/null +++ b/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.hbs @@ -0,0 +1,12 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +
    + + {{#each tabs }} + + +
    + {{ content }} +
    + {{/each }} +
    diff --git a/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.markup-only.html b/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.markup-only.html new file mode 100644 index 0000000000..238b98c2dc --- /dev/null +++ b/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.markup-only.html @@ -0,0 +1,29 @@ +
    + + + +
    + Content 01 +
    + + +
    + Content 02 +
    + + +
    + Content 03 +
    + + +
    + Content 04 +
    + + +
    + Content 05 +
    +
    diff --git a/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.rendered.html b/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.rendered.html new file mode 100644 index 0000000000..e9c68124fb --- /dev/null +++ b/version/v2.18.3/patterns/components-tab-bar-tab-bar/components-tab-bar-tab-bar.rendered.html @@ -0,0 +1,146 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    + Content 01 +
    + + +
    + Content 02 +
    + + +
    + Content 03 +
    + + +
    + Content 04 +
    + + +
    + Content 05 +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-tab-bar/index.html b/version/v2.18.3/patterns/components-tab-bar/index.html new file mode 100644 index 0000000000..997a7c3487 --- /dev/null +++ b/version/v2.18.3/patterns/components-tab-bar/index.html @@ -0,0 +1,213 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Tab Bar +

    + +
    +

    Accessibility

    +

    This pattern has been tested and approved regarding accessibility.

    + +
    + +
    +
    + +
    + +

    + + + Tab Bar + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + +
    + Content 01 +
    + + +
    + Content 02 +
    + + +
    + Content 03 +
    + + +
    + Content 04 +
    + + +
    + Content 05 +
    +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.hbs b/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.hbs new file mode 100644 index 0000000000..a358eb4732 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.hbs @@ -0,0 +1,6 @@ +
    +{{#each alignments }} +
    {{ align }} / {{ vertical-align }}:
    +
    {{> components-table cells=../cells }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.markup-only.html b/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.markup-only.html new file mode 100644 index 0000000000..4d0718edda --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.markup-only.html @@ -0,0 +1,106 @@ +
    +
    center / middle:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    right / bottom:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    diff --git a/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.rendered.html b/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.rendered.html new file mode 100644 index 0000000000..6f3eb9a4c3 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-alignments/components-table-table-alignments.rendered.html @@ -0,0 +1,223 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    center / middle:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    right / bottom:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.hbs b/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.markup-only.html b/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.markup-only.html new file mode 100644 index 0000000000..a00f5d4c95 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.rendered.html b/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.rendered.html new file mode 100644 index 0000000000..8537e776c5 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-border-around/components-table-table-border-around.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.hbs b/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.markup-only.html b/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.markup-only.html new file mode 100644 index 0000000000..8e90781e7a --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.rendered.html b/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.rendered.html new file mode 100644 index 0000000000..8ec8756979 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-border-horizontal/components-table-table-border-horizontal.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.hbs b/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.hbs new file mode 100644 index 0000000000..97fcb4eeca --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.hbs @@ -0,0 +1,6 @@ +
    +{{#each densities }} +
    {{ density }}:
    +
    {{> components-table cells=../cells }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.markup-only.html b/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.markup-only.html new file mode 100644 index 0000000000..fa43de25f5 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.markup-only.html @@ -0,0 +1,158 @@ +
    +
    small:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    regular:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    large:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    diff --git a/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.rendered.html b/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.rendered.html new file mode 100644 index 0000000000..65e32b366e --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-density/components-table-table-density.rendered.html @@ -0,0 +1,275 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    small:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    regular:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    large:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.hbs b/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.markup-only.html b/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.markup-only.html new file mode 100644 index 0000000000..d0c48004aa --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.rendered.html b/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.rendered.html new file mode 100644 index 0000000000..ab387a88a9 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-font-size/components-table-table-font-size.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.hbs b/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.markup-only.html b/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.markup-only.html new file mode 100644 index 0000000000..1d73933cec --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.rendered.html b/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.rendered.html new file mode 100644 index 0000000000..b47356d76e --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-icons/components-table-table-icons.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.hbs b/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.markup-only.html b/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.markup-only.html new file mode 100644 index 0000000000..1c412ab46c --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.markup-only.html @@ -0,0 +1,210 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 02 - 01Value 02 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 03 - 01Value 03 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 04 - 01Value 04 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 05 - 01Value 05 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    diff --git a/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.rendered.html b/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.rendered.html new file mode 100644 index 0000000000..67fd0e6498 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-overflow-menu/components-table-table-overflow-menu.rendered.html @@ -0,0 +1,327 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 02 - 01Value 02 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 03 - 01Value 03 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 04 - 01Value 04 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 05 - 01Value 05 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.hbs b/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.markup-only.html b/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.markup-only.html new file mode 100644 index 0000000000..20da9cd4ec --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    Column headerThe table header 01The table header 02
    table headerValue 01 - 01Value 01 - 02
    table headerValue 02 - 01Value 02 - 02
    table headerValue 03 - 01Value 03 - 02
    table headerValue 04 - 01Value 04 - 02
    table headerValue 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.rendered.html b/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.rendered.html new file mode 100644 index 0000000000..b6097d7981 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-row-title/components-table-table-row-title.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    Column headerThe table header 01The table header 02
    table headerValue 01 - 01Value 01 - 02
    table headerValue 02 - 01Value 02 - 02
    table headerValue 03 - 01Value 03 - 02
    table headerValue 04 - 01Value 04 - 02
    table headerValue 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.hbs b/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.markup-only.html b/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.markup-only.html new file mode 100644 index 0000000000..7987f1acf4 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.rendered.html b/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.rendered.html new file mode 100644 index 0000000000..89eb11a780 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-rows-zebra/components-table-table-rows-zebra.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.hbs b/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.markup-only.html b/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.markup-only.html new file mode 100644 index 0000000000..33197f93dc --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.markup-only.html @@ -0,0 +1,350 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.rendered.html b/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.rendered.html new file mode 100644 index 0000000000..5031914a6b --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table-sticky-header/components-table-table-sticky-header.rendered.html @@ -0,0 +1,467 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table-table/components-table-table.hbs b/version/v2.18.3/patterns/components-table-table/components-table-table.hbs new file mode 100644 index 0000000000..933bec496f --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table/components-table-table.hbs @@ -0,0 +1,29 @@ +{{! TODO: evaluate on the correct role and aria-label in here }} +{{#if font-size }}{{/if }} + + + + + {{#if rowtitle }}{{/if }} + + + + + + {{#each cells }} + + {{#if ../rowtitle }}{{/if }} + {{{ text01 }}} + + {{#if ../overflowMenu }}{{/if }} + + {{/each }} + +
    + Table title +
    Column headerThe table header 01The table header 02
    table header{{{ text02 }}}{{> components-overflow-menu entry01="Edit" entry02="Delete" }}
    diff --git a/version/v2.18.3/patterns/components-table-table/components-table-table.markup-only.html b/version/v2.18.3/patterns/components-table-table/components-table-table.markup-only.html new file mode 100644 index 0000000000..f37db65ffd --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table/components-table-table.markup-only.html @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    diff --git a/version/v2.18.3/patterns/components-table-table/components-table-table.rendered.html b/version/v2.18.3/patterns/components-table-table/components-table-table.rendered.html new file mode 100644 index 0000000000..f7ff064383 --- /dev/null +++ b/version/v2.18.3/patterns/components-table-table/components-table-table.rendered.html @@ -0,0 +1,167 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components-table/index.html b/version/v2.18.3/patterns/components-table/index.html new file mode 100644 index 0000000000..43fba26caa --- /dev/null +++ b/version/v2.18.3/patterns/components-table/index.html @@ -0,0 +1,1797 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Table +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Table + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - alignment + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    center / middle:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    right / bottom:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table - border around cells + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - border horizontal + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - density + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    small:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    regular:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    large:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table - font size + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - icons + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table Overflow Menu + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 02 - 01Value 02 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 03 - 01Value 03 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 04 - 01Value 04 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 05 - 01Value 05 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table Row Title + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    Column headerThe table header 01The table header 02
    table headerValue 01 - 01Value 01 - 02
    table headerValue 02 - 01Value 02 - 02
    table headerValue 03 - 01Value 03 - 02
    table headerValue 04 - 01Value 04 - 02
    table headerValue 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - row zebra styling + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - sticky header + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/components/index.html b/version/v2.18.3/patterns/components/index.html new file mode 100644 index 0000000000..9e97e17ac5 --- /dev/null +++ b/version/v2.18.3/patterns/components/index.html @@ -0,0 +1,4120 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Accordion +

    + +
    +

    Variations/configurability

    +

    Size

    +

    SCSS (recommended)

    +

    Extend one of the size SCSS placeholders in case that you don't want the default (regular): %size-Small or %size-Large

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    +

    Emphasis

    +

    The regular sized accordion could even also get enhanced to a higher emphasis.

    +

    SCSS (recommended)

    +

    Extend the related placeholder: %emphasis-High

    +

    HTML attribute

    +

    You could set the high emphasis via the data-emphasis attribute.

    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Accordion + + + + +

    + + + +
    + +
    +
    + +
    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Accordion High Emphasis + + + + +

    + + + +
    + +
    +
    + +
    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Accordion Sizes + + + + +

    + + + +
    + +
    +
    + +
    + +

    Small

    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +

    Regular (default, data-size attribute is optional)

    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +

    Large

    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +
    + + + +
    +
    + +

    + Breadcrumb +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Breadcrumb + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +

    + Cards +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Cards Banner + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      + +
      + +

      Angebote 01

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 02

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 03

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 04

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    + +
    + + + +
    +
    + +

    + Dialog +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Dialog + + + + + +

    + + + +
    + +
    +
    + +
    + Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + +
    + + + +
    +
    + +
    + +

    + + + Dialog Button Alignment End + + + + + +

    + + + +
    + +
    +
    + +
    + Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + +
    + + + +
    +
    + +

    + Dropdown +

    + +
    +

    This component is mainly meant to get used within the header section. If you're looking for a similar one within the content section, please refer to the overflow menu component.

    +

    Variation to display the overflow menu on the opposite side

    +

    This component expected to be placed at the end of the header regularly and thatfor opens the overlay to its opposite side (to the right on left-to-right reading direction). If you'd like to change this behaviour e.g. to implement some kind of a collision mechanism (most likely with JavaScript) and flip the overlays orientation to the opposite side, you could use the following attribute to configure this orientation change, compare to the examples below as well:

    +
    data-horizontal-position="opposite"
+
    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Dropdown + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Dropdown (within the header area) / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +

    + Form +

    + +
    +

    General information

    +

    Forms in general are being built out of elements like form, input, textarea, button and fieldset.

    +

    For more information reach out to https://developer.mozilla.org/en-US/docs/Learn/Forms

    +

    Best practices

    +

    Best practice, research insights and examples: https://gerireid.com/forms.html

    +

    Form validation

    +

    It's best to use the built-in and standard form validation, as these are standards based API implementations, that are as well providing compatible and consistent states both for CSS and JS:

    +
      +
    • Interoperability
      • +
    • semantic (machine readable/understandable) state, even also keep a11y in mind
      • +
    • Single source of truth regarding the form (elements) state within the browser itself
      • +
    • Built-in localized validation messages
      • +
    +

    Additionally this way you're following the principles of Progressive Enhancement - and in other words, any JavaScript only solution doesn't provide a graceful degradation and puts that whole functionality to the weakest layer in the stack even only.

    +

    Nevertheless additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute on the elements input, radio, select and textarea. +We can't toggle any given/static attribute in the DB UI Core product itself, as we don't want to use JavaScript in this basic product. As you'd also need to add individual error messages, please find some inspiration on the necessary HTML code implementation e.g. on http://mars.dequecloud.com/demo/form-alert3.htm

    +

    Please find some more informations on the following pages:

    + +

    Accessibility

    +

    Forms can be tricky, so read through the W3C forms WAI tutorials for some guidance around how to implement accessibility successfully.

    + +
    + +
    +
    + +
    + +

    + + + Example Form + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Please choose a flavour + + +
    + + +
    + + +
    + +
    + +
    + + + +
    +
    + +

    + Language Switcher +

    + +
    +

    You could either use the language switcher component with hyperlinks, which would be the recommended way, to link to another language based page, which is addressable by a different URL.

    +

    The other way (especially for Single Page Applications) would be to use <button type="button"> elements, that have some JavaScript events attached to them to handle the switch directly. Please keep in mind to announce a change of contents e.g. to screenreaders in this case.

    +

    In both cases there's a slightly different HTML approach that you could inspect within the different examples below.

    +

    Please keep in mind that the styling is optimized to look good included within the header section of the page and doesn't "shine" included in here.

    + +
    + +
    +
    + +
    + +

    + + + Language switcher + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Language switcher with buttons + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +

    + Notifications +

    + +
    +

    Best practices

    +

    Best practice, research insights and examples: https://gerireid.com/forms.html#notifications

    +

    Accessibility

    +

    Notifications are intended to be small interruptions to your visitors or users, so to help those with screen readers and similar assistive technologies, you should wrap your notifications in an aria-live region. Changes to live regions (such as injecting/updating a notification component) are automatically announced by screen readers without needing to move the user’s focus or otherwise interrupt the user.

    +

    Additionally, if you'd like to update existing notifications incrementally, include aria-atomic="true" to ensure that the entire notification is always announced as a single (atomic) unit, rather than announcing what was changed (which could lead to problems if you only update part of the notification’s content, or if displaying the same notification content at a later point in time). It's still recommended to remove and add cmp-notification components as a whole within the section.

    +

    Note that the live region needs to be present in the markup before the notification is generated or updated. If you dynamically generate both at the same time and inject them into the page, they will generally not be announced by assistive technologies.

    +

    You also need to adapt the role and aria-live level depending on the content. If it’s an important message like an error, use role="alert" and aria-live="assertive", otherwise use role="status"and aria-live="polite" attributes.

    +

    Adapted from https://getbootstrap.com/docs/4.3/components/toasts/

    +

    And we're not using aria-relevant="additions", as the default behaviour is even already what we expect with the default (additions text), compare to e.g. https://medium.com/dev-channel/why-authors-should-avoid-aria-relevant-5d3164fab1e3 and https://github.com/w3c/aria/issues/712#issuecomment-529848465

    +

    Live regions

    +
    +

    Live regions are perceivable regions of a web page that are typically updated as a result of an external event when user focus may be elsewhere. These regions are not always updated as a result of a user interaction. This practice has become commonplace with the growing use of Ajax. Examples of live regions include a chat log, stock ticker, or a sport scoring section that updates periodically to reflect game statistics. Since these asynchronous areas are expected to update outside the user's area of focus, assistive technologies such as screen readers have either been unaware of their existence or unable to process them for the user. WAI-ARIA has provided a collection of properties that allow the author to identify these live regions and process them: aria-live, aria-relevant, aria-atomic, and aria-busy.

    +
    +

    Source: https://www.w3.org/TR/wai-aria/#terms

    +

    Conveying meaning to assistive technologies

    +
    +

    Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers. Ensure that information denoted by the color is either obvious from the content itself (e.g. the visible text), or is included through alternative means, such as additional visibly hidden text.

    +
    +

    Source: https://getbootstrap.com/docs/4.3/components/alerts/

    + +
    + +
    +
    + +
    + +

    + + + Notifications + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications Variants + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications Hovering + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications - Leading Icon + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications - Trailing Icon + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    + +
    + +
    + + + +
    +
    + +

    + Overflow Menu +

    + +
    +

    Variation to display the overflow menu on the opposite side

    +

    If you're either using this component at the very end of a main content part that will most likely always get displayed at the opposite viewport border or you'd like to implement some kind of a collision mechanism (most likely with JavaScript) and flip the overlays orientation to the opposite side (from regularly left to right positioned on left-to-right reading direction), you could use the following attribute to configure this orientation change, compare to the examples below as well:

    +
    data-horizontal-position="opposite"
+
    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Overflow menu + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu - Navigation / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +

    + Pagination +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Pagination + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +

    + Sidenavi +

    + +
    +

    Icons

    +

    The sidenavi pattern includes some general icons defined for some general rel values. Please feel free to define further by yourself depending on your needs, either within your SCSS code (recommended) or via attributes.

    + +
    + +
    +
    + +
    + +

    + + + Sidenavi + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +

    + Tab Bar +

    + +
    +

    Accessibility

    +

    This pattern has been tested and approved regarding accessibility.

    + +
    + +
    +
    + +
    + +

    + + + Tab Bar + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + +
    + Content 01 +
    + + +
    + Content 02 +
    + + +
    + Content 03 +
    + + +
    + Content 04 +
    + + +
    + Content 05 +
    +
    + +
    + + + +
    +
    + +

    + Table +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Table + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - alignment + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    center / middle:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    right / bottom:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table - border around cells + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - border horizontal + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - density + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    small:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    regular:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    large:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table - font size + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - icons + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table Overflow Menu + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 02 - 01Value 02 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 03 - 01Value 03 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 04 - 01Value 04 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 05 - 01Value 05 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table Row Title + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    Column headerThe table header 01The table header 02
    table headerValue 01 - 01Value 01 - 02
    table headerValue 02 - 01Value 02 - 02
    table headerValue 03 - 01Value 03 - 02
    table headerValue 04 - 01Value 04 - 02
    table headerValue 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - row zebra styling + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - sticky header + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.hbs b/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.hbs new file mode 100644 index 0000000000..22018211be --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.hbs @@ -0,0 +1,17 @@ +{{!-- TODO: let's not use those modifier classes, but inherit their meaning via CSS correctly and introduce sample classes for the styleguide --}} +

    + {{> elements-button variant='brand-primary' value='Brand Primary' icon='add'}} + {{> elements-button variant='brand-primary' value='Brand Primary' disabled='true' icon='add' }} +

    +

    + {{> elements-button variant='brand-primary' value='Brand Primary with right icon' icon-after='add'}} + {{> elements-button variant='brand-primary' value='Brand Primary with right icon(disabled)' disabled='true' icon-after='add' }} +

    +

    + {{> elements-button variant='brand-primary' value='Brand Primary without icon' }} + {{> elements-button variant='brand-primary' value='Brand Primary without icon (disabled)' disabled='true' }} +

    +

    + {{> elements-button variant='brand-primary' title='Check' value='Brand Primary displaying only the icon' icon='done' styleModifier='is-icon-text-replace' }} + {{> elements-button variant='brand-primary' title='Check' value='Brand Primary displaying only the icon' disabled='true' icon='done' styleModifier='is-icon-text-replace' }} +

    diff --git a/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.markup-only.html b/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.markup-only.html new file mode 100644 index 0000000000..2503328d41 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.markup-only.html @@ -0,0 +1,104 @@ +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    diff --git a/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.rendered.html b/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.rendered.html new file mode 100644 index 0000000000..445803c6cc --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.rendered.html @@ -0,0 +1,221 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.hbs b/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.hbs new file mode 100644 index 0000000000..d15fd12326 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.hbs @@ -0,0 +1,16 @@ +

    + {{> elements-button variant='primary' value='Primary' icon='add' }} + {{> elements-button variant='primary' value='Primary (disabled)' disabled='true' icon='add' }} +

    +

    + {{> elements-button variant='primary' value='Primary with icon' icon-after='add'}} + {{> elements-button variant='primary' value='Primary with icon (disabled)' disabled='true' icon-after='add' }} +

    +

    + {{> elements-button variant='primary' value='Primary without icon' }} + {{> elements-button variant='primary' value='Primary without icon (disabled)' disabled='true' }} +

    +

    + {{> elements-button variant='primary' title='Check' value='Primary displaying only the icon' icon='done' styleModifier='is-icon-text-replace' }} + {{> elements-button variant='primary' title='Check' value='Primary displaying only the icon' disabled='true' icon='done' styleModifier='is-icon-text-replace' }} +

    diff --git a/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.markup-only.html b/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.markup-only.html new file mode 100644 index 0000000000..a4be4fbfac --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.markup-only.html @@ -0,0 +1,104 @@ +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    diff --git a/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.rendered.html b/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.rendered.html new file mode 100644 index 0000000000..1f5860ff8b --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-03-button-primary/elements-buttons-03-button-primary.rendered.html @@ -0,0 +1,221 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.hbs b/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.hbs new file mode 100644 index 0000000000..9cdd61403f --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.hbs @@ -0,0 +1,16 @@ +

    + {{> elements-button variant='secondary-outline' value='Secondary Outline' icon='add' }} + {{> elements-button variant='secondary-outline' value='Secondary Outline (disabled)' disabled='true' icon='add' }} +

    +

    + {{> elements-button variant='secondary-outline' value='Secondary Outline with right icon' icon-after='add'}} + {{> elements-button variant='secondary-outline' value='Secondary Outline with right icon (disabled)' disabled='true' icon-after='add' }} +

    +

    + {{> elements-button variant='secondary-outline' value='Secondary Outline without left icon' }} + {{> elements-button variant='secondary-outline' value='Secondary Outline without left icon (disabled)' disabled='true' }} +

    +

    + {{> elements-button variant='secondary-outline' title='Check' value='Secondary Outline displaying only the icon' icon='done' styleModifier='is-icon-text-replace' }} + {{> elements-button variant='secondary-outline' title='Check' value='Secondary Outline displaying only the icon' disabled='true' icon='done' styleModifier='is-icon-text-replace' }} +

    diff --git a/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.markup-only.html b/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.markup-only.html new file mode 100644 index 0000000000..18082111ef --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.markup-only.html @@ -0,0 +1,104 @@ +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    diff --git a/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.rendered.html b/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.rendered.html new file mode 100644 index 0000000000..29d380e397 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.rendered.html @@ -0,0 +1,221 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.hbs b/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.hbs new file mode 100644 index 0000000000..1b46d5832e --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.hbs @@ -0,0 +1,16 @@ +

    + {{> elements-button variant='secondary-solid' value='Secondary' icon='add' }} + {{> elements-button variant='secondary-solid' value='Secondary (disabled)' disabled='true' icon='add' }} +

    +

    + {{> elements-button variant='secondary-solid' value='Secondary Solid with right icon' icon-after='add'}} + {{> elements-button variant='secondary-solid' value='Secondary Solid with right icon (disabled)' disabled='true' icon-after='add' }} +

    +

    + {{> elements-button variant='secondary-solid' value='Secondary Solid without icon' }} + {{> elements-button variant='secondary-solid' value='Secondary Solid without icon (disabled)' disabled='true' }} +

    +

    + {{> elements-button variant='secondary-solid' title='Check' value='Secondary Solid displaying only the icon' icon='done' styleModifier='is-icon-text-replace' }} + {{> elements-button variant='secondary-solid' title='Check' value='Secondary Solid displaying only the icon' disabled='true' icon='done' styleModifier='is-icon-text-replace' }} +

    diff --git a/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.markup-only.html b/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.markup-only.html new file mode 100644 index 0000000000..15c34f9de8 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.markup-only.html @@ -0,0 +1,104 @@ +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    diff --git a/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.rendered.html b/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.rendered.html new file mode 100644 index 0000000000..5a355b3bff --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.rendered.html @@ -0,0 +1,221 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.hbs b/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.hbs new file mode 100644 index 0000000000..2a23210d1a --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.hbs @@ -0,0 +1,16 @@ +

    + {{> elements-button variant='tertiary-plain' value='Tertiary Plain' }} + {{> elements-button variant='tertiary-plain' value='Tertiary Plain' disabled='true' }} +

    +

    + {{> elements-button variant='tertiary-plain' value='Tertiary Plain with right icon' icon-after='add'}} + {{> elements-button variant='tertiary-plain' value='Tertiary Plain with right icon(disabled)' disabled='true' icon-after='add' }} +

    +

    + {{> elements-button variant='tertiary-plain' value='Tertiary Plain without left icon' }} + {{> elements-button variant='tertiary-plain' value='Tertiary Plain without left icon (disabled)' disabled='true' }} +

    +

    + {{> elements-button variant='tertiary-plain' title='Check' value='Tertiary Plain displaying only the icon' icon='done' styleModifier='is-icon-text-replace' }} + {{> elements-button variant='tertiary-plain' title='Check' value='Tertiary Plain displaying only the icon' disabled='true' icon='done' styleModifier='is-icon-text-replace' }} +

    diff --git a/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.markup-only.html b/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.markup-only.html new file mode 100644 index 0000000000..1980954e8f --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.markup-only.html @@ -0,0 +1,104 @@ +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    diff --git a/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.rendered.html b/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.rendered.html new file mode 100644 index 0000000000..050b8d38fb --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.rendered.html @@ -0,0 +1,221 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.hbs b/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.hbs new file mode 100644 index 0000000000..8ba8aa4655 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.hbs @@ -0,0 +1,20 @@ +{{#each sizes }} + {{#if @first }}{{/if }} +

    {{ label }}

    +

    + {{> elements-button variant='brand-primary' value='Brand Primary' icon='add' size=size }} + {{> elements-button variant='brand-primary' value='Brand Primary (disabled)' disabled='true' icon='add' size=size }} +

    +

    + {{> elements-button variant='brand-primary' value='Brand Primary with right icon' icon-after='add' size=size }} + {{> elements-button variant='brand-primary' value='Brand Primary with right icon(disabled)' disabled='true' icon-after='add' size=size }} +

    +

    + {{> elements-button variant='brand-primary' value='Brand Primary without icon' size=size }} + {{> elements-button variant='brand-primary' value='Brand Primary without icon (disabled)' disabled='true' size=size }} +

    +

    + {{> elements-button variant='brand-primary' title='Done' value='Brand Primary displaying only the icon' icon='done' styleModifier='is-icon-text-replace' size=size }} + {{> elements-button variant='brand-primary' title='Done' value='Brand Primary displaying only the icon' disabled='true' icon='done' styleModifier='is-icon-text-replace' size=size }} +

    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.markup-only.html b/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.markup-only.html new file mode 100644 index 0000000000..91e705a208 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.markup-only.html @@ -0,0 +1,318 @@ + +

    Small

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Regular (default, data-size attribute is optional)

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Large

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    diff --git a/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.rendered.html b/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.rendered.html new file mode 100644 index 0000000000..ea78614932 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.rendered.html @@ -0,0 +1,435 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Small

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Regular (default, data-size attribute is optional)

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Large

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.hbs b/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.hbs new file mode 100644 index 0000000000..4e8f0b8e7e --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.hbs @@ -0,0 +1,12 @@ + diff --git a/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.markup-only.html b/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.markup-only.html new file mode 100644 index 0000000000..6f92f773e7 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.markup-only.html @@ -0,0 +1,12 @@ + diff --git a/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.rendered.html b/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.rendered.html new file mode 100644 index 0000000000..0f28ccf040 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons-button/elements-buttons-button.rendered.html @@ -0,0 +1,129 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-buttons/index.html b/version/v2.18.3/patterns/elements-buttons/index.html new file mode 100644 index 0000000000..63dbfa6ee0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-buttons/index.html @@ -0,0 +1,1343 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Buttons +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    SCSS (recommended)

    +

    Extend one of the variant placeholders: %variant-primary, %variant-secondary or %variant-tertiary

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute.

    +

    Size

    +

    SCSS (recommended)

    +

    Extend one of the size SCSS placeholders in case that you don't want the default (regular): %size-Small or %size-Large

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    +

    Usability

    +
    +

    Buttons should be used in situations where users might need to:

    +
      +
    • submit a form
      • +
    • begin a new task
      • +
    • trigger a new UI element to appear on the page
      • +
    • specify a new or next step in a process
      • +
    +
    +

    Button vs. Link

    +
    +

    The HTML elements for buttons and links describe a very specific type of action that is going to be taken when they are used. It is important you know when to use which, as the distinction matters:

    +
      +
    • Use a link when you’re navigating to another place, such as: a "view all" page, "Jane Chen" profile, a page "skip link" etc.
      • +
    • Use buttons when you are performing an action, such as: "submit," "merge," "create new," "upload," etc.
      • +
    • An action is almost always on the same page
      • +
    +
    +

    Source: https://www.lightningdesignsystem.com/components/buttons/#About-Buttons

    +

    Further argumentations:

    + +

    "Hand" cursor / pointer

    +

    We don't use the "hand" cursor / pointer for our buttons, as this is reserved for links even only; for more information have a look at articles like https://medium.com/simple-human/buttons-shouldnt-have-a-hand-cursor-b11e99ca374b and https://hiddedevries.nl/en/blog/2016-08-06-some-pointers-on-default-cursors or people who thought this through like https://ux.stackexchange.com/questions/105024/why-dont-button-html-elements-have-a-css-cursor-pointer-by-default#105027 or https://github.com/necolas/normalize.css/issues/371#issuecomment-60072171 and the UI guidelines from Apple, Microsoft, Google, etc.

    +

    Microsoft’s design guides talk about weak affordance:

    +
    +

    Text and graphics links use a hand […] pointer […] because of their weak affordance. While links may have other visual clues to indicate that they are links (such as underlines and special placement), displaying the hand pointer on hover is the definitive indication of a link. To avoid confusion, it is imperative not to use the hand pointer for other purposes. For example, command buttons already have a strong affordance, so they don’t need a hand pointer. The hand pointer must mean “this target is a link” and nothing else.

    +
    +

    Apple’s Human Interface Guidelines states that the hand cursor should be used when “the content is a URL link”.

    +

    W3C User Interface guidelines says the same thing again with “The cursor is a pointer that indicates a link”.

    +

    Disabled button state

    +

    The disabled state of the button is defined by a change in opacity for good reasons:

    +
    +

    A transparent button blends into the background more, while a gray one remains in the foreground (unless the background is gray). Foreground elements are more noticeable to users. They tend to view them as interactive, which means they’re more likely to interact with a grayed out disabled button.

    +
    +

    For much more information visit https://uxmovement.com/buttons/why-you-shouldnt-gray-out-disabled-buttons/.

    +

    In general disabling buttons is a controversial topic in UX Design, and should get only used well-considered; compare to these articles on how to use disabled buttons only selectively: https://stories.justinewin.com/disabled-buttons-dont-have-to-suck-10da0bb6d37e, https://axesslab.com/disabled-buttons-suck/ and https://www.smashingmagazine.com/2021/08/frustrating-design-patterns-disabled-buttons/

    +

    Ambiguous labels

    +

    Please keep in mind to use unambiguous labels: https://ebay.gitbook.io/mindpatterns/antipatterns/ambiguous-label

    + +
    + +
    +
    + +
    + +

    + + + Button + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +
    + +

    + + + Button Brand Primary + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Primary + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Secondary Outline + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Secondary Solid + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Tertiary Plain + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Sizes + + + + +

    + + + +
    + +
    +
    + +
    + +

    Small

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Regular (default, data-size attribute is optional)

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Large

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.markup-only.html new file mode 100644 index 0000000000..e0193ead7e --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.rendered.html new file mode 100644 index 0000000000..00a3564cf5 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.markup-only.html new file mode 100644 index 0000000000..b9ec5b24e9 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.rendered.html new file mode 100644 index 0000000000..7fc516c827 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.markup-only.html new file mode 100644 index 0000000000..3a99fc97f7 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.rendered.html new file mode 100644 index 0000000000..ab9bc31bfd --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.markup-only.html new file mode 100644 index 0000000000..c831208869 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.markup-only.html @@ -0,0 +1,11 @@ + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.rendered.html new file mode 100644 index 0000000000..11a6292ecd --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.rendered.html @@ -0,0 +1,128 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.markup-only.html new file mode 100644 index 0000000000..1ad3182c13 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.rendered.html new file mode 100644 index 0000000000..b2ad8760e2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.markup-only.html new file mode 100644 index 0000000000..6163e6297a --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.rendered.html new file mode 100644 index 0000000000..d2159cdc47 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.markup-only.html new file mode 100644 index 0000000000..1a7239744e --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.rendered.html new file mode 100644 index 0000000000..66a2f35781 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.markup-only.html new file mode 100644 index 0000000000..bcbb8557b4 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.rendered.html new file mode 100644 index 0000000000..73e60f6977 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.markup-only.html new file mode 100644 index 0000000000..12466adc6f --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.markup-only.html @@ -0,0 +1,11 @@ + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.rendered.html new file mode 100644 index 0000000000..64230298b7 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.rendered.html @@ -0,0 +1,128 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.markup-only.html new file mode 100644 index 0000000000..4907c5ca9d --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.rendered.html new file mode 100644 index 0000000000..b4d513f10f --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.hbs b/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.hbs new file mode 100644 index 0000000000..eec60f4aa1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.hbs @@ -0,0 +1,13 @@ + + +{{#if indeterminate}} + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.markup-only.html b/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.markup-only.html new file mode 100644 index 0000000000..91b481ab14 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.markup-only.html @@ -0,0 +1,8 @@ + + diff --git a/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.rendered.html b/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.rendered.html new file mode 100644 index 0000000000..ea1cb7c1d0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox-checkbox/elements-checkbox-checkbox.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-checkbox/index.html b/version/v2.18.3/patterns/elements-checkbox/index.html new file mode 100644 index 0000000000..d9989979cf --- /dev/null +++ b/version/v2.18.3/patterns/elements-checkbox/index.html @@ -0,0 +1,717 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Checkbox +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Checkbox + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - indeterminate + + + + + +

    + + + +
    + +
    +
    + +
    + + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - indeterminate on dark background + + + + + +

    + + + +
    + +
    +
    + +
    + + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.hbs b/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.hbs new file mode 100644 index 0000000000..3441b5e148 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.hbs @@ -0,0 +1,39 @@ +{{! TODO: This would need to get enhanced later on by the additional possible attributes }} +{{#if selection}} + + + + +{{else}} + + + + +{{/if }} diff --git a/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.markup-only.html b/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.markup-only.html new file mode 100644 index 0000000000..c924660222 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.markup-only.html @@ -0,0 +1,17 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.rendered.html b/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.rendered.html new file mode 100644 index 0000000000..a39b90433a --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-_chip/elements-chips-_chip.rendered.html @@ -0,0 +1,134 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.hbs b/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.hbs new file mode 100644 index 0000000000..8be96e52e1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.hbs @@ -0,0 +1,18 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{#unless iconVariants }} + {{> elements-chip label="Title" id-suffix="chip01" }} + {{#each variants }} + {{> elements-chip id-suffix=@index icon=../icon icon-after=../icon-after selection=../selection name=../name disabled=../disabled }} + {{/each}} + + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-chip id-suffix=@index size=../size disabled=../disabled selection=../selection name=../name }} + {{/each}} +{{else}} + {{#each iconVariants}} +

    {{> elements-chip label="Title" id-suffix=@index }}

    + {{/each }} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.markup-only.html b/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.markup-only.html new file mode 100644 index 0000000000..fad487ff96 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.markup-only.html @@ -0,0 +1,277 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.rendered.html b/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.rendered.html new file mode 100644 index 0000000000..e68f615f29 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-disabled/elements-chips-chips-disabled.rendered.html @@ -0,0 +1,394 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.hbs b/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.hbs new file mode 100644 index 0000000000..8be96e52e1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.hbs @@ -0,0 +1,18 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{#unless iconVariants }} + {{> elements-chip label="Title" id-suffix="chip01" }} + {{#each variants }} + {{> elements-chip id-suffix=@index icon=../icon icon-after=../icon-after selection=../selection name=../name disabled=../disabled }} + {{/each}} + + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-chip id-suffix=@index size=../size disabled=../disabled selection=../selection name=../name }} + {{/each}} +{{else}} + {{#each iconVariants}} +

    {{> elements-chip label="Title" id-suffix=@index }}

    + {{/each }} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.markup-only.html b/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.markup-only.html new file mode 100644 index 0000000000..b0c06512d8 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.markup-only.html @@ -0,0 +1,277 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.rendered.html b/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.rendered.html new file mode 100644 index 0000000000..d89363aaf4 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-linked/elements-chips-chips-linked.rendered.html @@ -0,0 +1,394 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.hbs b/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.hbs new file mode 100644 index 0000000000..8be96e52e1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.hbs @@ -0,0 +1,18 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{#unless iconVariants }} + {{> elements-chip label="Title" id-suffix="chip01" }} + {{#each variants }} + {{> elements-chip id-suffix=@index icon=../icon icon-after=../icon-after selection=../selection name=../name disabled=../disabled }} + {{/each}} + + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-chip id-suffix=@index size=../size disabled=../disabled selection=../selection name=../name }} + {{/each}} +{{else}} + {{#each iconVariants}} +

    {{> elements-chip label="Title" id-suffix=@index }}

    + {{/each }} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.markup-only.html b/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.markup-only.html new file mode 100644 index 0000000000..ea38a6afd8 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.markup-only.html @@ -0,0 +1,293 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.rendered.html b/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.rendered.html new file mode 100644 index 0000000000..4cb66b96c3 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-type-selection/elements-chips-chips-type-selection.rendered.html @@ -0,0 +1,410 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.hbs b/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.hbs new file mode 100644 index 0000000000..8be96e52e1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.hbs @@ -0,0 +1,18 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{#unless iconVariants }} + {{> elements-chip label="Title" id-suffix="chip01" }} + {{#each variants }} + {{> elements-chip id-suffix=@index icon=../icon icon-after=../icon-after selection=../selection name=../name disabled=../disabled }} + {{/each}} + + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-chip id-suffix=@index size=../size disabled=../disabled selection=../selection name=../name }} + {{/each}} +{{else}} + {{#each iconVariants}} +

    {{> elements-chip label="Title" id-suffix=@index }}

    + {{/each }} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.markup-only.html b/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.markup-only.html new file mode 100644 index 0000000000..099a4c5e29 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.markup-only.html @@ -0,0 +1,54 @@ +

    + + + +

    +

    + + + +

    +

    + + + +

    diff --git a/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.rendered.html b/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.rendered.html new file mode 100644 index 0000000000..e5790aa42f --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips-with-icon/elements-chips-chips-with-icon.rendered.html @@ -0,0 +1,171 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + + + +

    +

    + + + +

    +

    + + + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.hbs b/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.hbs new file mode 100644 index 0000000000..8be96e52e1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.hbs @@ -0,0 +1,18 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{#unless iconVariants }} + {{> elements-chip label="Title" id-suffix="chip01" }} + {{#each variants }} + {{> elements-chip id-suffix=@index icon=../icon icon-after=../icon-after selection=../selection name=../name disabled=../disabled }} + {{/each}} + + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-chip id-suffix=@index size=../size disabled=../disabled selection=../selection name=../name }} + {{/each}} +{{else}} + {{#each iconVariants}} +

    {{> elements-chip label="Title" id-suffix=@index }}

    + {{/each }} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.markup-only.html b/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.markup-only.html new file mode 100644 index 0000000000..b0c06512d8 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.markup-only.html @@ -0,0 +1,277 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.rendered.html b/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.rendered.html new file mode 100644 index 0000000000..cc855a09c1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips-chips/elements-chips-chips.rendered.html @@ -0,0 +1,394 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-chips/index.html b/version/v2.18.3/patterns/elements-chips/index.html new file mode 100644 index 0000000000..b272902be5 --- /dev/null +++ b/version/v2.18.3/patterns/elements-chips/index.html @@ -0,0 +1,1216 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Chips +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute. These could be either one of the four feedback values, or the "point of interest" stylings.

    + +
    + +
    +
    + +
    + +

    + + + Filter chips + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Selection chips + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Chips with icon + + + + +

    + + + +
    + +
    +
    + +
    +

    + + + +

    +

    + + + +

    +

    + + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Chips – disabled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.hbs b/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.hbs new file mode 100644 index 0000000000..37946ccd31 --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.hbs @@ -0,0 +1,2 @@ +{{> elements-logo }} +{{> elements-headline }} diff --git a/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.markup-only.html b/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.markup-only.html new file mode 100644 index 0000000000..a20baf4bb7 --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.markup-only.html @@ -0,0 +1,8 @@ + + +

    Lorem ipsum dolores sint

    diff --git a/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.rendered.html b/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.rendered.html new file mode 100644 index 0000000000..71cbdae774 --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline-headline-pulse/elements-headline-headline-pulse.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Lorem ipsum dolores sint

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.hbs b/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.hbs new file mode 100644 index 0000000000..04a09d58d4 --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.hbs @@ -0,0 +1,2 @@ + +{{ text }} diff --git a/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.markup-only.html b/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.markup-only.html new file mode 100644 index 0000000000..1f6a3d86ab --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.markup-only.html @@ -0,0 +1,2 @@ + +

    Lorem ipsum dolores sint

    diff --git a/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.rendered.html b/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.rendered.html new file mode 100644 index 0000000000..d5be05f04c --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline-headline/elements-headline-headline.rendered.html @@ -0,0 +1,119 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Lorem ipsum dolores sint

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-headline/index.html b/version/v2.18.3/patterns/elements-headline/index.html new file mode 100644 index 0000000000..d7d5727c84 --- /dev/null +++ b/version/v2.18.3/patterns/elements-headline/index.html @@ -0,0 +1,237 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Headline +

    + +
    +

    Pulse

    +

    You could add the DB Pulse to the headline element by adding the data-pulse attribute – we're taking care of sizing it accordingly to the DB logo if this one is also present on the same page, as defined by the rules on the Marketingportal regarding the logo and the pulse.

    + +
    + +
    +
    + +
    + +

    + + + Headline + + + + +

    + + + +
    + +
    +
    + +
    + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +
    + +

    + + + Headline Pulse + + + + +

    + + + +
    + +
    +
    + +
    + + +

    Lorem ipsum dolores sint

    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.hbs b/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.markup-only.html b/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.markup-only.html new file mode 100644 index 0000000000..9c30054e53 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.markup-only.html @@ -0,0 +1,7 @@ + + + + DB Regio train at Munich mainstation + + diff --git a/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.rendered.html b/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.rendered.html new file mode 100644 index 0000000000..99c6f25e56 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-avif/elements-image-image-avif.rendered.html @@ -0,0 +1,124 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DB Regio train at Munich mainstation + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.hbs b/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.markup-only.html b/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.markup-only.html new file mode 100644 index 0000000000..f9b43754b9 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.markup-only.html @@ -0,0 +1,6 @@ + + DB Regio train at Munich mainstation + + diff --git a/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.rendered.html b/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.rendered.html new file mode 100644 index 0000000000..7e6887b737 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-lazy-loading/elements-image-image-lazy-loading.rendered.html @@ -0,0 +1,123 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DB Regio train at Munich mainstation + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.hbs b/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.markup-only.html b/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.markup-only.html new file mode 100644 index 0000000000..df97b78fca --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.markup-only.html @@ -0,0 +1,5 @@ + + DB Regio train at Munich mainstation + + diff --git a/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.rendered.html b/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.rendered.html new file mode 100644 index 0000000000..6ac4887cac --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-responsive-density/elements-image-image-responsive-density.rendered.html @@ -0,0 +1,122 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DB Regio train at Munich mainstation + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.hbs b/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.markup-only.html b/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.markup-only.html new file mode 100644 index 0000000000..1c802a7446 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.markup-only.html @@ -0,0 +1,8 @@ + + + + + DB Regio train at Munich mainstation + + diff --git a/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.rendered.html b/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.rendered.html new file mode 100644 index 0000000000..c2b9fd40b0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DB Regio train at Munich mainstation + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.hbs b/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.markup-only.html b/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.markup-only.html new file mode 100644 index 0000000000..db8dd1e384 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.markup-only.html @@ -0,0 +1,7 @@ + + + + DB Regio train at Munich mainstation + + diff --git a/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.rendered.html b/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.rendered.html new file mode 100644 index 0000000000..b97b92457a --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-webp/elements-image-image-webp.rendered.html @@ -0,0 +1,124 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DB Regio train at Munich mainstation + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.hbs b/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.markup-only.html b/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.markup-only.html new file mode 100644 index 0000000000..7da6852547 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.markup-only.html @@ -0,0 +1,6 @@ +
    + DB Regio train at Munich mainstation + +
    DB Regio train at Munich mainstation
    +
    diff --git a/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.rendered.html b/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.rendered.html new file mode 100644 index 0000000000..b09887c776 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image-with-caption/elements-image-image-with-caption.rendered.html @@ -0,0 +1,123 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + DB Regio train at Munich mainstation + +
    DB Regio train at Munich mainstation
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image-image/elements-image-image.hbs b/version/v2.18.3/patterns/elements-image-image/elements-image-image.hbs new file mode 100644 index 0000000000..941793d711 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image/elements-image-image.hbs @@ -0,0 +1,17 @@ +{{#if caption}}
    {{/if }} + {{#if sources}} + + {{#each sources}} + + {{/each }} + {{/if }} + {{! TODO: We need to integrate the responsive image attributes as well as think whether and how we would like to + output this element within the patternlab itself }} + {{ alt }} + {{#if sources}} + {{/if }} + {{#if caption}}
    {{ caption }}
    +
    {{/if }} diff --git a/version/v2.18.3/patterns/elements-image-image/elements-image-image.markup-only.html b/version/v2.18.3/patterns/elements-image-image/elements-image-image.markup-only.html new file mode 100644 index 0000000000..628961134e --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image/elements-image-image.markup-only.html @@ -0,0 +1,5 @@ + + DB Regio train at Munich mainstation + + diff --git a/version/v2.18.3/patterns/elements-image-image/elements-image-image.rendered.html b/version/v2.18.3/patterns/elements-image-image/elements-image-image.rendered.html new file mode 100644 index 0000000000..09567bdcea --- /dev/null +++ b/version/v2.18.3/patterns/elements-image-image/elements-image-image.rendered.html @@ -0,0 +1,122 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + DB Regio train at Munich mainstation + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-image/index.html b/version/v2.18.3/patterns/elements-image/index.html new file mode 100644 index 0000000000..ff6c88bb57 --- /dev/null +++ b/version/v2.18.3/patterns/elements-image/index.html @@ -0,0 +1,539 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Image +

    + +
    +

    Responsive images: width, height and intrinsicsize

    +

    There has been some development the latest on the new proposed intrinsicsize attribute for images, that ended with the existing and well known attributes width and height will get used to compute that intrinsicsize directly via UA-stylesheets - so the responsive images and aspect-ratio comes without any costs and leads to that it even makes more sense than ever to fill out those attributes with the basic size of your image in the first place.

    +

    For more information have a look at those articles and the standard/proposal:

    + +

    Image formats

    +

    JPEG (AVIF and WebP as progressive enhancement) for photographs etc

    +
    +

    Photographs typically fare well with lossy compression (depending on the encoder's configuration). This makes JPEG and WebP good choices for photographs, with JPEG being more compatible but WebP perhaps offering better compression. To maximize quality and minimize download time, consider providing both using a fallback with WebP as the first choice and JPEG as the second. Otherwise, JPEG is the safe choice for compatibility.

    +
    +

    Source: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#Photographs

    +

    Next to WebP you could experiment a little bit with the new image format AVIF that promises even lower file sizes than WebP and increases in browser support.

    +

    Additionally have a look at Googles product "Guetzli", that provides great JPEG compression rates as well: https://github.com/google/guetzli/

    +

    And another tool even also resulted in fine compression rates - the main difference in between the both of them is that JPEGMini isn't available for free anymore: https://www.jpegmini.com

    +

    Attention: PNG is even also often used for pictures, even though that the special capabilities of this format like partial transparency aren't being used. This leads to much huger filesizes in most cases, as the JPEG format is capable of much better compression rates than PNG in general, so you would have to check on this aspect individually and carefully.

    +

    Partialy transparent images

    +

    Regarding images that need to have some kind of full or partial transparency, you could use either GIF (full) or PNG (most likely PNG-24 for partial) transparency.

    +

    Or use SVG masks, as this beautiful concept shows: https://github.blog/2021-01-29-making-githubs-new-homepage-fast-and-performant/#serving-the-perfect-image

    +

    Diagrams, drawings, and charts

    +
    +

    For any image that can be represented using vector graphics, SVG is the best choice. Otherwise, you should use a lossless format like PNG. If you do choose a lossy format, such as JPEG or lossy WebP, carefully weigh the compression level to avoid causing text or other shapes to become fuzzy or unclear.

    +
    +

    Source: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#Diagrams_drawings_and_charts

    +

    Further image compressions

    +

    On top of the possibilities mentioned above regarding image optimizations (Google Guetzli & JPEGMini) you could as well have a look at both ImageAlpha (for PNG) and ImageOptim (for all), both available for Mac and the first both both other GUI and command-line variants and the latter as well as a webservice. Another great online tool that works entirely in the browser and doesn't even need to process your data on their servers (due to WebAssembly and some other cool stuff) is https://squoosh.app. Nowadays they additionally provide a CLI version of their software and new cool image formats, check out their version 2: https://web.dev/squoosh-v2/

    +

    Some further information on this topic are provided on this page: https://dev.to/prototyp/optimizing-images-for-the-web-an-in-depth-guide-4j7d

    +

    Accessibility

    +

    Always provide a link text

    +
    +

    All links should have text that uniquely identifies the link target.

    +
    +

    Source: https://www.deque.com/blog/accessibility-strategies-for-your-content-team/#:~:text=Link Text

    +

    Alt text should communicate the main point

    +
    +

    The key is to describe what you want your audience to get out of the image rather than a simple description of what the image is.

    +
    +

    Source: https://www.deque.com/blog/accessibility-strategies-for-your-content-team/#:~:text=Images

    +

    Using captions

    +

    For using captions it's recommended to use the <figure> and <figcaption> HTML tags - but please be aware that you additionally need to enrich those via aria-labelledby or aria-describedby attributes to ensure that assistive technologies are recognizing the linkage of those tags on Windows. It's mainly important to decide whether the figcaption HTML tags content is meant as a description or a label to choose one of those aria-* attributes correctly.

    +
    +

    When using the down arrow, NVDA announced all the <img> elements in turn except for the ones with empty or missing alt attributes. These were just completely ignored by the screen reader. Using aria-labelledby overrode any alternate text, and using aria-describedby added the ‘description’ into the alternate text. It’s interesting to note that using aria-labelledby also brought images with missing or empty alternate text to the attention of NVDA.

    +
    +

    Source: https://www.hassellinclusion.com/blog/figure-figcaption-extended-alternate-text-screen-readers/

    + +
    + +
    +
    + +
    + +

    + + + Image + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - AVIF + + + + + +

    + + + +
    + +
    +
    + +
    + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Lazy loading + + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Responsive and pixel density + + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Responsive mediaquery + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - WebP + + + + + +

    + + + +
    + +
    +
    + +
    + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - with caption + + + + + +

    + + + +
    + +
    +
    + +
    +
    + DB Regio train at Munich mainstation + +
    DB Regio train at Munich mainstation
    +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.hbs b/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.markup-only.html b/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.markup-only.html new file mode 100644 index 0000000000..cf921aa15d --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.markup-only.html @@ -0,0 +1,25 @@ + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.rendered.html b/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.rendered.html new file mode 100644 index 0000000000..90b446475b --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-auto-suggest/elements-input-input-auto-suggest.rendered.html @@ -0,0 +1,142 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.hbs b/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.markup-only.html b/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.markup-only.html new file mode 100644 index 0000000000..c4884736cf --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.markup-only.html @@ -0,0 +1,21 @@ + + + +

    Optionale Beschreibung
    Zeile zwei

    + diff --git a/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.rendered.html b/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.rendered.html new file mode 100644 index 0000000000..61bdc26b70 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-description/elements-input-input-description.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Optionale Beschreibung
    Zeile zwei

    + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.hbs b/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.markup-only.html b/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.markup-only.html new file mode 100644 index 0000000000..8ba006fd68 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.markup-only.html @@ -0,0 +1,21 @@ + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.rendered.html b/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.rendered.html new file mode 100644 index 0000000000..dd548c83db --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-disabled/elements-input-input-disabled.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.hbs b/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.markup-only.html b/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.markup-only.html new file mode 100644 index 0000000000..e0c03d4a2e --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.markup-only.html @@ -0,0 +1,21 @@ + + + +

    Optionale Beschreibung
    Zeile zwei

    + diff --git a/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.rendered.html b/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.rendered.html new file mode 100644 index 0000000000..d9f938cf9f --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-filled/elements-input-input-filled.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Optionale Beschreibung
    Zeile zwei

    + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.hbs b/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.markup-only.html b/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.markup-only.html new file mode 100644 index 0000000000..95f5596845 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.markup-only.html @@ -0,0 +1,21 @@ + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.rendered.html b/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.rendered.html new file mode 100644 index 0000000000..3fec0ef5d5 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-hidden-label/elements-input-input-hidden-label.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.hbs b/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.markup-only.html b/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.markup-only.html new file mode 100644 index 0000000000..776f11970e --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.markup-only.html @@ -0,0 +1,21 @@ + + + +

    Optionale Beschreibung
    Zeile zwei

    + diff --git a/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.rendered.html b/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.rendered.html new file mode 100644 index 0000000000..c77668346a --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Optionale Beschreibung
    Zeile zwei

    + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.hbs b/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.markup-only.html b/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.markup-only.html new file mode 100644 index 0000000000..e690ee3a3f --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.markup-only.html @@ -0,0 +1,21 @@ + + + +

    Optionale Beschreibung
    Zeile zwei

    + diff --git a/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.rendered.html b/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.rendered.html new file mode 100644 index 0000000000..1c3cc40176 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-invalid/elements-input-input-invalid.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Optionale Beschreibung
    Zeile zwei

    + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.hbs b/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.markup-only.html b/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.markup-only.html new file mode 100644 index 0000000000..adfe63bbac --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.markup-only.html @@ -0,0 +1,21 @@ + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.rendered.html b/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.rendered.html new file mode 100644 index 0000000000..d8392e4819 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-search-filled/elements-input-input-search-filled.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.hbs b/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.markup-only.html b/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.markup-only.html new file mode 100644 index 0000000000..b9b9d7b9a7 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.markup-only.html @@ -0,0 +1,21 @@ + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.rendered.html b/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.rendered.html new file mode 100644 index 0000000000..3a8d1c7cf9 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-search/elements-input-input-search.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.hbs b/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.markup-only.html b/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.markup-only.html new file mode 100644 index 0000000000..31a58cac48 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.markup-only.html @@ -0,0 +1,21 @@ + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.rendered.html b/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.rendered.html new file mode 100644 index 0000000000..20fc9f5b27 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-valid/elements-input-input-valid.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.hbs b/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.hbs new file mode 100644 index 0000000000..c2edd3e1dd --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.hbs @@ -0,0 +1,6 @@ +
    +{{#each variations}} +
    {{variant}}:
    +
    {{> elements-input type=../type label=../label placeholder=../placeholder }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.markup-only.html b/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.markup-only.html new file mode 100644 index 0000000000..3838ce888a --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.markup-only.html @@ -0,0 +1,94 @@ +
    +
    semitransparent:
    +
    + + + + +
    +
    white:
    +
    + + + + +
    +
    solid:
    +
    + + + + +
    +
    outline:
    +
    + + + + +
    +
    diff --git a/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.rendered.html b/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.rendered.html new file mode 100644 index 0000000000..b08a85b630 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input-variations/elements-input-input-variations.rendered.html @@ -0,0 +1,211 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    semitransparent:
    +
    + + + + +
    +
    white:
    +
    + + + + +
    +
    solid:
    +
    + + + + +
    +
    outline:
    +
    + + + + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input/elements-input-input.hbs b/version/v2.18.3/patterns/elements-input-input/elements-input-input.hbs new file mode 100644 index 0000000000..3862c3efe0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input/elements-input-input.hbs @@ -0,0 +1,25 @@ + + + +{{#if description }}{{{ description }}}

    {{/if }} +{{#if datalist }} + {{#each datalistItems }} + {{ text }} + {{/each }} +{{/if }} diff --git a/version/v2.18.3/patterns/elements-input-input/elements-input-input.markup-only.html b/version/v2.18.3/patterns/elements-input-input/elements-input-input.markup-only.html new file mode 100644 index 0000000000..19bec180fd --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input/elements-input-input.markup-only.html @@ -0,0 +1,21 @@ + + + + + diff --git a/version/v2.18.3/patterns/elements-input-input/elements-input-input.rendered.html b/version/v2.18.3/patterns/elements-input-input/elements-input-input.rendered.html new file mode 100644 index 0000000000..5f2b9f50c9 --- /dev/null +++ b/version/v2.18.3/patterns/elements-input-input/elements-input-input.rendered.html @@ -0,0 +1,138 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-input/index.html b/version/v2.18.3/patterns/elements-input/index.html new file mode 100644 index 0000000000..163e82e18c --- /dev/null +++ b/version/v2.18.3/patterns/elements-input/index.html @@ -0,0 +1,1015 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Input +

    + +
    +

    label and input elements code structure

    +

    We're using the construct of label and input elements shown below (both their order and not nesting them, as a few other frameworks do) for two good reasons:

    +
      +
    • "Generally, explicit labels are better supported by assistive technology." - compare to the W3C spec, seems to be a WCAG criteria that for, too.
      • +
    • We could easily control the styling depending on the input elements (pseudo-)states w/o the need for JavaScript
      • +
    +

    Auto suggestions

    +

    You could easily integrate the possibility to provide auto suggestions to your input fields via the list-attribute on the input-HTML-elements as well as adding the suggestions via the datalist-HTML-element. Please follow up within the Input - Auto Suggestions section.

    +

    Autofill

    +

    For heavily supporting the user on autofilling form fields (not only, but especially on mobile browsing) with information even already available on their devices, you could use the autocomplete attribute, as described e.g. here https://cloudfour.com/thinks/autofill-what-web-devs-should-know-but-dont/

    +

    The attribute doesn't even only take boolean values, but even also a list of specific field types, as described in the specification: https://html.spec.whatwg.org/multipage/forms.html#inappropriate-for-the-control

    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    +

    Accessibility support

    +

    For our special construct (the order of the label and input HTML tags) we need to additionaly set some further attributes on those HTML tags to better support assistive tools (screenreaders like JAWS and VoiceOver); set the aria-labelledby-attribute on the input and related id on the label as well as aria-hidden="true", e.g. like this:

    +
    <input
+  type="text"
+  class="elm-input"
+  placeholder="Projekt Name"
+  name="input01"
+  id="input01"
+  aria-labelledby="input01-label"
+/>
+<label class="elm-label" for="input01" aria-hidden="true" id="input01-label"
+  >Textlabel</label
+>
+
    +

    We've conducted some tests with those assistive tools that lead to the conclusion that either the labels content hasn't been read out to the screenreader user on those form fields directly, but the labels content has been read again after the form field e.g. on VoiceOver. So those declarations are necessary for this kind of HTML construct, that is especially relevant for form validation and floating label functionality via CSS only.

    + +
    + +
    +
    + +
    + +

    + + + Input variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + + + + +
    +
    white:
    +
    + + + + +
    +
    solid:
    +
    + + + + +
    +
    outline:
    +
    + + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Input + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - Auto suggestions + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input with description + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - filled with a value + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - valid state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - invalid state (type in less than its minimum of 5 characters) + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - disabled state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    + +
    + +
    + +

    + + + Input - search type - filled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.hbs b/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.hbs new file mode 100644 index 0000000000..5f84490ac4 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.hbs @@ -0,0 +1,19 @@ +{{! TODO: This would need to get enhanced later on by the additional possible attributes }} +{{#if value }}{{{ value }}}{{ else }}{{ href }}{{/if }} + diff --git a/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.markup-only.html b/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.markup-only.html new file mode 100644 index 0000000000..e475c7b39a --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.markup-only.html @@ -0,0 +1,18 @@ +# + diff --git a/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.rendered.html b/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.rendered.html new file mode 100644 index 0000000000..992b5a19f9 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-_link/elements-link-_link.rendered.html @@ -0,0 +1,135 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +# + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.hbs b/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.hbs new file mode 100644 index 0000000000..f088aa6e01 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.hbs @@ -0,0 +1,21 @@ +{{#unless size}} +

    + {{ excerpt.slim }}. {{> elements-link href='#' value='Text Link' size=size }}{{ excerpt.slim }} +

    +

    + {{ excerpt.slim }}. {{> elements-link href='#' value='Text Link (disabled)' disabled='true' size=size }}{{ excerpt.slim }} +

    +{{/unless }} + +

    + {{> elements-link href='#' value='Teaser link' }} +

    +

    + {{> elements-link href='#' value='Teaser link' icon='settings' }} +

    +

    + {{> elements-link href='#' value='Teaser link (disabled)' disabled='true' }} +

    +

    + {{> elements-link href='#' value='Teaser Link (disabled)' icon-after='account' disabled='true' size=size }} +

    diff --git a/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.markup-only.html b/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.markup-only.html new file mode 100644 index 0000000000..6b2e219025 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.markup-only.html @@ -0,0 +1,81 @@ + +

    + Teaser link + +

    +

    + Teaser link + +

    +

    + Teaser link (disabled) + +

    +

    + Teaser Link (disabled) + +

    diff --git a/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.rendered.html b/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.rendered.html new file mode 100644 index 0000000000..46299bfa06 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-links-small/elements-link-links-small.rendered.html @@ -0,0 +1,198 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + Teaser link + +

    +

    + Teaser link + +

    +

    + Teaser link (disabled) + +

    +

    + Teaser Link (disabled) + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-link-links/elements-link-links.hbs b/version/v2.18.3/patterns/elements-link-links/elements-link-links.hbs new file mode 100644 index 0000000000..f088aa6e01 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-links/elements-link-links.hbs @@ -0,0 +1,21 @@ +{{#unless size}} +

    + {{ excerpt.slim }}. {{> elements-link href='#' value='Text Link' size=size }}{{ excerpt.slim }} +

    +

    + {{ excerpt.slim }}. {{> elements-link href='#' value='Text Link (disabled)' disabled='true' size=size }}{{ excerpt.slim }} +

    +{{/unless }} + +

    + {{> elements-link href='#' value='Teaser link' }} +

    +

    + {{> elements-link href='#' value='Teaser link' icon='settings' }} +

    +

    + {{> elements-link href='#' value='Teaser link (disabled)' disabled='true' }} +

    +

    + {{> elements-link href='#' value='Teaser Link (disabled)' icon-after='account' disabled='true' size=size }} +

    diff --git a/version/v2.18.3/patterns/elements-link-links/elements-link-links.markup-only.html b/version/v2.18.3/patterns/elements-link-links/elements-link-links.markup-only.html new file mode 100644 index 0000000000..7e88cb5f11 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-links/elements-link-links.markup-only.html @@ -0,0 +1,123 @@ +

    + Lorem ipsum dolor sit amet, consectetur adipisicing elit. Text Link + +Lorem ipsum dolor sit amet, consectetur adipisicing elit +

    +

    + Lorem ipsum dolor sit amet, consectetur adipisicing elit. Text Link (disabled) + +Lorem ipsum dolor sit amet, consectetur adipisicing elit +

    + +

    + Teaser link + +

    +

    + Teaser link + +

    +

    + Teaser link (disabled) + +

    +

    + Teaser Link (disabled) + +

    diff --git a/version/v2.18.3/patterns/elements-link-links/elements-link-links.rendered.html b/version/v2.18.3/patterns/elements-link-links/elements-link-links.rendered.html new file mode 100644 index 0000000000..ba4480585a --- /dev/null +++ b/version/v2.18.3/patterns/elements-link-links/elements-link-links.rendered.html @@ -0,0 +1,240 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    + Lorem ipsum dolor sit amet, consectetur adipisicing elit. Text Link + +Lorem ipsum dolor sit amet, consectetur adipisicing elit +

    +

    + Lorem ipsum dolor sit amet, consectetur adipisicing elit. Text Link (disabled) + +Lorem ipsum dolor sit amet, consectetur adipisicing elit +

    + +

    + Teaser link + +

    +

    + Teaser link + +

    +

    + Teaser link (disabled) + +

    +

    + Teaser Link (disabled) + +

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-link/index.html b/version/v2.18.3/patterns/elements-link/index.html new file mode 100644 index 0000000000..cbb9ac6571 --- /dev/null +++ b/version/v2.18.3/patterns/elements-link/index.html @@ -0,0 +1,505 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + + + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.hbs b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.hbs new file mode 100644 index 0000000000..4005a090d1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.hbs @@ -0,0 +1,16 @@ + + {{aria-description}} + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.markup-only.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.markup-only.html new file mode 100644 index 0000000000..b912254fd6 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.markup-only.html @@ -0,0 +1,16 @@ + + Example description for xs loading spinner + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.rendered.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.rendered.html new file mode 100644 index 0000000000..ffe872473b --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Example description for xs loading spinner + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.hbs b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.hbs new file mode 100644 index 0000000000..4005a090d1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.hbs @@ -0,0 +1,16 @@ + + {{aria-description}} + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.markup-only.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.markup-only.html new file mode 100644 index 0000000000..891199e89a --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.markup-only.html @@ -0,0 +1,16 @@ + + Example description for loading spinner size L + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.rendered.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.rendered.html new file mode 100644 index 0000000000..a938aa4ba3 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Example description for loading spinner size L + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.hbs b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.hbs new file mode 100644 index 0000000000..4005a090d1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.hbs @@ -0,0 +1,16 @@ + + {{aria-description}} + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.markup-only.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.markup-only.html new file mode 100644 index 0000000000..e896a795ac --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.markup-only.html @@ -0,0 +1,16 @@ + + Example description for loading spinner size M + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.rendered.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.rendered.html new file mode 100644 index 0000000000..26f7228360 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Example description for loading spinner size M + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.hbs b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.hbs new file mode 100644 index 0000000000..4005a090d1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.hbs @@ -0,0 +1,16 @@ + + {{aria-description}} + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.markup-only.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.markup-only.html new file mode 100644 index 0000000000..63dc93e0c2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.markup-only.html @@ -0,0 +1,16 @@ + + Example description for s loading spinner + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.rendered.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.rendered.html new file mode 100644 index 0000000000..32e9ec8348 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Example description for s loading spinner + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.hbs b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.hbs new file mode 100644 index 0000000000..4005a090d1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.hbs @@ -0,0 +1,16 @@ + + {{aria-description}} + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.markup-only.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.markup-only.html new file mode 100644 index 0000000000..340aa17592 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.markup-only.html @@ -0,0 +1,16 @@ + + Example description for loading spinner size XL + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.rendered.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.rendered.html new file mode 100644 index 0000000000..803c712262 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Example description for loading spinner size XL + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.hbs b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.hbs new file mode 100644 index 0000000000..4005a090d1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.hbs @@ -0,0 +1,16 @@ + + {{aria-description}} + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.markup-only.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.markup-only.html new file mode 100644 index 0000000000..0dfa73db53 --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.markup-only.html @@ -0,0 +1,16 @@ + + Example description for loading spinner + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.rendered.html b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.rendered.html new file mode 100644 index 0000000000..32111ab2da --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.rendered.html @@ -0,0 +1,133 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Example description for loading spinner + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-loading-indicator/index.html b/version/v2.18.3/patterns/elements-loading-indicator/index.html new file mode 100644 index 0000000000..7957c867cd --- /dev/null +++ b/version/v2.18.3/patterns/elements-loading-indicator/index.html @@ -0,0 +1,508 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Loading Indicator +

    + +
    +

    Progress spinners (loading indicators) show the user that a longer-lasting action is being carried out.
    +Progress/Loading Indicators are used when the application executes a server request or processes data in the frontend. The component is used as soon as the execution and the resulting delay are noticeable to the user. This keeps the user aware that his or her action is being executed.

    +

    Accessibility

    +

    SVGs are often conveyed inconsistently to assistive technologies. The component’s accessibility is also highly contextual. +For optimal user experience, use the aria-description prop to let assistive technology users know the purpose of the loading spinner.

    +

    aria-live and dynamic creation of html content

    +

    Using JavaScript (e.g. in context of frameworks like Angular, VueJS or React), it is possible to dynamically change parts of a page without requiring the entire page to reload — for instance, to update a list of search results on the fly, or to display a discreet alert or notification which does not require user interaction. While these changes are usually visually apparent to users who can see the page, they may not be obvious to users of assistive technologies. ARIA live regions fill this gap and provide a way to programmatically expose dynamic content changes in a way that can be announced by assistive technologies.

    +

    aria-live triggers screen readers when an element with aria-live (or text within an element with aria-live) is added or removed from the DOM. In contrast, when you unhide a hidden element, neither elements nor text are added or removed from the DOM, so the element's aria-live property doesn’t come into play.

    +

    Note that the live region needs to be present in the markup before the notification is generated or updated. If you dynamically generate both at the same time and inject them into the page, they will generally not be announced by assistive technologies.

    +

    You also need to adapt the role and aria-live level depending on the content. Further information can be found here https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions

    +

    Recommendations

    +

    Do

    +

    If the application is waiting for a process, it makes sense to display an indicator in a central location.

    +

    Don‘t

    +

    An indicator should not be used to visualize the application waiting for user input.

    + +
    + +
    +
    + +
    + +

    + + + Loading Indicator + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size S + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for s loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size XS + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for xs loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size M + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size M + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size L + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size L + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size XL + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size XL + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.hbs b/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.hbs new file mode 100644 index 0000000000..9ea4a4f1a0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.hbs @@ -0,0 +1,7 @@ +
      + {{#each example-bgs }} +
    • + {{> elements-logo }} +
      • + {{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.markup-only.html b/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.markup-only.html new file mode 100644 index 0000000000..06c312d47a --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.markup-only.html @@ -0,0 +1,34 @@ +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    diff --git a/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.rendered.html b/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.rendered.html new file mode 100644 index 0000000000..19bf1f5fdc --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.rendered.html @@ -0,0 +1,151 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.hbs b/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.hbs new file mode 100644 index 0000000000..3daa81f118 --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.hbs @@ -0,0 +1,7 @@ +
      + {{#each sizes }} +
    • + {{> elements-logo }} +
      • + {{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.markup-only.html b/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.markup-only.html new file mode 100644 index 0000000000..67cc25420f --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.markup-only.html @@ -0,0 +1,42 @@ +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    diff --git a/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.rendered.html b/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.rendered.html new file mode 100644 index 0000000000..293858c06d --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-sizes/elements-logo-logo-sizes.rendered.html @@ -0,0 +1,159 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.hbs b/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.hbs new file mode 100644 index 0000000000..7838ec8914 --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.hbs @@ -0,0 +1,2 @@ +{{> elements-logo }} +{{> elements-headline pulse="true" text="Lorem ipsum dolores sint" type="1" }} diff --git a/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.markup-only.html b/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.markup-only.html new file mode 100644 index 0000000000..e92b433a7a --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.markup-only.html @@ -0,0 +1,8 @@ + + +

    Lorem ipsum dolores sint

    diff --git a/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.rendered.html b/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.rendered.html new file mode 100644 index 0000000000..37c8b3876c --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.rendered.html @@ -0,0 +1,125 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Lorem ipsum dolores sint

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.hbs b/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.hbs new file mode 100644 index 0000000000..5dbab719ef --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.hbs @@ -0,0 +1,6 @@ + diff --git a/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.markup-only.html b/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.markup-only.html new file mode 100644 index 0000000000..13e34de502 --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.markup-only.html @@ -0,0 +1,6 @@ + diff --git a/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.rendered.html b/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.rendered.html new file mode 100644 index 0000000000..e79380e268 --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo-logo/elements-logo-logo.rendered.html @@ -0,0 +1,123 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-logo/index.html b/version/v2.18.3/patterns/elements-logo/index.html new file mode 100644 index 0000000000..151f8ae5ff --- /dev/null +++ b/version/v2.18.3/patterns/elements-logo/index.html @@ -0,0 +1,414 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + + +
    + +
    + +

    + + + Logo On Backgrounds + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Logo Sizes + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Logo With Following Headline + + + + +

    + + + +
    + +
    +
    + +
    + + +

    Lorem ipsum dolores sint

    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.hbs b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.hbs new file mode 100644 index 0000000000..22a2b0101f --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.hbs @@ -0,0 +1,19 @@ +
    + {{#if conic}}{{/if}} + + {{#if_eq type 'loader'}} + {{#if value}} + {{/if}} + {{/if_eq}} +
    diff --git a/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.markup-only.html b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.markup-only.html new file mode 100644 index 0000000000..4cb1fb5269 --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.markup-only.html @@ -0,0 +1,7 @@ +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.rendered.html b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.rendered.html new file mode 100644 index 0000000000..62adb53c3e --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.rendered.html @@ -0,0 +1,124 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.hbs b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.hbs new file mode 100644 index 0000000000..22a2b0101f --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.hbs @@ -0,0 +1,19 @@ +
    + {{#if conic}}{{/if}} + + {{#if_eq type 'loader'}} + {{#if value}} + {{/if}} + {{/if_eq}} +
    diff --git a/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.markup-only.html b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.markup-only.html new file mode 100644 index 0000000000..a4d858912e --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.markup-only.html @@ -0,0 +1,10 @@ +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.rendered.html b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.rendered.html new file mode 100644 index 0000000000..2cafaa18f0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.hbs b/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.hbs new file mode 100644 index 0000000000..22a2b0101f --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.hbs @@ -0,0 +1,19 @@ +
    + {{#if conic}}{{/if}} + + {{#if_eq type 'loader'}} + {{#if value}} + {{/if}} + {{/if_eq}} +
    diff --git a/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.markup-only.html b/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.markup-only.html new file mode 100644 index 0000000000..82c2c17ae2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.markup-only.html @@ -0,0 +1,14 @@ +
    + + + +
    diff --git a/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.rendered.html b/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.rendered.html new file mode 100644 index 0000000000..eb3576d34a --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress-progress/elements-progress-progress.rendered.html @@ -0,0 +1,131 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-progress/index.html b/version/v2.18.3/patterns/elements-progress/index.html new file mode 100644 index 0000000000..43eb605111 --- /dev/null +++ b/version/v2.18.3/patterns/elements-progress/index.html @@ -0,0 +1,302 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Progress +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Linear loader + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Linear spinner + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Linear spinner indeterminate + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.hbs b/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.hbs new file mode 100644 index 0000000000..7c76f4b8ab --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.hbs @@ -0,0 +1,11 @@ + + diff --git a/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.markup-only.html b/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.markup-only.html new file mode 100644 index 0000000000..515d1a3adc --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.markup-only.html @@ -0,0 +1,11 @@ + + diff --git a/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.rendered.html b/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.rendered.html new file mode 100644 index 0000000000..a9cfc4ef3e --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-_radio/elements-radio-_radio.rendered.html @@ -0,0 +1,128 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.hbs b/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.markup-only.html new file mode 100644 index 0000000000..0170d8e081 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.rendered.html b/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.rendered.html new file mode 100644 index 0000000000..b6c8d0a23f --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-checked/elements-radio-radios-checked.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.hbs b/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.markup-only.html new file mode 100644 index 0000000000..c3e1263d57 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.rendered.html b/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.rendered.html new file mode 100644 index 0000000000..578ebf9b45 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.hbs b/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.markup-only.html new file mode 100644 index 0000000000..19085e6311 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.rendered.html b/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.rendered.html new file mode 100644 index 0000000000..f3b4e55cb3 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-disabled/elements-radio-radios-disabled.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.hbs b/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.markup-only.html new file mode 100644 index 0000000000..fd61d4b0bf --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.rendered.html b/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.rendered.html new file mode 100644 index 0000000000..d6305dc79e --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.hbs b/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.markup-only.html new file mode 100644 index 0000000000..be7a51fd18 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.rendered.html b/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.rendered.html new file mode 100644 index 0000000000..26363aea5d --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.hbs b/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.markup-only.html new file mode 100644 index 0000000000..ee676078ec --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.rendered.html b/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.rendered.html new file mode 100644 index 0000000000..d83a538b1d --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios-required/elements-radio-radios-required.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.hbs b/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.hbs new file mode 100644 index 0000000000..21a276a5a2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.hbs @@ -0,0 +1,3 @@ +{{#each radios }} + {{> elements-radio disabled=../disabled invalid=../invalid required=../required id=(unique-id) name=../name labelHidden=../labelHidden }}
    +{{/each }} diff --git a/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.markup-only.html b/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.markup-only.html new file mode 100644 index 0000000000..8257b4425d --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.markup-only.html @@ -0,0 +1,36 @@ + + +
    + + +
    + + +
    diff --git a/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.rendered.html b/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.rendered.html new file mode 100644 index 0000000000..83c8b74f8a --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio-radios/elements-radio-radios.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-radio/index.html b/version/v2.18.3/patterns/elements-radio/index.html new file mode 100644 index 0000000000..d94e98f9b1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-radio/index.html @@ -0,0 +1,702 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Radio +

    + +
    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Radios + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Invalid Attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radio - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Required + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.hbs b/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.hbs new file mode 100644 index 0000000000..381b73da96 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.hbs @@ -0,0 +1,21 @@ + + diff --git a/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.markup-only.html b/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.markup-only.html new file mode 100644 index 0000000000..6bec91df3c --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.markup-only.html @@ -0,0 +1,15 @@ + + diff --git a/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.rendered.html b/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.rendered.html new file mode 100644 index 0000000000..83c1f21bfc --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-hidden-label/elements-select-select-hidden-label.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.hbs b/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.hbs new file mode 100644 index 0000000000..381b73da96 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.hbs @@ -0,0 +1,21 @@ + + diff --git a/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.markup-only.html b/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.markup-only.html new file mode 100644 index 0000000000..62e0b47091 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.markup-only.html @@ -0,0 +1,15 @@ + + diff --git a/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.rendered.html b/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.rendered.html new file mode 100644 index 0000000000..49fa3e0291 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.hbs b/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.hbs new file mode 100644 index 0000000000..c942fef256 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.hbs @@ -0,0 +1,6 @@ +
    +{{#each variations}} +
    {{variant}}:
    +
    {{> elements-select disabled=../disabled }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.markup-only.html b/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.markup-only.html new file mode 100644 index 0000000000..9880e8ee3b --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.markup-only.html @@ -0,0 +1,70 @@ +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    diff --git a/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.rendered.html b/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.rendered.html new file mode 100644 index 0000000000..7be844ebdb --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations-disabled/elements-select-select-variations-disabled.rendered.html @@ -0,0 +1,187 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.hbs b/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.hbs new file mode 100644 index 0000000000..c942fef256 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.hbs @@ -0,0 +1,6 @@ +
    +{{#each variations}} +
    {{variant}}:
    +
    {{> elements-select disabled=../disabled }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.markup-only.html b/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.markup-only.html new file mode 100644 index 0000000000..bc8c6ad32f --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.markup-only.html @@ -0,0 +1,90 @@ +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    diff --git a/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.rendered.html b/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.rendered.html new file mode 100644 index 0000000000..aadcd6a384 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.rendered.html @@ -0,0 +1,207 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.hbs b/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.hbs new file mode 100644 index 0000000000..c942fef256 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.hbs @@ -0,0 +1,6 @@ +
    +{{#each variations}} +
    {{variant}}:
    +
    {{> elements-select disabled=../disabled }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.markup-only.html b/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.markup-only.html new file mode 100644 index 0000000000..95c5a4c87e --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.markup-only.html @@ -0,0 +1,70 @@ +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    diff --git a/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.rendered.html b/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.rendered.html new file mode 100644 index 0000000000..d0d366c7c4 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select-variations/elements-select-select-variations.rendered.html @@ -0,0 +1,187 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select-select/elements-select-select.hbs b/version/v2.18.3/patterns/elements-select-select/elements-select-select.hbs new file mode 100644 index 0000000000..381b73da96 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select/elements-select-select.hbs @@ -0,0 +1,21 @@ + + diff --git a/version/v2.18.3/patterns/elements-select-select/elements-select-select.markup-only.html b/version/v2.18.3/patterns/elements-select-select/elements-select-select.markup-only.html new file mode 100644 index 0000000000..8f1e8f7121 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select/elements-select-select.markup-only.html @@ -0,0 +1,15 @@ + + diff --git a/version/v2.18.3/patterns/elements-select-select/elements-select-select.rendered.html b/version/v2.18.3/patterns/elements-select-select/elements-select-select.rendered.html new file mode 100644 index 0000000000..b132207ee3 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select-select/elements-select-select.rendered.html @@ -0,0 +1,132 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-select/index.html b/version/v2.18.3/patterns/elements-select/index.html new file mode 100644 index 0000000000..c592d39094 --- /dev/null +++ b/version/v2.18.3/patterns/elements-select/index.html @@ -0,0 +1,679 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Select +

    + +
    +

    This element doesn't fulfill the styleguides definitions especially on the option elements styling, as this isn't possible x-browser without JavaScript. +If you would like to even also match those visual requirements, you would need to choose a progressive JavaScript solution on your own.

    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Select + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Select Variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select Variations Disabled + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select Variations Optgroups + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Select - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.hbs b/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.hbs new file mode 100644 index 0000000000..ba315fcc01 --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.hbs @@ -0,0 +1,6 @@ +{{! TODO: This would need to get enhanced later on by the additional possible attributes }} +{{ label }} diff --git a/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.markup-only.html b/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.markup-only.html new file mode 100644 index 0000000000..03ad817900 --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.markup-only.html @@ -0,0 +1,5 @@ + diff --git a/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.rendered.html b/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.rendered.html new file mode 100644 index 0000000000..48af4dc6b0 --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-_tag/elements-tags-_tag.rendered.html @@ -0,0 +1,122 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.hbs b/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.hbs new file mode 100644 index 0000000000..a91302c17f --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.hbs @@ -0,0 +1,14 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{> elements-tag label="Default" }} +{{#each variants }} + {{> elements-tag size=../size icon=../icon }} +{{/each}} + +{{#unless icon}} + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-tag size=../size }} + {{/each}} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.markup-only.html b/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.markup-only.html new file mode 100644 index 0000000000..8ead543cda --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.markup-only.html @@ -0,0 +1,90 @@ +Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung diff --git a/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.rendered.html b/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.rendered.html new file mode 100644 index 0000000000..5151ae5c99 --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags-small/elements-tags-tags-small.rendered.html @@ -0,0 +1,207 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.hbs b/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.hbs new file mode 100644 index 0000000000..a91302c17f --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.hbs @@ -0,0 +1,14 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{> elements-tag label="Default" }} +{{#each variants }} + {{> elements-tag size=../size icon=../icon }} +{{/each}} + +{{#unless icon}} + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-tag size=../size }} + {{/each}} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.markup-only.html b/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.markup-only.html new file mode 100644 index 0000000000..c3cb7acc4e --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.markup-only.html @@ -0,0 +1,36 @@ +Default + Light + Informative + Success + Warning + Error + Gl. 10 + diff --git a/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.rendered.html b/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.rendered.html new file mode 100644 index 0000000000..c0d08593bf --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags-with-icon/elements-tags-tags-with-icon.rendered.html @@ -0,0 +1,153 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.hbs b/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.hbs new file mode 100644 index 0000000000..a91302c17f --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.hbs @@ -0,0 +1,14 @@ +{{! TODO: The following conditional construct should obviously get simplified in the future }} +{{> elements-tag label="Default" }} +{{#each variants }} + {{> elements-tag size=../size icon=../icon }} +{{/each}} + +{{#unless icon}} + + {{> elements-headline type="3" text="POIs" }} + + {{#each pois }} + {{> elements-tag size=../size }} + {{/each}} +{{/unless }} diff --git a/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.markup-only.html b/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.markup-only.html new file mode 100644 index 0000000000..76cecc9bbe --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.markup-only.html @@ -0,0 +1,90 @@ +Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung diff --git a/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.rendered.html b/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.rendered.html new file mode 100644 index 0000000000..bdebe9b357 --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags-tags/elements-tags-tags.rendered.html @@ -0,0 +1,207 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-tags/index.html b/version/v2.18.3/patterns/elements-tags/index.html new file mode 100644 index 0000000000..09852ca778 --- /dev/null +++ b/version/v2.18.3/patterns/elements-tags/index.html @@ -0,0 +1,493 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Tags +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute. These could be either one of the four feedback values, or the "point of interest" stylings.

    +

    Size

    +

    SCSS (recommended)

    +

    Extend the size placeholder in case that you don't want the default (regular): %size-Small

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    + +
    + +
    +
    + +
    + +

    + + + Tags + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + +
    + + + +
    +
    + +
    + +

    + + + Tags Small + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + +
    + + + +
    +
    + +
    + +

    + + + Tags With Icon + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.markup-only.html new file mode 100644 index 0000000000..a61671a773 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.markup-only.html @@ -0,0 +1,13 @@ + + + +

    Optionale Beschreibung
    Zeile zwei

    diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.rendered.html new file mode 100644 index 0000000000..5998b75a94 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-description/elements-textarea-textarea-description.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    Optionale Beschreibung
    Zeile zwei

    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.markup-only.html new file mode 100644 index 0000000000..f69e7cb651 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.rendered.html new file mode 100644 index 0000000000..80a503f9b6 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.markup-only.html new file mode 100644 index 0000000000..644ea883ce --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.rendered.html new file mode 100644 index 0000000000..cd0c7fbb0a --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-filled/elements-textarea-textarea-filled.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.markup-only.html new file mode 100644 index 0000000000..46266b8021 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.rendered.html new file mode 100644 index 0000000000..c41c540421 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.markup-only.html new file mode 100644 index 0000000000..d5fe6a4576 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.rendered.html new file mode 100644 index 0000000000..723e26322e --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.markup-only.html new file mode 100644 index 0000000000..b1e4dd58d9 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.rendered.html new file mode 100644 index 0000000000..75da2042ed --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.markup-only.html new file mode 100644 index 0000000000..bfdd51c2bf --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.rendered.html new file mode 100644 index 0000000000..342a2aa868 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-valid/elements-textarea-textarea-valid.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.hbs b/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.hbs new file mode 100644 index 0000000000..4aacfef073 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.hbs @@ -0,0 +1,6 @@ +
    +{{#each variations}} +
    {{variant}}:
    +
    {{> elements-textarea label=../label placeholder=../placeholder }}
    +{{/each }} +
    diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.markup-only.html new file mode 100644 index 0000000000..992f0ea3ce --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.markup-only.html @@ -0,0 +1,54 @@ +
    +
    semitransparent:
    +
    + + + +
    +
    white:
    +
    + + + +
    +
    solid:
    +
    + + + +
    +
    outline:
    +
    + + + +
    +
    diff --git a/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.rendered.html new file mode 100644 index 0000000000..774c889fe2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea-variations/elements-textarea-textarea-variations.rendered.html @@ -0,0 +1,171 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    semitransparent:
    +
    + + + +
    +
    white:
    +
    + + + +
    +
    solid:
    +
    + + + +
    +
    outline:
    +
    + + + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.hbs b/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.hbs new file mode 100644 index 0000000000..063011e47f --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.hbs @@ -0,0 +1,14 @@ +{{! TODO: the retrieval of the standard values doesn't work so far }} + + +{{#if maxlength }}{{/if }} +{{#if description }}{{{ description }}}

    {{/if }} diff --git a/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.markup-only.html b/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.markup-only.html new file mode 100644 index 0000000000..110420971a --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.markup-only.html @@ -0,0 +1,13 @@ + + + + diff --git a/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.rendered.html b/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.rendered.html new file mode 100644 index 0000000000..b628080a63 --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea-textarea/elements-textarea-textarea.rendered.html @@ -0,0 +1,130 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-textarea/index.html b/version/v2.18.3/patterns/elements-textarea/index.html new file mode 100644 index 0000000000..4963432d6a --- /dev/null +++ b/version/v2.18.3/patterns/elements-textarea/index.html @@ -0,0 +1,689 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Textarea +

    + +
    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Textarea variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + + + +
    +
    white:
    +
    + + + +
    +
    solid:
    +
    + + + +
    +
    outline:
    +
    + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Textarea + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea Disabled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea with description + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + +
    + + + +
    +
    + +
    + +

    + + + Textarea filled with a value + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - valid state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - invalid state (type in less than its minimum of 5 characters) + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.hbs b/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.hbs new file mode 100644 index 0000000000..5492610014 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.hbs @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.markup-only.html b/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.markup-only.html new file mode 100644 index 0000000000..bfa9b5ab38 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.markup-only.html @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.rendered.html b/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.rendered.html new file mode 100644 index 0000000000..2e6ca5d1f3 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.hbs b/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.hbs new file mode 100644 index 0000000000..5492610014 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.hbs @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.markup-only.html b/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.markup-only.html new file mode 100644 index 0000000000..59ce1841ef --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.markup-only.html @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.rendered.html b/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.rendered.html new file mode 100644 index 0000000000..edf0ebc52a --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.hbs b/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.hbs new file mode 100644 index 0000000000..5492610014 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.hbs @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.markup-only.html b/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.markup-only.html new file mode 100644 index 0000000000..0aca777ba2 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.markup-only.html @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.rendered.html b/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.rendered.html new file mode 100644 index 0000000000..2b40fa3ef6 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle-on/elements-toggle-toggle-on.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.hbs b/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.hbs new file mode 100644 index 0000000000..5492610014 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.hbs @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.markup-only.html b/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.markup-only.html new file mode 100644 index 0000000000..5a5ed70ca7 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.markup-only.html @@ -0,0 +1,10 @@ + + diff --git a/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.rendered.html b/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.rendered.html new file mode 100644 index 0000000000..4522735b8e --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle-toggle/elements-toggle-toggle.rendered.html @@ -0,0 +1,127 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-toggle/index.html b/version/v2.18.3/patterns/elements-toggle/index.html new file mode 100644 index 0000000000..8f2484db68 --- /dev/null +++ b/version/v2.18.3/patterns/elements-toggle/index.html @@ -0,0 +1,355 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Toggle +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Toggle + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle On + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle On Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.hbs b/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.hbs new file mode 100644 index 0000000000..aa4d5411fb --- /dev/null +++ b/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.hbs @@ -0,0 +1,12 @@ + diff --git a/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.markup-only.html b/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.markup-only.html new file mode 100644 index 0000000000..b9e902bdf1 --- /dev/null +++ b/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.markup-only.html @@ -0,0 +1,3 @@ + diff --git a/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.rendered.html b/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.rendered.html new file mode 100644 index 0000000000..bb36027784 --- /dev/null +++ b/version/v2.18.3/patterns/elements-video-_video/elements-video-_video.rendered.html @@ -0,0 +1,120 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.hbs b/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.hbs new file mode 100644 index 0000000000..6093c8635e --- /dev/null +++ b/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.hbs @@ -0,0 +1,4 @@ + diff --git a/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.markup-only.html b/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.markup-only.html new file mode 100644 index 0000000000..25522eeaff --- /dev/null +++ b/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.markup-only.html @@ -0,0 +1,4 @@ + diff --git a/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.rendered.html b/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.rendered.html new file mode 100644 index 0000000000..c650f1f1d6 --- /dev/null +++ b/version/v2.18.3/patterns/elements-video-_youtube/elements-video-_youtube.rendered.html @@ -0,0 +1,121 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/elements/index.html b/version/v2.18.3/patterns/elements/index.html new file mode 100644 index 0000000000..f9ed4e8eb9 --- /dev/null +++ b/version/v2.18.3/patterns/elements/index.html @@ -0,0 +1,7922 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Buttons +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    SCSS (recommended)

    +

    Extend one of the variant placeholders: %variant-primary, %variant-secondary or %variant-tertiary

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute.

    +

    Size

    +

    SCSS (recommended)

    +

    Extend one of the size SCSS placeholders in case that you don't want the default (regular): %size-Small or %size-Large

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    +

    Usability

    +
    +

    Buttons should be used in situations where users might need to:

    +
      +
    • submit a form
      • +
    • begin a new task
      • +
    • trigger a new UI element to appear on the page
      • +
    • specify a new or next step in a process
      • +
    +
    +

    Button vs. Link

    +
    +

    The HTML elements for buttons and links describe a very specific type of action that is going to be taken when they are used. It is important you know when to use which, as the distinction matters:

    +
      +
    • Use a link when you’re navigating to another place, such as: a "view all" page, "Jane Chen" profile, a page "skip link" etc.
      • +
    • Use buttons when you are performing an action, such as: "submit," "merge," "create new," "upload," etc.
      • +
    • An action is almost always on the same page
      • +
    +
    +

    Source: https://www.lightningdesignsystem.com/components/buttons/#About-Buttons

    +

    Further argumentations:

    + +

    "Hand" cursor / pointer

    +

    We don't use the "hand" cursor / pointer for our buttons, as this is reserved for links even only; for more information have a look at articles like https://medium.com/simple-human/buttons-shouldnt-have-a-hand-cursor-b11e99ca374b and https://hiddedevries.nl/en/blog/2016-08-06-some-pointers-on-default-cursors or people who thought this through like https://ux.stackexchange.com/questions/105024/why-dont-button-html-elements-have-a-css-cursor-pointer-by-default#105027 or https://github.com/necolas/normalize.css/issues/371#issuecomment-60072171 and the UI guidelines from Apple, Microsoft, Google, etc.

    +

    Microsoft’s design guides talk about weak affordance:

    +
    +

    Text and graphics links use a hand […] pointer […] because of their weak affordance. While links may have other visual clues to indicate that they are links (such as underlines and special placement), displaying the hand pointer on hover is the definitive indication of a link. To avoid confusion, it is imperative not to use the hand pointer for other purposes. For example, command buttons already have a strong affordance, so they don’t need a hand pointer. The hand pointer must mean “this target is a link” and nothing else.

    +
    +

    Apple’s Human Interface Guidelines states that the hand cursor should be used when “the content is a URL link”.

    +

    W3C User Interface guidelines says the same thing again with “The cursor is a pointer that indicates a link”.

    +

    Disabled button state

    +

    The disabled state of the button is defined by a change in opacity for good reasons:

    +
    +

    A transparent button blends into the background more, while a gray one remains in the foreground (unless the background is gray). Foreground elements are more noticeable to users. They tend to view them as interactive, which means they’re more likely to interact with a grayed out disabled button.

    +
    +

    For much more information visit https://uxmovement.com/buttons/why-you-shouldnt-gray-out-disabled-buttons/.

    +

    In general disabling buttons is a controversial topic in UX Design, and should get only used well-considered; compare to these articles on how to use disabled buttons only selectively: https://stories.justinewin.com/disabled-buttons-dont-have-to-suck-10da0bb6d37e, https://axesslab.com/disabled-buttons-suck/ and https://www.smashingmagazine.com/2021/08/frustrating-design-patterns-disabled-buttons/

    +

    Ambiguous labels

    +

    Please keep in mind to use unambiguous labels: https://ebay.gitbook.io/mindpatterns/antipatterns/ambiguous-label

    + +
    + +
    +
    + +
    + +

    + + + Button + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +
    + +

    + + + Button Brand Primary + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Primary + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Secondary Outline + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Secondary Solid + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Tertiary Plain + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Sizes + + + + +

    + + + +
    + +
    +
    + +
    + +

    Small

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Regular (default, data-size attribute is optional)

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Large

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +

    + Checkbox +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Checkbox + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - indeterminate + + + + + +

    + + + +
    + +
    +
    + +
    + + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - indeterminate on dark background + + + + + +

    + + + +
    + +
    +
    + +
    + + + + +
    + + + +
    +
    + +

    + Chips +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute. These could be either one of the four feedback values, or the "point of interest" stylings.

    + +
    + +
    +
    + +
    + +

    + + + Filter chips + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Selection chips + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Chips with icon + + + + +

    + + + +
    + +
    +
    + +
    +

    + + + +

    +

    + + + +

    +

    + + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Chips – disabled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +

    + Headline +

    + +
    +

    Pulse

    +

    You could add the DB Pulse to the headline element by adding the data-pulse attribute – we're taking care of sizing it accordingly to the DB logo if this one is also present on the same page, as defined by the rules on the Marketingportal regarding the logo and the pulse.

    + +
    + +
    +
    + +
    + +

    + + + Headline + + + + +

    + + + +
    + +
    +
    + +
    + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +
    + +

    + + + Headline Pulse + + + + +

    + + + +
    + +
    +
    + +
    + + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +

    + Image +

    + +
    +

    Responsive images: width, height and intrinsicsize

    +

    There has been some development the latest on the new proposed intrinsicsize attribute for images, that ended with the existing and well known attributes width and height will get used to compute that intrinsicsize directly via UA-stylesheets - so the responsive images and aspect-ratio comes without any costs and leads to that it even makes more sense than ever to fill out those attributes with the basic size of your image in the first place.

    +

    For more information have a look at those articles and the standard/proposal:

    + +

    Image formats

    +

    JPEG (AVIF and WebP as progressive enhancement) for photographs etc

    +
    +

    Photographs typically fare well with lossy compression (depending on the encoder's configuration). This makes JPEG and WebP good choices for photographs, with JPEG being more compatible but WebP perhaps offering better compression. To maximize quality and minimize download time, consider providing both using a fallback with WebP as the first choice and JPEG as the second. Otherwise, JPEG is the safe choice for compatibility.

    +
    +

    Source: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#Photographs

    +

    Next to WebP you could experiment a little bit with the new image format AVIF that promises even lower file sizes than WebP and increases in browser support.

    +

    Additionally have a look at Googles product "Guetzli", that provides great JPEG compression rates as well: https://github.com/google/guetzli/

    +

    And another tool even also resulted in fine compression rates - the main difference in between the both of them is that JPEGMini isn't available for free anymore: https://www.jpegmini.com

    +

    Attention: PNG is even also often used for pictures, even though that the special capabilities of this format like partial transparency aren't being used. This leads to much huger filesizes in most cases, as the JPEG format is capable of much better compression rates than PNG in general, so you would have to check on this aspect individually and carefully.

    +

    Partialy transparent images

    +

    Regarding images that need to have some kind of full or partial transparency, you could use either GIF (full) or PNG (most likely PNG-24 for partial) transparency.

    +

    Or use SVG masks, as this beautiful concept shows: https://github.blog/2021-01-29-making-githubs-new-homepage-fast-and-performant/#serving-the-perfect-image

    +

    Diagrams, drawings, and charts

    +
    +

    For any image that can be represented using vector graphics, SVG is the best choice. Otherwise, you should use a lossless format like PNG. If you do choose a lossy format, such as JPEG or lossy WebP, carefully weigh the compression level to avoid causing text or other shapes to become fuzzy or unclear.

    +
    +

    Source: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#Diagrams_drawings_and_charts

    +

    Further image compressions

    +

    On top of the possibilities mentioned above regarding image optimizations (Google Guetzli & JPEGMini) you could as well have a look at both ImageAlpha (for PNG) and ImageOptim (for all), both available for Mac and the first both both other GUI and command-line variants and the latter as well as a webservice. Another great online tool that works entirely in the browser and doesn't even need to process your data on their servers (due to WebAssembly and some other cool stuff) is https://squoosh.app. Nowadays they additionally provide a CLI version of their software and new cool image formats, check out their version 2: https://web.dev/squoosh-v2/

    +

    Some further information on this topic are provided on this page: https://dev.to/prototyp/optimizing-images-for-the-web-an-in-depth-guide-4j7d

    +

    Accessibility

    +

    Always provide a link text

    +
    +

    All links should have text that uniquely identifies the link target.

    +
    +

    Source: https://www.deque.com/blog/accessibility-strategies-for-your-content-team/#:~:text=Link Text

    +

    Alt text should communicate the main point

    +
    +

    The key is to describe what you want your audience to get out of the image rather than a simple description of what the image is.

    +
    +

    Source: https://www.deque.com/blog/accessibility-strategies-for-your-content-team/#:~:text=Images

    +

    Using captions

    +

    For using captions it's recommended to use the <figure> and <figcaption> HTML tags - but please be aware that you additionally need to enrich those via aria-labelledby or aria-describedby attributes to ensure that assistive technologies are recognizing the linkage of those tags on Windows. It's mainly important to decide whether the figcaption HTML tags content is meant as a description or a label to choose one of those aria-* attributes correctly.

    +
    +

    When using the down arrow, NVDA announced all the <img> elements in turn except for the ones with empty or missing alt attributes. These were just completely ignored by the screen reader. Using aria-labelledby overrode any alternate text, and using aria-describedby added the ‘description’ into the alternate text. It’s interesting to note that using aria-labelledby also brought images with missing or empty alternate text to the attention of NVDA.

    +
    +

    Source: https://www.hassellinclusion.com/blog/figure-figcaption-extended-alternate-text-screen-readers/

    + +
    + +
    +
    + +
    + +

    + + + Image + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - AVIF + + + + + +

    + + + +
    + +
    +
    + +
    + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Lazy loading + + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Responsive and pixel density + + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Responsive mediaquery + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - WebP + + + + + +

    + + + +
    + +
    +
    + +
    + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - with caption + + + + + +

    + + + +
    + +
    +
    + +
    +
    + DB Regio train at Munich mainstation + +
    DB Regio train at Munich mainstation
    +
    + +
    + + + +
    +
    + +

    + Input +

    + +
    +

    label and input elements code structure

    +

    We're using the construct of label and input elements shown below (both their order and not nesting them, as a few other frameworks do) for two good reasons:

    +
      +
    • "Generally, explicit labels are better supported by assistive technology." - compare to the W3C spec, seems to be a WCAG criteria that for, too.
      • +
    • We could easily control the styling depending on the input elements (pseudo-)states w/o the need for JavaScript
      • +
    +

    Auto suggestions

    +

    You could easily integrate the possibility to provide auto suggestions to your input fields via the list-attribute on the input-HTML-elements as well as adding the suggestions via the datalist-HTML-element. Please follow up within the Input - Auto Suggestions section.

    +

    Autofill

    +

    For heavily supporting the user on autofilling form fields (not only, but especially on mobile browsing) with information even already available on their devices, you could use the autocomplete attribute, as described e.g. here https://cloudfour.com/thinks/autofill-what-web-devs-should-know-but-dont/

    +

    The attribute doesn't even only take boolean values, but even also a list of specific field types, as described in the specification: https://html.spec.whatwg.org/multipage/forms.html#inappropriate-for-the-control

    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    +

    Accessibility support

    +

    For our special construct (the order of the label and input HTML tags) we need to additionaly set some further attributes on those HTML tags to better support assistive tools (screenreaders like JAWS and VoiceOver); set the aria-labelledby-attribute on the input and related id on the label as well as aria-hidden="true", e.g. like this:

    +
    <input
+  type="text"
+  class="elm-input"
+  placeholder="Projekt Name"
+  name="input01"
+  id="input01"
+  aria-labelledby="input01-label"
+/>
+<label class="elm-label" for="input01" aria-hidden="true" id="input01-label"
+  >Textlabel</label
+>
+
    +

    We've conducted some tests with those assistive tools that lead to the conclusion that either the labels content hasn't been read out to the screenreader user on those form fields directly, but the labels content has been read again after the form field e.g. on VoiceOver. So those declarations are necessary for this kind of HTML construct, that is especially relevant for form validation and floating label functionality via CSS only.

    + +
    + +
    +
    + +
    + +

    + + + Input variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + + + + +
    +
    white:
    +
    + + + + +
    +
    solid:
    +
    + + + + +
    +
    outline:
    +
    + + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Input + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - Auto suggestions + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input with description + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - filled with a value + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - valid state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - invalid state (type in less than its minimum of 5 characters) + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - disabled state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    + +
    + +
    + +

    + + + Input - search type - filled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    + + + +
    + +

    + Loading Indicator +

    + +
    +

    Progress spinners (loading indicators) show the user that a longer-lasting action is being carried out.
    +Progress/Loading Indicators are used when the application executes a server request or processes data in the frontend. The component is used as soon as the execution and the resulting delay are noticeable to the user. This keeps the user aware that his or her action is being executed.

    +

    Accessibility

    +

    SVGs are often conveyed inconsistently to assistive technologies. The component’s accessibility is also highly contextual. +For optimal user experience, use the aria-description prop to let assistive technology users know the purpose of the loading spinner.

    +

    aria-live and dynamic creation of html content

    +

    Using JavaScript (e.g. in context of frameworks like Angular, VueJS or React), it is possible to dynamically change parts of a page without requiring the entire page to reload — for instance, to update a list of search results on the fly, or to display a discreet alert or notification which does not require user interaction. While these changes are usually visually apparent to users who can see the page, they may not be obvious to users of assistive technologies. ARIA live regions fill this gap and provide a way to programmatically expose dynamic content changes in a way that can be announced by assistive technologies.

    +

    aria-live triggers screen readers when an element with aria-live (or text within an element with aria-live) is added or removed from the DOM. In contrast, when you unhide a hidden element, neither elements nor text are added or removed from the DOM, so the element's aria-live property doesn’t come into play.

    +

    Note that the live region needs to be present in the markup before the notification is generated or updated. If you dynamically generate both at the same time and inject them into the page, they will generally not be announced by assistive technologies.

    +

    You also need to adapt the role and aria-live level depending on the content. Further information can be found here https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions

    +

    Recommendations

    +

    Do

    +

    If the application is waiting for a process, it makes sense to display an indicator in a central location.

    +

    Don‘t

    +

    An indicator should not be used to visualize the application waiting for user input.

    + +
    + +
    +
    + +
    + +

    + + + Loading Indicator + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size S + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for s loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size XS + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for xs loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size M + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size M + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size L + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size L + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size XL + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size XL + + + +
    + + + +
    + + +
    + +
    + +

    + + + Logo On Backgrounds + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Logo Sizes + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Logo With Following Headline + + + + +

    + + + +
    + +
    +
    + +
    + + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +

    + Progress +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Linear loader + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Linear spinner + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Linear spinner indeterminate + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + +
    + + + +
    +
    + +

    + Radio +

    + +
    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Radios + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Invalid Attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radio - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Required + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +

    + Select +

    + +
    +

    This element doesn't fulfill the styleguides definitions especially on the option elements styling, as this isn't possible x-browser without JavaScript. +If you would like to even also match those visual requirements, you would need to choose a progressive JavaScript solution on your own.

    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Select + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Select Variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select Variations Disabled + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select Variations Optgroups + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Select - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +

    + Tags +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute. These could be either one of the four feedback values, or the "point of interest" stylings.

    +

    Size

    +

    SCSS (recommended)

    +

    Extend the size placeholder in case that you don't want the default (regular): %size-Small

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    + +
    + +
    +
    + +
    + +

    + + + Tags + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + +
    + + + +
    +
    + +
    + +

    + + + Tags Small + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + +
    + + + +
    +
    + +
    + +

    + + + Tags With Icon + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + +
    + + + +
    +
    + +

    + Textarea +

    + +
    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Textarea variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + + + +
    +
    white:
    +
    + + + +
    +
    solid:
    +
    + + + +
    +
    outline:
    +
    + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Textarea + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea Disabled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea with description + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + +
    + + + +
    +
    + +
    + +

    + + + Textarea filled with a value + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - valid state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - invalid state (type in less than its minimum of 5 characters) + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +

    + Toggle +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Toggle + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle On + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle On Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/pages-intro/pages-intro.hbs b/version/v2.18.3/patterns/pages-intro/pages-intro.hbs new file mode 100644 index 0000000000..ac98c0b983 --- /dev/null +++ b/version/v2.18.3/patterns/pages-intro/pages-intro.hbs @@ -0,0 +1,55 @@ +
    + +
    + {{> elements-image src="../../images/db-ui-core_logo.png" alt="" width="48" height="48" }} + {{> elements-headline type='1' text='DB UI Core' }} + + {{{inline-remote-asset 'https://img.shields.io/badge/License-Apache_2.0-blue.svg' 'Apache 2.0 license badge' }}} + {{{inline-remote-asset 'https://img.shields.io/npm/v/@db-ui/core.svg?color=rgb%28237%2C%2028%2C%2036%29' 'npm version' }}} + {{{inline-remote-asset 'https://img.shields.io/badge/Based%20on-DB%20Design%20System%20UX%20Guides%20%2B%20Standards-d7dce1.svg' 'Based on DB UX Design System guidelines' }}} + +

    Personenverkehr und DB Systel führen ihre Design Systeme für Web in der Version 2.0 der Standard Web Components zusammen. Unser Ziel ist eine einheitliche Basis UX im Sinne der Modernen Ikone für Kunden und Mitarbeiteranwendungen. Um unser Design End 2 End von Konzeption über Design bis zur Implementierung konsistent zu halten, wird das DB UX Design System auch in Code von DB Systel und Reisendeninformation umgesetzt. Stay Tuned!

    + +
    +
    We’re not designing pages anymore. We’re designing systems of components.
    +
    {{> elements-link href="https://bradfrost.com/blog/post/bdconf-stephen-hay-presents-responsive-design-workflow/" target="_blank" rel="noopener noreferrer" value="Stephen Hay" title="Article on Stephen Hay presenting the responsive design workflow by Brad Frost" }}. + Quoted in a {{> elements-link href="https://vimeo.com/67476280" target="_blank" rel="noopener noreferrer" value="talk by Brad Frost" title="Video on vimeo of a talk by Brad Frost regarding responsive design" }} at beyond tellerrand conference.
    +
    + +

    Mit DB UI Core bieten wir robuste HTML UI Komponenten, wiederverwendbare visuelle Styles und mächtige Werkzeuge, um + vor allem Mitarbeitende der Bereiche Entwicklung, Konzeption&Design und Content Pflege&Produktion dabei zu unterstützen, + allerbeste digitale Erlebnisse zu erstellen und zu betreiben.

    + +

    Damit unsere technischen Produkte einen möglichst großen Umfang an Nutzer:innen erreichen, + haben wir uns dazu entschlossen, die Majorität unserer Dokumentation in englischer Sprache zu verfassen, + die insbesondere im Bereich der technischen Entwicklung i.d.R. geläufig ist.

    +
    + +
    + {{> elements-headline type='2' text='Core principals' }} + + {{> components-cards variant="banner" }} +
    + +
    + {{> elements-headline type='2' text='How to use' }} +

    For using DB UI Core, you need to install it as a dependency to your project and then link it within your HTML / CSS.
    + Please have a look into the Docs / Get Started(docs) for detailed instructions.
    + In case that you're developing a JavaScript application, please have a look at DB UI Elements, that's based on DB UI Core and provides Web Components for easier integration into this tech context.

    + + {{> elements-headline type='2' text='More information' }} +

    Additionally we'll provide some more information over time regrading the whole ecosystem:

    + {{> components-link-list }} + {{! TODO: Introduce these links: + How to contribute + List of contributers + }} + {{> elements-headline type='2' text='Give us your feedback!' }} +

    This is only the beta version of our framework and we really want your feedback - either within the {{> elements-link href="https://db.de/krnm74" value="DB UI Channel by Web Dev Community in Microsoft Teams (only available DB internally)" target="_blank" rel="noopener noreferrer" }}, or directly at {{> elements-link href="mailto:db-ux-designsystem@deutschebahn.com" value="db-ux-designsystem@deutschebahn.com" }}.
    + We're particularly keen to add as many examples to the behaviours as possible, to further clarify them.

    + {{> elements-headline type='2' text='Things to keep in mind' }} + {{> elements-headline type='3' text='Developed for and driven by the community' }} +

    This is mainly a platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback that we're gaining out of the community. So please support us in any way possible, this is greatly appreciated!

    +
    +
    +{{> areas-footer }} diff --git a/version/v2.18.3/patterns/pages-intro/pages-intro.markup-only.html b/version/v2.18.3/patterns/pages-intro/pages-intro.markup-only.html new file mode 100644 index 0000000000..c46350b172 --- /dev/null +++ b/version/v2.18.3/patterns/pages-intro/pages-intro.markup-only.html @@ -0,0 +1,437 @@ +
    + +
    + + + + + +

    DB UI Core

    + + Apache 2.0 license badge + npm version + Based on DB UX Design System guidelines + +

    Personenverkehr und DB Systel führen ihre Design Systeme für Web in der Version 2.0 der Standard Web Components zusammen. Unser Ziel ist eine einheitliche Basis UX im Sinne der Modernen Ikone für Kunden und Mitarbeiteranwendungen. Um unser Design End 2 End von Konzeption über Design bis zur Implementierung konsistent zu halten, wird das DB UX Design System auch in Code von DB Systel und Reisendeninformation umgesetzt. Stay Tuned!

    + +
    +
    We’re not designing pages anymore. We’re designing systems of components.
    +
    Stephen Hay + +. + Quoted in a talk by Brad Frost + + at beyond tellerrand conference.
    +
    + +

    Mit DB UI Core bieten wir robuste HTML UI Komponenten, wiederverwendbare visuelle Styles und mächtige Werkzeuge, um + vor allem Mitarbeitende der Bereiche Entwicklung, Konzeption&Design und Content Pflege&Produktion dabei zu unterstützen, + allerbeste digitale Erlebnisse zu erstellen und zu betreiben.

    + +

    Damit unsere technischen Produkte einen möglichst großen Umfang an Nutzer:innen erreichen, + haben wir uns dazu entschlossen, die Majorität unserer Dokumentation in englischer Sprache zu verfassen, + die insbesondere im Bereich der technischen Entwicklung i.d.R. geläufig ist.

    +
    + +
    + +

    Core principals

    + +
      +
    • + +
      + +
      + +

      Consistent & Compliant

      +

      DB UI Core is based on the DB UX Design System, that are the guidelines for any Personenverkehr Customer and Deutsche Bahn Enterprise website and web applications.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Accessible

      +

      DB UI Core leverages semantic HTML, ARIA roles, states and properties to apply our styles wherever possible, thus enforcing correct, accessible markup. And we're quality checking this in partnership with the Team Digital Accessibility

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Declarative

      +

      DB UI Core uses declarative selectors instead of visual helpers to ensure our HTML class names and structure are human read- and understandable, lean, performant and so much easier to update.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Decoupled

      +

      DB UI Core is decoupled from the JavaScript layer, to implement the patterns in any Web Development technology context; and we're providing universal Web Components and native JS framework components with DB UI Elements as well.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Evergreen

      +

      As DB UX Design System evolves, so does DB UI Core, meaning apps only need to keep their DB UI Core package updated to ensure the latest look and feel.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Community driven

      +

      A platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback.

      +
      +
      + +
      • +
    +
    + +
    + +

    How to use

    +

    For using DB UI Core, you need to install it as a dependency to your project and then link it within your HTML / CSS.
    + Please have a look into the Docs / Get Started(docs) for detailed instructions.
    + In case that you're developing a JavaScript application, please have a look at DB UI Elements, that's based on DB UI Core and provides Web Components for easier integration into this tech context.

    + + +

    More information

    +

    Additionally we'll provide some more information over time regrading the whole ecosystem:

    + + +

    Give us your feedback!

    +

    This is only the beta version of our framework and we really want your feedback - either within the DB UI Channel by Web Dev Community in Microsoft Teams (only available DB internally) + +, or directly at db-ux-designsystem@deutschebahn.com + +.
    + We're particularly keen to add as many examples to the behaviours as possible, to further clarify them.

    + +

    Things to keep in mind

    + +

    Developed for and driven by the community

    +

    This is mainly a platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback that we're gaining out of the community. So please support us in any way possible, this is greatly appreciated!

    +
    +
    + diff --git a/version/v2.18.3/patterns/pages-intro/pages-intro.rendered.html b/version/v2.18.3/patterns/pages-intro/pages-intro.rendered.html new file mode 100644 index 0000000000..a3f70c4885 --- /dev/null +++ b/version/v2.18.3/patterns/pages-intro/pages-intro.rendered.html @@ -0,0 +1,554 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + +
    + + + + + +

    DB UI Core

    + + Apache 2.0 license badge + npm version + Based on DB UX Design System guidelines + +

    Personenverkehr und DB Systel führen ihre Design Systeme für Web in der Version 2.0 der Standard Web Components zusammen. Unser Ziel ist eine einheitliche Basis UX im Sinne der Modernen Ikone für Kunden und Mitarbeiteranwendungen. Um unser Design End 2 End von Konzeption über Design bis zur Implementierung konsistent zu halten, wird das DB UX Design System auch in Code von DB Systel und Reisendeninformation umgesetzt. Stay Tuned!

    + +
    +
    We’re not designing pages anymore. We’re designing systems of components.
    +
    Stephen Hay + +. + Quoted in a talk by Brad Frost + + at beyond tellerrand conference.
    +
    + +

    Mit DB UI Core bieten wir robuste HTML UI Komponenten, wiederverwendbare visuelle Styles und mächtige Werkzeuge, um + vor allem Mitarbeitende der Bereiche Entwicklung, Konzeption&Design und Content Pflege&Produktion dabei zu unterstützen, + allerbeste digitale Erlebnisse zu erstellen und zu betreiben.

    + +

    Damit unsere technischen Produkte einen möglichst großen Umfang an Nutzer:innen erreichen, + haben wir uns dazu entschlossen, die Majorität unserer Dokumentation in englischer Sprache zu verfassen, + die insbesondere im Bereich der technischen Entwicklung i.d.R. geläufig ist.

    +
    + +
    + +

    Core principals

    + +
      +
    • + +
      + +
      + +

      Consistent & Compliant

      +

      DB UI Core is based on the DB UX Design System, that are the guidelines for any Personenverkehr Customer and Deutsche Bahn Enterprise website and web applications.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Accessible

      +

      DB UI Core leverages semantic HTML, ARIA roles, states and properties to apply our styles wherever possible, thus enforcing correct, accessible markup. And we're quality checking this in partnership with the Team Digital Accessibility

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Declarative

      +

      DB UI Core uses declarative selectors instead of visual helpers to ensure our HTML class names and structure are human read- and understandable, lean, performant and so much easier to update.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Decoupled

      +

      DB UI Core is decoupled from the JavaScript layer, to implement the patterns in any Web Development technology context; and we're providing universal Web Components and native JS framework components with DB UI Elements as well.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Evergreen

      +

      As DB UX Design System evolves, so does DB UI Core, meaning apps only need to keep their DB UI Core package updated to ensure the latest look and feel.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Community driven

      +

      A platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback.

      +
      +
      + +
      • +
    +
    + +
    + +

    How to use

    +

    For using DB UI Core, you need to install it as a dependency to your project and then link it within your HTML / CSS.
    + Please have a look into the Docs / Get Started(docs) for detailed instructions.
    + In case that you're developing a JavaScript application, please have a look at DB UI Elements, that's based on DB UI Core and provides Web Components for easier integration into this tech context.

    + + +

    More information

    +

    Additionally we'll provide some more information over time regrading the whole ecosystem:

    + + +

    Give us your feedback!

    +

    This is only the beta version of our framework and we really want your feedback - either within the DB UI Channel by Web Dev Community in Microsoft Teams (only available DB internally) + +, or directly at db-ux-designsystem@deutschebahn.com + +.
    + We're particularly keen to add as many examples to the behaviours as possible, to further clarify them.

    + +

    Things to keep in mind

    + +

    Developed for and driven by the community

    +

    This is mainly a platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback that we're gaining out of the community. So please support us in any way possible, this is greatly appreciated!

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.hbs b/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.hbs new file mode 100644 index 0000000000..806e4262d2 --- /dev/null +++ b/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.hbs @@ -0,0 +1,43 @@ +{{> areas-header }} +
    + + {{> elements-headline type='1' text='Dies ist eine Headline' }} +

    {{ excerpt.long }}

    + +
    + +
    + {{> elements-headline type='2' text='Dies ist eine Headline' }} + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + {{> elements-headline type='3' text='Dies ist eine Sub-Headline' }} + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + {{> elements-headline type='2' text='Dies ist eine Headline' }} + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + {{> elements-headline type='3' text='Dies ist eine Sub-Headline' }} + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + {{> elements-headline type='2' text='Dies ist eine Headline' }} + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + {{> elements-headline type='3' text='Dies ist eine Sub-Headline' }} + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, {{> elements-link href="#" value="sed diam nonumy eirmod" }} tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    + +
    +
    +{{> areas-footer }} diff --git a/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.markup-only.html b/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.markup-only.html new file mode 100644 index 0000000000..86e1e56da4 --- /dev/null +++ b/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.markup-only.html @@ -0,0 +1,775 @@ +
    + + +
    + + + + + + + UI Core +
    + +
    + + + + + Login + +
    +
    +
    + + +

    Dies ist eine Headline

    +

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    + +
    + +
    + +

    Dies ist eine Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + +

    Dies ist eine Sub-Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + +

    Dies ist eine Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + +

    Dies ist eine Sub-Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + +

    Dies ist eine Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + +

    Dies ist eine Sub-Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    + +
    +
    + diff --git a/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.rendered.html b/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.rendered.html new file mode 100644 index 0000000000..60e85b17ae --- /dev/null +++ b/version/v2.18.3/patterns/pages-sample-page/pages-sample-page.rendered.html @@ -0,0 +1,892 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + + + + + + + UI Core +
    + +
    + + + + + Login + +
    +
    +
    + + +

    Dies ist eine Headline

    +

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    + +
    + +
    + +

    Dies ist eine Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + +

    Dies ist eine Sub-Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + +

    Dies ist eine Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + +

    Dies ist eine Sub-Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + +

    Dies ist eine Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    + + +

    Dies ist eine Sub-Headline

    + +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    + +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/samples/images/header_image_0.guetzli.2x.jpg b/version/v2.18.3/samples/images/header_image_0.guetzli.2x.jpg new file mode 100644 index 0000000000..2b968349c8 Binary files /dev/null and b/version/v2.18.3/samples/images/header_image_0.guetzli.2x.jpg differ diff --git a/version/v2.18.3/samples/images/header_image_0.guetzli.3x.jpg b/version/v2.18.3/samples/images/header_image_0.guetzli.3x.jpg new file mode 100644 index 0000000000..ac8b027f77 Binary files /dev/null and b/version/v2.18.3/samples/images/header_image_0.guetzli.3x.jpg differ diff --git a/version/v2.18.3/samples/images/header_image_0.guetzli.jpg b/version/v2.18.3/samples/images/header_image_0.guetzli.jpg new file mode 100644 index 0000000000..b370ef7a5d Binary files /dev/null and b/version/v2.18.3/samples/images/header_image_0.guetzli.jpg differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.avif b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.avif new file mode 100644 index 0000000000..4b2183a0a4 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.avif differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.avif.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.avif.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.avif.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.mozjpeg.jpg b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.mozjpeg.jpg new file mode 100644 index 0000000000..af8fb1e0a7 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.mozjpeg.jpg differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.mozjpeg.jpg.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.mozjpeg.jpg.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.mozjpeg.jpg.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.webp b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.webp new file mode 100644 index 0000000000..ad5f90ac22 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.webp differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.webp.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.webp.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.1128x846.squoosh.webp.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.avif b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.avif new file mode 100644 index 0000000000..b7dab206ee Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.avif differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.avif.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.avif.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.avif.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.mozjpeg.jpg b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.mozjpeg.jpg new file mode 100644 index 0000000000..ecf9aa4dac Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.mozjpeg.jpg differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.mozjpeg.jpg.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.mozjpeg.jpg.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.mozjpeg.jpg.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.webp b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.webp new file mode 100644 index 0000000000..09dd8507f2 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.webp differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.webp.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.webp.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.376x282.squoosh.webp.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.avif b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.avif new file mode 100644 index 0000000000..ba079589f7 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.avif differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.avif.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.avif.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.avif.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.mozjpeg.jpg b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.mozjpeg.jpg new file mode 100644 index 0000000000..97093eb750 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.mozjpeg.jpg differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.mozjpeg.jpg.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.mozjpeg.jpg.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.mozjpeg.jpg.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.webp b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.webp new file mode 100644 index 0000000000..a1bb6116c5 Binary files /dev/null and b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.webp differ diff --git a/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.webp.license b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.webp.license new file mode 100644 index 0000000000..6286ade09a --- /dev/null +++ b/version/v2.18.3/samples/images/maximilian--UZa949e8LE-unsplash.752x564.squoosh.webp.license @@ -0,0 +1,3 @@ +retrieved from URL: https://unsplash.com/photos/-UZa949e8LE + +Unsplash license: https://unsplash.com/license diff --git a/version/v2.18.3/sitemap.xml b/version/v2.18.3/sitemap.xml new file mode 100644 index 0000000000..85fba4f35e --- /dev/null +++ b/version/v2.18.3/sitemap.xml @@ -0,0 +1,7 @@ + +https://db-ui.github.io/core/patterns/pages-intro/pages-intro.rendered.html +https://db-ui.github.io/core/patterns/base-colors/index.html +https://db-ui.github.io/core/patterns/base-icons/index.html +https://db-ui.github.io/core/patterns/base-type/index.html +https://db-ui.github.io/core/patterns/elements/index.html +https://db-ui.github.io/core/patterns/components/index.html diff --git a/version/v2.18.3/styleguide/css/pattern-lab.css b/version/v2.18.3/styleguide/css/pattern-lab.css new file mode 100644 index 0000000000..4e7125e908 --- /dev/null +++ b/version/v2.18.3/styleguide/css/pattern-lab.css @@ -0,0 +1 @@ +@charset "UTF-8";.pl-c-body *{-webkit-box-sizing:border-box;box-sizing:border-box}button[class|=pl-c]{font-size:inherit;background-color:transparent}.pl-c-html{min-height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;height:100%}.pl-c-body{margin:0;padding:0;width:100%;-webkit-text-size-adjust:100%;display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-body--theme-dark,:root{--theme-bg:#161b3c;--theme-primary:#464a6d;--theme-secondary:#161f50;--theme-text:white;--theme-text-rgb:255,255,255;--theme-border:rgba(255, 255, 255, 0.2)}.pl-c-body--theme-light{--theme-bg:white;--theme-secondary:white;--theme-text:#262829;--theme-text-rgb:38,40,41;--theme-primary:white;--theme-border:#ddd}.pl-c-tabs__panel pre[class*=language-]{background-image:-webkit-gradient(linear,left top, right top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,right top, left top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left top, right top,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,right top, left top,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,left top, left bottom,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left bottom, left top,from(#fff),to(rgba(255,255,255,0))),-webkit-gradient(linear,left top, left bottom,from(#eaf0f6),to(rgba(238,238,238,0))),-webkit-gradient(linear,left bottom, left top,from(#eaf0f6),to(rgba(238,238,238,0)));background-image:linear-gradient(to right,#fff,rgba(255,255,255,0)),linear-gradient(to left,#fff,rgba(255,255,255,0)),linear-gradient(to right,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to left,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to bottom,#fff,rgba(255,255,255,0)),linear-gradient(to top,#fff,rgba(255,255,255,0)),linear-gradient(to bottom,#eaf0f6,rgba(238,238,238,0)),linear-gradient(to top,#eaf0f6,rgba(238,238,238,0));background-color:#fff;background-attachment:local,local,scroll,scroll,local,local,scroll,scroll;background-position:0 0,100% 0,0 0,100% 0,0 0,0 100%,0 0,0 100%;background-size:4em 100%,4em 100%,1em 100%,1em 100%,100% 4em,100% 4em,100% 1em,100% 1em;background-repeat:no-repeat;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;overflow:auto;max-height:100%}.pl-c-tabs__panel code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{color:#000;text-shadow:0 1px #fff;font-family:Consolas,Monaco,"Andale Mono",monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;word-wrap:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}.pl-c-tabs__panel code[class*=language-] ::-moz-selection,.pl-c-tabs__panel code[class*=language-]::-moz-selection,.pl-c-tabs__panel pre[class*=language-] ::-moz-selection,.pl-c-tabs__panel pre[class*=language-]::-moz-selection{text-shadow:none;background-color:#b3d4fc}.pl-c-tabs__panel code[class*=language-] ::-moz-selection, .pl-c-tabs__panel code[class*=language-]::-moz-selection, .pl-c-tabs__panel pre[class*=language-] ::-moz-selection, .pl-c-tabs__panel pre[class*=language-]::-moz-selection{text-shadow:none;background-color:#b3d4fc}.pl-c-tabs__panel code[class*=language-] ::selection,.pl-c-tabs__panel code[class*=language-]::selection,.pl-c-tabs__panel pre[class*=language-] ::selection,.pl-c-tabs__panel pre[class*=language-]::selection{text-shadow:none;background-color:#b3d4fc}@media print{.pl-c-tabs__panel code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{text-shadow:none}}.pl-c-tabs__panel pre[class*=language-]{padding:1em;margin:.5em 0;overflow:scroll}.pl-c-tabs__panel :not(pre)>code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{background-color:#f5f2f0}.pl-c-tabs__panel :not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em}.pl-c-tabs__panel .token.cdata,.pl-c-tabs__panel .token.comment,.pl-c-tabs__panel .token.doctype,.pl-c-tabs__panel .token.prolog{color:#708090}.pl-c-tabs__panel .token.punctuation{color:#999}.pl-c-tabs__panel .namespace{opacity:.7}.pl-c-tabs__panel .token.boolean,.pl-c-tabs__panel .token.constant,.pl-c-tabs__panel .token.deleted,.pl-c-tabs__panel .token.number,.pl-c-tabs__panel .token.property,.pl-c-tabs__panel .token.symbol,.pl-c-tabs__panel .token.tag{color:#905}.pl-c-tabs__panel .token.attr-name,.pl-c-tabs__panel .token.builtin,.pl-c-tabs__panel .token.char,.pl-c-tabs__panel .token.inserted,.pl-c-tabs__panel .token.selector,.pl-c-tabs__panel .token.string{color:#690}.pl-c-tabs__panel .language-css .token.string,.pl-c-tabs__panel .style .token.string,.pl-c-tabs__panel .token.entity,.pl-c-tabs__panel .token.operator,.pl-c-tabs__panel .token.url{color:#a67f59;background-color:rgba(255,255,255,.5)}.pl-c-tabs__panel .token.atrule,.pl-c-tabs__panel .token.attr-value,.pl-c-tabs__panel .token.keyword{color:#07a}.pl-c-tabs__panel .token.function{color:#dd4a68}.pl-c-tabs__panel .token.important,.pl-c-tabs__panel .token.regex,.pl-c-tabs__panel .token.variable{color:#e90}.pl-c-tabs__panel .token.bold,.pl-c-tabs__panel .token.important{font-weight:700}.pl-c-tabs__panel .token.italic{font-style:italic}.pl-c-tabs__panel .token.entity{cursor:help}.pl-c-tabs__panel pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}.pl-c-tabs__panel pre.line-numbers>code{position:relative}.pl-c-tabs__panel .line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pl-c-tabs__panel .line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.pl-c-tabs__panel .line-numbers-rows>span::before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}.pl-c-tabs__panel .token a{color:inherit}pl-nav{background-color:inherit;display:block;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media all and (min-width:42em){pl-nav{padding:0;display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-body--theme-sidebar pl-nav{display:block;max-height:100%;overflow-y:scroll}.pl-c-nav{overflow:hidden;max-height:0;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;background-color:inherit;position:absolute;left:0;top:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-transition:max-height .1s ease-out;transition:max-height .1s ease-out;-ms-flex-negative:1;flex-shrink:1;visibility:hidden;-webkit-transition:opacity 0 .2s ease-out,-webkit-transform .2s ease-out;transition:opacity 0 .2s ease-out,-webkit-transform .2s ease-out;transition:transform .2s ease-out,opacity 0 .2s ease-out;transition:transform .2s ease-out,opacity 0 .2s ease-out,-webkit-transform .2s ease-out}.pl-c-nav.pl-is-active{max-height:calc(95vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(95vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (max-width:42em){.pl-c-nav{position:fixed;top:44px;bottom:0;height:auto;z-index:-1}}.pl-c-nav.pl-is-active{visibility:visible;opacity:1}.pl-c-body--theme-sidebar .pl-c-nav{display:block;display:-webkit-box;display:-ms-flexbox;display:flex;overflow:hidden;visibility:visible;-ms-flex-negative:0;flex-shrink:0}@media all and (min-height:500px){.pl-c-body--theme-sidebar .pl-c-nav{-ms-flex-negative:1;flex-shrink:1}}@media all and (max-width:42em){.pl-c-body--theme-sidebar .pl-c-nav{max-width:240px;position:fixed;top:44px;bottom:0;height:auto;max-height:calc(100% - 2rem);overflow:auto;-webkit-overflow-scrolling:touch;-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:all .3s ease;transition:all .3s ease;opacity:0;-webkit-box-shadow:0 3px 6px rgba(21,22,25,.16),0 3px 6px rgba(21,22,25,.23);box-shadow:0 3px 6px rgba(21,22,25,.16),0 3px 6px rgba(21,22,25,.23);visibility:visible}.pl-c-body--theme-sidebar .pl-c-nav.pl-is-active{-webkit-transform:translateX(0);transform:translateX(0);opacity:1;-webkit-transition:-webkit-transform .2s ease-out;transition:-webkit-transform .2s ease-out;transition:transform .2s ease-out;transition:transform .2s ease-out, -webkit-transform .2s ease-out}}@media all and (max-width:42em){.pl-c-nav.is-open{padding-top:1rem;padding-bottom:1rem}}@media all and (min-width:42em){.pl-c-nav{overflow:visible;max-height:none;visibility:visible}.pl-c-nav.is-open{overflow:visible}}@media all and (max-width:41em){.pl-c-nav.is-open{-webkit-box-shadow:0 2px 4px #000;box-shadow:0 2px 4px #000}.pl-c-body--theme-light .pl-c-nav.is-open{-webkit-box-shadow:0 2px 4px #a6a6a6;box-shadow:0 2px 4px #a6a6a6}}@media all and (min-width:42em){.pl-c-nav.is-open{max-height:none}}@media all and (min-width:42em){.pl-c-nav{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;top:auto;width:auto;-webkit-box-shadow:none;box-shadow:none}}.pl-c-nav__link{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:inherit;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;border:0;text-align:left;text-decoration:none;cursor:pointer;outline:0;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0;color:inherit;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;padding:.6rem .6rem;-ms-flex-preferred-size:calc(100% - 2.5rem);flex-basis:calc(100% - 2.5rem);position:relative;height:var(--nav-item-height,auto)}.pl-c-nav__link.pl-is-active:hover,.pl-c-nav__link:hover{background-color:rgba(0,0,0,.1)}.pl-c-body--theme-density-cozy .pl-c-nav__link{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-nav__link{font-size:.85rem;padding:1.5rem 1rem}.pl-c-nav__link::after{content:"";pointer-events:none;opacity:0;background-color:currentColor;-webkit-transition:opacity .1s ease-out;transition:opacity .1s ease-out;position:absolute;top:0;left:0;bottom:0;right:0;display:block}.pl-c-nav__link:hover::after{opacity:.1}.pl-c-nav__link:focus::after{opacity:.1}.pl-c-nav__link:focus{outline-offset:-1px;outline:1px dotted}.pl-c-body--theme-sidebar .pl-c-nav__link--level-0{padding-left:1.45rem}@media all and (max-width:42em){.pl-c-nav__link--level-0{padding-left:1.45rem}}.pl-c-nav__link--level-1{padding-left:1.5rem;font-size:.85rem}.pl-c-nav__link--level-2{font-size:.825rem;padding-left:2.25rem}.pl-c-nav__link--title{font-size:.8rem;color:#ccc;color:var(--theme-text,#ccc)}.pl-c-nav__link--title>.pl-c-nav__link-icon{font-size:inherit}.pl-c-body--theme-light .pl-c-nav__link--title{color:#000;color:var(--theme-text)}.pl-c-nav__link.is-active:not(.pl-c-nav__link--title){-webkit-box-shadow:inset 4px 0 0 #6c79d9;box-shadow:inset 4px 0 0 #6c79d9}@media all and (min-width:42em){.pl-c-body--theme-horizontal .pl-c-nav__link.is-active:not(.pl-c-nav__link--title).pl-c-nav__link--level-0{-webkit-box-shadow:inset 0 -4px 0 #6c79d9;box-shadow:inset 0 -4px 0 #6c79d9}}.pl-c-nav__link-text{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;pointer-events:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-nav__link-icon{margin-top:-.5rem;margin-bottom:-.5rem;pointer-events:none;color:currentColor;display:inline;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0;line-height:0;font-size:1.3rem}.pl-c-nav__link.is-open>.pl-c-nav__link-icon,.pl-c-nav__link.is-open~.pl-c-nav__link>.pl-c-nav__link-icon{-webkit-transform:rotate(0);transform:rotate(0)}.pl-c-nav__link:first-child:not(.is-open)~.pl-c-nav__list--panel .pl-c-nav__link{visibility:hidden}.is-open~.pl-c-nav__list--panel .pl-c-nav__link{visibility:visible}.pl-c-nav__link--icon-only{position:relative;width:2.5rem!important;height:2.5rem!important;padding:0!important;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:0;-ms-flex-preferred-size:2.5rem;flex-basis:2.5rem;right:0;border:2px solid transparent!important;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:currentColor}.pl-c-nav__link--icon-only::before{opacity:.1;right:2.4rem;width:1px;left:auto;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pl-c-nav__link--icon-only::after{opacity:0;width:2.5rem;left:50%;-webkit-transform:translateY(-50%) translateX(-50%);transform:translateY(-50%) translateX(-50%)}.pl-c-nav__link--icon-only::after,.pl-c-nav__link--icon-only::before{height:2.5rem;-webkit-transition:opacity .1s ease-out;transition:opacity .1s ease-out;content:"";display:block;position:absolute;top:50%;background-color:currentColor}.pl-c-nav__link--icon-only:hover::after,.pl-c-nav__link--icon-only:hover:focus::after{opacity:.1}.pl-c-nav__link--icon-only:focus{outline-offset:-1px;outline:1px dotted}.pl-c-nav__list{z-index:1;margin:0;padding:0;list-style:none;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:100%;max-width:100%;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;background-color:inherit}@media all and (min-width:42em){.pl-c-nav__list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}}.pl-c-nav__list-item{background-color:inherit;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-flow:row wrap;flex-flow:row wrap;width:100%}@media all and (min-width:42em){.pl-c-nav__dropdown{position:absolute;top:100%;left:0;min-width:14rem;border-radius:6px;border-style:solid;border-width:1px;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.1);box-shadow:0 2px 5px rgba(0,0,0,.1);-webkit-transition:all .2s ease;transition:all .2s ease;-webkit-transform:translateY(-12px);transform:translateY(-12px);z-index:1;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-body--theme-sidebar .pl-c-nav__dropdown{position:relative}}.pl-c-body--theme-light .pl-c-nav__dropdown{border-color:rgba(0,0,0,.2)}.pl-c-body--theme-dark .pl-c-nav__dropdown{border-color:rgba(255,255,255,.2)}.pl-c-body--theme-sidebar .pl-c-nav__dropdown{border-width:0;-webkit-transform:none;transform:none;-webkit-box-shadow:none;box-shadow:none;border-radius:0}.pl-c-nav__accordion{background-color:inherit;list-style:none;margin:0;padding:0;overflow:hidden;max-height:0;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row wrap;flex-flow:row wrap;opacity:0;visibility:hidden}.pl-c-nav__accordion.pl-is-active{max-height:calc(95vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(95vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}.is-open~.pl-c-nav__accordion{visibility:visible;max-height:none;-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.pl-c-body--theme-horizontal .is-open~.pl-c-nav__accordion{overflow:auto}@media all and (min-width:42em){.pl-c-body--theme-horizontal .is-open~.pl-c-nav__accordion{max-height:calc(100vh - 2rem - 2rem)}}pl-search{background-color:inherit;top:0;-ms-flex-negative:0;flex-shrink:0;padding:.4rem .5rem;display:inline-block;-ms-flex-item-align:stretch;align-self:stretch;-webkit-transition:all .2s ease;transition:all .2s ease}@media screen and (min-width:42em){pl-search{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-negative:1;flex-shrink:1;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;-ms-flex-item-align:center;align-self:center}pl-search:focus-within{-ms-flex-negative:0.5;flex-shrink:0.5}.pl-c-body--theme-sidebar pl-search{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-left:0;width:100%;margin-bottom:.5rem}}.pl-c-typeahead{width:100%;background-color:inherit;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;z-index:10;text-transform:capitalize;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:#fafafa;position:relative}.pl-c-body--theme-light .pl-c-typeahead{color:#222}@media screen and (min-width:42em){.pl-c-typeahead{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.pl-c-body--theme-sidebar .pl-c-typeahead{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.pl-c-typeahead__hint{top:0;left:0;right:0;width:100%}.pl-c-typeahead__hint,.pl-c-typeahead__input{text-transform:capitalize;background-color:#222;color:#fff;background-color:rgba(var(--theme-text-rgb),.05);color:rgba(var(--theme-text-rgb),.67);border-color:rgba(0,0,0,.1);border-color:rgba(var(--theme-text-rgb),.17);text-overflow:ellipsis;border-width:1px;border-style:solid;-webkit-transition:all .1s ease;transition:all .1s ease;max-width:100%;padding:.4rem .5rem;font-size:16px;width:100%;outline-offset:-3px;outline-width:2px;border-radius:3px;-webkit-appearance:none}@media all and (min-width:900px){.pl-c-typeahead__hint,.pl-c-typeahead__input{font-size:inherit}}.pl-c-typeahead__hint::-ms-clear,.pl-c-typeahead__input::-ms-clear{display:none}.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{border-radius:0}.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.7rem}@media all and (min-width:42em){.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__hint,.pl-c-typeahead__input-wrapper--with-clear-button .pl-c-typeahead__input{padding-right:1.4rem}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__hint,.pl-c-body--theme-sidebar .pl-c-typeahead__input{max-width:none}}.pl-c-body--theme-light .pl-c-typeahead__hint,.pl-c-body--theme-light .pl-c-typeahead__input{background-color:#eee;background-color:rgba(var(--theme-text-rgb),.05);color:#4d4c4c;color:rgba(var(--theme-text-rgb),.67)}.pl-c-body--theme-light .pl-c-typeahead__hint::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input::-webkit-input-placeholder{color:#000!important;-webkit-transition:all .1s ease;transition:all .1s ease}.pl-c-body--theme-light .pl-c-typeahead__hint::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input::-moz-input-placeholder{color:#000!important;-moz-transition:all .1s ease;transition:all .1s ease}.pl-c-typeahead__hint::-webkit-input-placeholder,.pl-c-typeahead__input::-webkit-input-placeholder{color:#fff!important;-webkit-transition:all .1s ease;transition:all .1s ease}.pl-c-typeahead__hint::-moz-input-placeholder,.pl-c-typeahead__input::-moz-input-placeholder{color:#fff!important;-moz-transition:all .1s ease;transition:all .1s ease}.pl-c-typeahead__hint:focus,.pl-c-typeahead__hint:hover,.pl-c-typeahead__input:focus,.pl-c-typeahead__input:hover{color:#fff}.pl-c-body--theme-light .pl-c-typeahead__hint:focus,.pl-c-body--theme-light .pl-c-typeahead__hint:hover,.pl-c-body--theme-light .pl-c-typeahead__input:focus,.pl-c-body--theme-light .pl-c-typeahead__input:hover{color:#222!important}.pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#fff!important}.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__hint:hover::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:focus::-webkit-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-moz-input-placeholder,.pl-c-body--theme-light .pl-c-typeahead__input:hover::-webkit-input-placeholder{color:#222!important}.pl-c-typeahead__menu{overflow:hidden;max-height:0;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;background-color:#222;background-color:var(--theme-primary);color:var(--theme-text);text-transform:capitalize;position:absolute;min-width:100%;width:100%;overflow:hidden;top:100%;right:0;max-height:0;display:block!important;-webkit-transition:max-height .3s ease,opacity .3s ease;transition:max-height .3s ease,opacity .3s ease;opacity:0}.pl-c-typeahead__menu.pl-is-active{max-height:calc(95vh - 2rem - 1rem);max-height:calc(var(--pl-viewport-height,calc(95vh - 2rem)) - 1rem);overflow:auto;-webkit-overflow-scrolling:touch}@media all and (min-width:42em){.pl-c-typeahead__menu{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-body--theme-light .pl-c-typeahead__menu{background-color:#fafafa}.pl-c-typeahead__menu.pl-is-open{max-height:90vh;overflow:auto;opacity:1}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__menu{position:relative!important;border-radius:0}}@media all and (max-width:41em){.pl-c-typeahead__menu{position:relative!important}}.pl-c-typeahead__results{list-style:none;margin:0;padding:0;background-color:inherit;border-color:transparent;border-width:1px;border-style:solid;overflow:hidden;border-color:#151515}@media all and (min-width:42em){.pl-c-typeahead__results{border-bottom-right-radius:6px;border-bottom-left-radius:6px}}.pl-c-typeahead__results:empty{border-width:0;max-height:0}.pl-c-body--theme-light .pl-c-typeahead__results{border-color:#ccc}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-typeahead__results{border-radius:0}}.pl-c-typeahead__result{-webkit-transition:all .3s ease;transition:all .3s ease;background-color:inherit;padding:.5rem .75rem;cursor:pointer;overflow:hidden;font-size:.8rem;color:inherit}.pl-c-typeahead__result:last-child{border-bottom-right-radius:6px;border-bottom-left-radius:6px}@media all and (max-width:41em){.pl-c-typeahead__result:last-child{border-radius:0}}.pl-c-body--theme-sidebar .pl-c-typeahead__result:last-child{border-radius:0}.pl-c-typeahead__result:hover{background-color:rgba(255,255,255,.15)}.pl-c-body--theme-light .pl-c-typeahead__result:hover{background-color:#eee}.pl-c-typeahead__result:active,.pl-c-typeahead__result:focus{background-color:rgba(255,255,255,.18)}.pl-c-body--theme-light .pl-c-typeahead__result:active,.pl-c-body--theme-light .pl-c-typeahead__result:focus{background-color:#ddd}.pl-c-typeahead__result.pl-has-cursor{color:#fff;background-color:rgba(255,255,255,.25)}.pl-c-body--theme-light .pl-c-typeahead__result.pl-has-cursor{color:#000;background-color:#ddd}.pl-c-typeahead__input-wrapper{position:relative;-ms-flex-negative:1;flex-shrink:1}.pl-c-typeahead__clear-button{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:inherit;text-decoration:none;line-height:1;padding:.7rem .5rem;border:0;text-align:left;-webkit-transition:background-color .1s ease-out,color .1s ease-out;transition:background-color .1s ease-out,color .1s ease-out;cursor:pointer;height:1.7rem;width:1.7rem;background-color:transparent;border-radius:20rem;overflow:hidden;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:100;cursor:pointer;border:0;-webkit-transition:opacity .1s ease;transition:opacity .1s ease;opacity:0;visibility:hidden}.pl-c-typeahead__clear-button.pl-is-active:hover,.pl-c-typeahead__clear-button:hover{background-color:rgba(0,0,0,.1)}.pl-c-body--theme-density-cozy .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.2rem .8rem}.pl-c-body--theme-density-comfortable .pl-c-typeahead__clear-button{font-size:.85rem;padding:1.5rem 1rem}.pl-c-typeahead__clear-button:active,.pl-c-typeahead__clear-button:hover{background-color:transparent}@media all and (min-width:42em){.pl-c-typeahead__clear-button{height:1.4rem;width:1.4rem}}.pl-c-body--theme-light .pl-c-typeahead__clear-button{background-color:transparent}.pl-c-body--theme-light .pl-c-typeahead__clear-button:active,.pl-c-body--theme-light .pl-c-typeahead__clear-button:hover{background-color:transparent}.pl-c-typeahead__clear-button.pl-is-visible{opacity:1;visibility:visible}.pl-c-typeahead__clear-button-icon{fill:currentColor;line-height:0;font-size:0;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}.pl-has-annotation{cursor:help!important;outline:1px dotted #808080;outline-offset:-4px;-webkit-transition:-webkit-box-shadow .1s ease;transition:-webkit-box-shadow .1s ease;transition:box-shadow .1s ease;transition:box-shadow .1s ease, -webkit-box-shadow .1s ease}.pl-has-annotation a,.pl-has-annotation input{cursor:help!important}.pl-has-annotation:hover{-webkit-box-shadow:0 0 3px grey;box-shadow:0 0 3px grey}.pl-has-annotation.active{-webkit-box-shadow:inset 0 0 6px #4d4c4c;box-shadow:inset 0 0 6px #4d4c4c;outline:1px dotted #808080;outline-offset:-1px}.pl-c-annotation-tip{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px!important;height:24px!important;margin-top:6px!important;margin-left:6px!important;border-radius:50%!important;background-color:#222!important;color:#fff!important;font-size:16px!important;position:absolute;z-index:100}.pl-c-annotation-tip:not([hidden]){display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-annotations{margin:1rem 0}.pl-c-annotations__title{font-size:1.2rem!important;margin:0 0 .5rem}.pl-c-annotations .pl-c-annotations__list{counter-reset:the-count;padding:0;margin:0;list-style:none}.pl-c-annotations__item{position:relative;padding-left:1.5rem;margin-bottom:1rem;border-radius:6px;-webkit-transition:background-color .1s ease;transition:background-color .1s ease}.pl-c-annotations__item::before{content:counter(the-count);counter-increment:the-count;font-size:85%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:14px;height:14px;border-radius:50%;padding:2px;text-align:center;background-color:grey;color:#fff;position:absolute;top:4px;left:0}.pl-c-annotations__item.pl-is-active{outline:1px dotted #808080;outline-offset:-1px}.pl-c-annotations .pl-c-annotations__item-title{margin-bottom:0}.pl-c-breadcrumb{list-style:none;margin:0;padding:0;margin-bottom:.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:.9rem;color:inherit;text-transform:capitalize}.pl-c-breadcrumb__item{color:inherit}.pl-c-breadcrumb__item::after{content:"▶";opacity:.4;font-size:6px;display:inline-block;margin:0 .2rem;position:relative;top:-1px}.pl-c-category{margin-top:6rem;font-family:"Open Sans",HelveticaNeue,Helvetica,Arial,sans-serif!important}.pl-c-category:first-of-type{margin-top:2rem}.pl-c-category+.pl-c-category{margin-top:2rem}.pl-c-category__title{font-size:1.4rem!important;color:#222!important;margin:0 0 .2rem;text-transform:capitalize}.pl-c-category__title:hover{color:#4d4c4c!important}.pl-c-category__title-link{-webkit-transition:color .1s ease-out;transition:color .1s ease-out;color:inherit}.pl-c-category__description{font-size:.85rem;line-height:1.5;max-width:30rem}.pl-c-category__description:empty{display:none}.pl-c-pattern-info{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.pl-c-pattern .pl-c-pattern-info{max-height:30rem;overflow:scroll;display:block;-webkit-overflow-scrolling:touch}@media all and (min-width:53em){.pl-c-pattern .pl-c-pattern-info{max-height:none;height:18rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;overflow:visible}}.pl-c-drawer .pl-c-pattern-info{overflow:auto;-webkit-overflow-scrolling:touch;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media all and (min-width:53em){.pl-c-drawer .pl-c-pattern-info{position:static;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.pl-c-pattern-info__panel{padding:.5rem;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}pl-drawer .pl-c-pattern-info__panel{padding:1rem}@media all and (min-width:53em){.pl-c-pattern-info__panel{-ms-flex-preferred-size:50%;flex-basis:50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1.5rem}}@media all and (min-width:53em){.pl-c-pattern-info__panel--info{overflow:auto;-webkit-overflow-scrolling:touch}}@media all and (min-width:62em){.pl-c-pattern-info__panel--info{min-width:50%}}.pl-c-pattern-info__panel--code:first-child,.pl-c-pattern-info__panel--info+.pl-c-pattern-info__panel--code{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;min-width:50%}@media all and (max-width:53em){.pl-c-pattern-info__panel--info+.pl-c-pattern-info__panel--code{padding-top:0}}.pl-c-pattern-info__header{margin-bottom:.5rem}.pl-c-pattern-info__title{font-size:1.4rem!important;font-weight:700;margin-top:0;margin-bottom:0;color:inherit;text-transform:capitalize;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-pattern-info__description{border-bottom-color:grey}.pl-c-annotations{border-top-color:grey}.pl-c-lineage{font-size:1rem;line-height:1.7;margin-top:0}.pl-c-lineage__link{font-style:italic;color:inherit;text-decoration:underline;display:inline;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-lineage__link:focus,.pl-c-lineage__link:hover{opacity:.8}.pl-c-pattern-state{width:.5em;height:.5em;margin-left:.5em;border-radius:50%;display:inline-block;background-color:#02a4d5}.pl-c-pattern-state--complete{background-color:#03790f}.pl-c-pattern-state--inreview{background-color:#c7a118}.pl-c-pattern-state--inprogress{background-color:#b00b02}.pl-c-pattern-state--deprecated{background-color:#b00b02}.complete::before{color:#03790f!important}.pl-c-pattern{margin-bottom:2rem;position:relative;clear:both}.pl-c-pattern__header{position:relative;padding:.5rem 0 0;line-height:1.3;font-size:90%;color:#737373;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.pl-c-pattern__header:empty{padding:0}.pl-c-pattern__title{font-family:"Open Sans",HelveticaNeue,Helvetica,Arial,sans-serif!important;font-size:.85rem!important;line-height:1!important;font-weight:400!important;margin:0!important;padding:0!important;text-transform:capitalize!important}.pl-c-pattern__title-link{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:1rem 0 .3rem;color:#737373!important;text-decoration:none;cursor:pointer}.pl-c-pattern__title-link:focus,.pl-c-pattern__title-link:hover{color:#000!important}.pl-c-pattern__extra-toggle{font-size:.8rem;margin-bottom:-1px;padding:.4rem .5rem;padding-right:1.75rem;color:#737373;background-color:transparent;cursor:pointer;font-weight:400;-webkit-transition:all .1s ease-out;transition:all .1s ease-out;font-family:"Open Sans",HelveticaNeue,Helvetica,Arial,sans-serif;border-color:#ddd;border-width:1px;border-style:solid;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pl-c-pattern__extra-toggle.pl-is-active,.pl-c-pattern__extra-toggle:focus,.pl-c-pattern__extra-toggle:hover{background-color:#fafafa;color:#000}.pl-c-pattern__extra-toggle:focus{outline:1px dotted #4d4c4c;outline-offset:-1px}.pl-c-pattern__extra-toggle.pl-is-active{border-bottom-color:#fafafa}.pl-c-pattern__toggle-icon{height:.9rem;width:.9rem;display:inline-block;vertical-align:middle;position:absolute;right:.625rem;-webkit-transition:opacity .1s linear;transition:opacity .1s linear}.pl-c-pattern__toggle-icon--expand{z-index:1}.pl-is-active .pl-c-pattern__toggle-icon--expand{opacity:0}.pl-c-pattern__toggle-icon--collapse{opacity:0;z-index:2;height:1rem;width:1rem}.pl-is-active .pl-c-pattern__toggle-icon--collapse{opacity:1}.pl-c-pattern__extra-toggle-text~svg{margin-left:.25rem}.pl-c-pattern__extra-toggle-text--collapse{display:none}.pl-is-active .pl-c-pattern__extra-toggle-text--collapse{display:inline-block}.pl-c-pattern__extra-toggle-text--expand{display:inline-block}.pl-is-active .pl-c-pattern__extra-toggle-text--expand{display:none}.pl-c-pattern__extra{background-color:#fafafa;border-top:1px solid #ddd;margin-bottom:1rem;overflow:hidden;max-height:1px;position:relative;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-pattern__extra.pl-is-active{border:1px solid #ddd;border-radius:6px;border-top-right-radius:0;max-height:9999px}.pl-c-tabs{padding:0 .5rem .5rem;background-color:#fff;border:1px solid #ddd;border-radius:6px;font-family:"Open Sans",HelveticaNeue,Helvetica,Arial,sans-serif;position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-height:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.pl-c-tabs__list{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;list-style:none;margin:0;padding:.5rem 0;background-color:#fff}.pl-c-tabs__link{display:block;line-height:1;padding:.2rem .4rem;border:1px solid transparent;border-radius:6px;color:#737373;background-color:#fff;cursor:pointer;text-decoration:none;text-transform:lowercase;-webkit-transition:all .1s ease-out;transition:all .1s ease-out}.pl-c-tabs__link:hover{color:#222}.pl-c-tabs__link.pl-is-active-tab{color:#222;background-color:#eee;border:1px solid #ddd}.pl-c-tabs__header{position:-webkit-sticky;position:sticky;z-index:1;top:0;border-top:1px solid #ddd;margin-left:calc(-.5rem - 1px);margin-right:calc(-.5rem - 1px);padding-left:.5rem;padding-right:.5rem;border:1px solid #ddd;margin-bottom:.5rem;margin-top:-1px;background-color:inherit;border-top-left-radius:5px;border-top-right-radius:5px}.pl-c-tabs__content{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-preferred-size:auto;flex-basis:auto;-webkit-overflow-scrolling:touch;overflow-y:auto}.pl-c-drawer .pl-c-tabs__content{border:0}.pl-c-tabs__panel{display:none;width:100%;max-height:100%}.pl-c-tabs__panel.pl-is-active-tab{display:block}.pl-c-tabs__panel :not(pre)>code[class*=language-],.pl-c-tabs__panel pre[class*=language-]{background-color:transparent;margin:0;padding:0;border:0;display:block;width:100%;min-height:100%}.pl-c-tabs__panel code[class*=language-]{background-color:transparent;margin:0}.pl-c-text-passage{font-size:.85rem;line-height:1.7}.pl-c-text-passage p{margin-top:0;margin-bottom:1rem}.pl-c-text-passage p:last-child{margin-bottom:0}.pl-c-text-passage a{color:#737373;text-decoration:underline;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.pl-c-text-passage a:focus,.pl-c-text-passage a:hover{opacity:.8}.pl-c-text-passage code[class*=language-],.pl-c-text-passage pre[class*=language-]{color:inherit}.pl-c-text-passage blockquote{padding-left:.8rem;border-left:3px solid inherit}.pl-c-text-passage hr{height:1px;background-color:grey;margin:2rem 0;border:0}.pl-c-text-passage h1{margin-bottom:1rem;font-weight:400}.pl-c-text-passage h2{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h3{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h4{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h5{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage h6{margin:1rem 0 1rem;font-weight:400}.pl-c-text-passage ul{list-style:square;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ul li:last-child{margin-bottom:0}.pl-c-text-passage ol{list-style:decimal;margin-left:.9rem;margin-bottom:1rem}.pl-c-text-passage ol li:last-child{margin-bottom:0}.pl-c-text-passage li{margin-bottom:.5rem}.pl-c-text-passage table{width:100%;max-width:100%;border-collapse:collapse;overflow-x:auto;margin:.75rem auto}.pl-c-text-passage tr:nth-of-type(odd){background:#eee}.pl-c-text-passage th{background:#ddd;color:#000;font-weight:700}.pl-c-text-passage td,.pl-c-text-passage th{padding:10px;border:1px solid #ccc;text-align:left}.pl-c-code-copy-btn{display:inline-block;position:absolute;top:.4rem;right:.5rem;padding:.2rem .4rem;background-color:#eee;color:#222;border:1px solid #ddd;border-radius:6px;font-family:"Open Sans",HelveticaNeue,Helvetica,Arial,sans-serif;font-size:1rem;text-transform:lowercase;line-height:1;cursor:pointer;z-index:2;-webkit-transition:background-color .1s ease-out;transition:background-color .1s ease-out}.pl-c-code-copy-btn:focus,.pl-c-code-copy-btn:hover{background-color:#ccc}.pl-c-code-copy-btn__icon{height:1em;width:1em}.pl-c-code-copy-btn__icon--paste{display:none}.is-copied .pl-c-code-copy-btn__icon--paste{display:inline-block}.pl-c-code-copy-btn__icon--copy{display:inline-block}.is-copied .pl-c-code-copy-btn__icon--copy{display:none}.pl-c-body{overflow:hidden}.pl-c-main{min-height:100vh;max-width:100vw;padding-left:.5rem;padding-right:.5rem}.pl-c-main::after{clear:both;content:"";display:table}/** * Header */ /** * Tools dropdown */ /** * Nav link dropdown */ /** * Size input */ /** * Typeahead container */ /** * Typeahead input */ /** * Modal close button * 1) Closes the modal popup */ .pl-c-body--theme-light .pl-c-header{background-color:#fff;border-bottom:1px solid #ccc}@media all and (max-width:41em){.pl-c-body--theme-light .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}}.pl-c-body--theme-light:not(.pl-c-body--theme-sidebar) .pl-c-tools__list.pl-is-active{border-bottom:1px solid #ccc;border-left:1px solid #ccc}.pl-c-body--theme-light .pl-c-nav__link--dropdown{color:inherit}.pl-c-body--theme-light .pl-c-nav__link--dropdown::after{color:inherit}.pl-c-body--theme-light .pl-c-viewport-size__input{color:#4d4c4c}.pl-c-body--theme-light .pl-c-viewport-size__input:focus,.pl-c-body--theme-light .pl-c-viewport-size__input:hover{background-color:#ddd}.pl-c-body--theme-light .typeahead{background-color:#ddd!important}.pl-c-body--theme-light .tt-input{background-color:#eee!important;color:#4d4c4c!important}.pl-c-body--theme-light .tt-input:hover{color:#222;background-color:#ddd!important}.pl-c-body--theme-light .tt-input:hover::-webkit-input-placeholder{color:#222}.pl-c-body--theme-light .tt-input:hover::-moz-input-placeholder{color:#222}.pl-c-body--theme-light .pl-c-drawer__close-btn,.pl-c-body--theme-light .pl-c-tools__action{background-color:#fff}.pl-c-body--theme-light .pl-c-drawer__close-btn:focus,.pl-c-body--theme-light .pl-c-drawer__close-btn:hover,.pl-c-body--theme-light .pl-c-tools__action:focus,.pl-c-body--theme-light .pl-c-tools__action:hover{background-color:#eee;color:#4d4c4c}/** * Header */ /** * Size input fields */ /** * Typeahead */ /** * Ish sizing controls * 1) Hide on smaller screens */ /** * Viewport sizing inputs * 1) Hide these controls on */ /** * Tools menu button * 1) This is the button that contains the toggle and * triggers the tools dropdown list */ /** * Viewport * 1) Offset the viewport to account for the adjusted * PL header height */ .pl-c-body--theme-density-cozy .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-cozy .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-cozy .pl-c-typeahead{padding:.9rem .8rem}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-cozy .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-cozy .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-cozy .pl-c-viewport{top:3.28rem}/** * Header * 1) Change the font size of everything in the header */ /** * Logo */ /** * Typeahead dropdown list suggestion */ /** * Size input fields */ /** * Typeahead */ /** * Ish sizing controls * 1) Hide on smaller screens */ /** * Viewport sizing inputs */ /** * Tools menu button * 1) This is the button that contains the toggle and * triggers the tools dropdown list */ /** * Viewport * 1) Offset the viewport to account for the adjusted * PL header height */ .pl-c-body--theme-density-comfortable .pl-c-header{font-size:.85rem}.pl-c-body--theme-density-comfortable .pl-c-logo{max-width:4rem}.pl-c-body--theme-density-comfortable .pl-c-header .tt-suggestion{padding:1.5rem 1rem}.pl-c-body--theme-density-comfortable .pl-c-viewport-size__input{width:44px}.pl-c-body--theme-density-comfortable .pl-c-typeahead{padding:.9rem 1rem}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-size-list{display:none}}@media all and (max-width:78em){.pl-c-body--theme-density-comfortable .pl-c-viewport-size{display:none}}.pl-c-body--theme-density-comfortable .pl-c-tools__toggle{min-width:44px}.pl-c-body--theme-density-comfortable .pl-c-viewport{top:3.8rem}@media all and (min-width:42em){/** * Header * 1) Set width to sidebar width defined above * 2) Make header 100% of the viewport height * 3) Stack header items on top of each other * 4) void bottom border for light theme */ /** * Nav sub sub list */ /** * Nav list * 1) Stack main categories on top of each other * 2) Put typeahead search above nav list */ /** * Nav sublist */ /** * Nav sublist inside the light theme */ /** * All Nav links inside of subnav dropdown */ /** * Last sublist item * 1) Undo bottom border radius when in sidebar */ /** * Nav controls * 1) Push off of navigation in flex container so * they appear at the bottom */ /** * Tools toggle button */ /** * Tools list */ /** * Modal * 1) Position modal (that contains all the content) * so it fits in remaining available space * TODO: revisit to find ways to resize */ .pl-c-body--theme-sidebar .pl-c-header{width:16rem;height:100vh;padding-top:.5rem;padding-bottom:.5rem;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-bottom:0;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;--nav-item-height:2.5rem}.pl-c-body--theme-sidebar .pl-c-nav{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-flow:column-reverse;flex-flow:column-reverse}.pl-c-body--theme-sidebar .pl-c-nav__list{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.pl-c-body--theme-sidebar .pl-c-nav__sublist{position:relative;border-radius:0}.pl-c-body--theme-sidebar.pl-c-body--theme-light .pl-c-nav__subsublist{border-left-color:#eee}.pl-c-body--theme-sidebar .pl-c-nav__sublist .pl-c-nav__link{border-left:0;border-right:0}}@media all and (min-width:42em) and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-nav__sublist>.pl-c-nav__item:last-child .pl-c-nav__link{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-controls{display:block;justify-self:flex-end;margin-left:0}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-tools__toggle{display:none}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-tools__list{max-height:none;overflow:visible;position:relative;border-radius:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-c-drawer{right:0;width:auto}}@media all and (min-width:42em){.pl-c-body--theme-sidebar .pl-is-active+.pl-c-nav__subsublist,.pl-c-body--theme-sidebar .pl-is-active+.pl-js-acc-panel{max-height:none}}.is-vishidden{position:absolute!important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px,1px,1px,1px)} diff --git a/version/v2.18.3/styleguide/css/pattern-lab.js b/version/v2.18.3/styleguide/css/pattern-lab.js new file mode 100644 index 0000000000..e69de29bb2 diff --git a/version/v2.18.3/styleguide/css/pattern-lab.modern.js b/version/v2.18.3/styleguide/css/pattern-lab.modern.js new file mode 100644 index 0000000000..e69de29bb2 diff --git a/version/v2.18.3/styleguide/data/patternlab-data.cjs.js b/version/v2.18.3/styleguide/data/patternlab-data.cjs.js new file mode 100644 index 0000000000..8a14381874 --- /dev/null +++ b/version/v2.18.3/styleguide/data/patternlab-data.cjs.js @@ -0,0 +1,9 @@ +var config = {"cacheBust":true,"cleanPublic":true,"defaultPattern":"pages-intro","defaultShowPatternInfo":false,"defaultPatternInfoPanelCode":"html","defaultInitialViewportWidth":true,"disableDeprecationWarningForOrderPatterns":true,"disableDeprecationWarningForHiddenPatterns":true,"ishControlsHide":{"s":false,"m":false,"l":false,"full":false,"random":false,"disco":true,"hay":true,"mqs":false,"find":false,"views-all":false,"views-annotations":false,"views-code":false,"views-new":false,"tools-all":false,"tools-docs":false},"ishViewportRange":{"s":[360,500],"m":[500,800],"l":[800,2600]},"logLevel":"info","outputFileSuffixes":{"rendered":".rendered","rawTemplate":"","markupOnly":".markup-only"},"paths":{"source":{"root":"./source/","patterns":"./source/_patterns/","data":"./source/_data/enterprise/","meta":"./source/_meta/","annotations":"./source/_annotations/","styleguide":"dist/","patternlabFiles":{"general-header":"views/partials/general-header.mustache","general-footer":"views/partials/general-footer.mustache","patternSection":"views/partials/patternSection.mustache","patternSectionSubgroup":"views/partials/patternSectionSubgroup.mustache","viewall":"views/viewall.mustache"},"js":"./source/js","images":"./source/images","fonts":"./node_modules/@db-ui/base/build/assets/fonts","css":"./source/css","icons":"./node_modules/@db-ui/base/build/assets/icons","samples":"./source/samples","iframeResizer.contentWindow.js":"node_modules/iframe-resizer/js/iframeResizer.contentWindow.js","details-element-polyfill.js":"node_modules/details-element-polyfill/dist/details-element-polyfill.js","dialog-polyfill.js":"node_modules/dialog-polyfill/dist/dialog-polyfill.js","dialog-polyfill.css":"node_modules/dialog-polyfill/dist/dialog-polyfill.css","sitemap":"./source/sitemap.xml"},"public":{"root":"out/","patterns":"out/patterns/","data":"out/styleguide/data/","annotations":"out/annotations/","styleguide":"out/styleguide/","js":"out/js","images":"out/images","fonts":"out/fonts","css":"out/css","icons":"out/icons","samples":"out/samples","iframeResizer.contentWindow.js":"out/js/iframeResizer.contentWindow.js","details-element-polyfill.js":"out/js/details-element-polyfill.js","dialog-polyfill.js":"out/js/dialog-polyfill.js","dialog-polyfill.css":"out/css/dialog-polyfill.css","sitemap":"out/sitemap.xml"}},"patternExtension":"hbs","patternStateCascade":["inevaluation","inprogress","inreview","complete"],"patternExportAll":false,"patternExportDirectory":"pattern_exports","patternExportPatternPartials":[],"patternExportPreserveDirectoryStructure":true,"patternExportRaw":false,"patternMergeVariantArrays":true,"renderFlatPatternsOnViewAllPages":false,"serverOptions":{"wait":1000,"port":8080,"ignore":"/^.*public/(?!.*[.]css$).*$/i"},"starterkitSubDir":"dist","styleGuideExcludes":["pages"],"theme":{"color":"light","density":"compact","layout":"vertical","logo":{"text":"","altText":"Deutsche Bahn Logo","url":"./","srcLight":"images/db_logo.svg","srcDark":"images/db_logo.svg","width":"33","height":"23"}},"uikits":[{"name":"uikit-workshop","package":"@pattern-lab/uikit-workshop","outputDir":"","enabled":true,"excludedPatternStates":[],"excludedTags":["style-1.6"]}],"engines":{"handlebars":{"package":"@pattern-lab/engine-handlebars","extensions":["hbs"],"extend":"helpers/*.js"},"mustache":{"package":"@pattern-lab/engine-mustache","extensions":"mustache"}},"transformedAssetTypes":["scss"],"plugins":{"@mfranzke/plugin-node-uiextension":{"enabled":true,"initialized":false,"options":{"stylesheets":["css/pattern-scaffolding-project-specific.css"],"navLinks":{"before":[],"after":[]},"toolLinks":{"before":[],"after":[{"text":"Imprint","url":"https://www.dbsystel.de/dbsystel-en/legal-3715942","class":"","icon":"help"},{"text":"Datenschutzerklärung","url":"https://db-ui.github.io/datenschutzerklaerung.html","class":"","icon":"help"}]}}},"plugin-node-patternlab-inline-remote-assets":{"enabled":true,"initialized":false,"options":{}}}}; +var ishControls = {"ishControlsHide":{"s":false,"m":false,"l":false,"full":false,"random":false,"disco":true,"hay":true,"mqs":false,"find":false,"views-all":false,"views-annotations":false,"views-code":false,"views-new":false,"tools-all":false,"tools-docs":false}}; +var navItems = {"patternGroups": [{"patternGroupLC":"base","patternGroupUC":"Base","patternGroup":"base","patternGroupDash":"base","patternGroupItems":[{"patternSubgroupLC":"colors","patternSubgroupUC":"Colors","patternSubgroup":"colors","patternSubgroupDash":"colors","patternSubgroupItems":[{"patternPartial":"base-primary","patternName":"Marketingportal Brand Colors - Primary","patternState":"complete","patternPath":"base-colors-primary/base-colors-primary.rendered.html","name":"base-colors-primary","isDocPattern":false,"order":10,"variantOrder":0},{"patternPartial":"base-secondary","patternName":"Marketingportal Brand Colors - Secondary","patternState":"complete","patternPath":"base-colors-secondary/base-colors-secondary.rendered.html","name":"base-colors-secondary","isDocPattern":false,"order":20,"variantOrder":0},{"patternPartial":"base-feedback","patternName":"Marketingportal Brand Colors - Feedback","patternState":"inreview","patternPath":"base-colors-feedback/base-colors-feedback.rendered.html","name":"base-colors-feedback","isDocPattern":false,"order":30,"variantOrder":0},{"patternPartial":"base-poi","patternName":"Marketingportal Brand Colors - POI","patternState":"inreview","patternPath":"base-colors-poi/base-colors-poi.rendered.html","name":"base-colors-poi","isDocPattern":false,"order":40,"variantOrder":0},{"patternPartial":"base-transportation","patternName":"Marketingportal Brand Colors - Transport","patternState":"complete","patternPath":"base-colors-transportation/base-colors-transportation.rendered.html","name":"base-colors-transportation","isDocPattern":false,"order":50,"variantOrder":0},{"patternPartial":"viewall-base-colors","patternName":"View All","patternPath":"base-colors/index.html","patternGroup":"base","patternSubgroup":"colors","name":"base-colors","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"icons","patternSubgroupUC":"Icons","patternSubgroup":"icons","patternSubgroupDash":"icons","patternSubgroupItems":[{"patternPartial":"base-icon-library","patternName":"Icon Library","patternState":"","patternPath":"base-icons-icon-library/base-icons-icon-library.rendered.html","name":"base-icons-icon-library","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-filled-action","patternName":"DB Icons 16x16 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.rendered.html","name":"base-icons-icon-library-16-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-filled-navigation","patternName":"DB Icons 16x16 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.rendered.html","name":"base-icons-icon-library-16-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-filled-notification","patternName":"DB Icons 16x16 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.rendered.html","name":"base-icons-icon-library-16-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-outline-action","patternName":"DB Icons 16x16 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.rendered.html","name":"base-icons-icon-library-16-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-outline-navigation","patternName":"DB Icons 16x16 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.rendered.html","name":"base-icons-icon-library-16-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-action","patternName":"DB Icons 20x20 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.rendered.html","name":"base-icons-icon-library-20-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-av","patternName":"DB Icons 20x20 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.rendered.html","name":"base-icons-icon-library-20-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-communication","patternName":"DB Icons 20x20 - Filled - Communication","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.rendered.html","name":"base-icons-icon-library-20-filled-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-feature","patternName":"DB Icons 20x20 - Filled - Feature","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.rendered.html","name":"base-icons-icon-library-20-filled-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-food","patternName":"DB Icons 20x20 - Filled - Food","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.rendered.html","name":"base-icons-icon-library-20-filled-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-it","patternName":"DB Icons 20x20 - Filled - IT","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.rendered.html","name":"base-icons-icon-library-20-filled-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-journey","patternName":"DB Icons 20x20 - Filled - Journey","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.rendered.html","name":"base-icons-icon-library-20-filled-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-maps","patternName":"DB Icons 20x20 - Filled - Maps","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.rendered.html","name":"base-icons-icon-library-20-filled-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-navigation","patternName":"DB Icons 20x20 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.rendered.html","name":"base-icons-icon-library-20-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-notification","patternName":"DB Icons 20x20 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.rendered.html","name":"base-icons-icon-library-20-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-ticket","patternName":"DB Icons 20x20 - Filled - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.rendered.html","name":"base-icons-icon-library-20-filled-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-transportation","patternName":"DB Icons 20x20 - Filled - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.rendered.html","name":"base-icons-icon-library-20-filled-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-action","patternName":"DB Icons 20x20 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.rendered.html","name":"base-icons-icon-library-20-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-av","patternName":"DB Icons 20x20 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.rendered.html","name":"base-icons-icon-library-20-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-brand","patternName":"DB Icons 20x20 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.rendered.html","name":"base-icons-icon-library-20-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-communication","patternName":"DB Icons 20x20 - Outline - Communication","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.rendered.html","name":"base-icons-icon-library-20-outline-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-covid-19","patternName":"DB Icons 20x20 - Outline - Covid 19","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.rendered.html","name":"base-icons-icon-library-20-outline-covid-19","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-facilities","patternName":"DB Icons 20x20 - Outline - Facilities","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.rendered.html","name":"base-icons-icon-library-20-outline-facilities","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-feature","patternName":"DB Icons 20x20 - Outline - Feature","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.rendered.html","name":"base-icons-icon-library-20-outline-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-food","patternName":"DB Icons 20x20 - Outline - Food","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.rendered.html","name":"base-icons-icon-library-20-outline-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-it","patternName":"DB Icons 20x20 - Outline - IT","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.rendered.html","name":"base-icons-icon-library-20-outline-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-journey","patternName":"DB Icons 20x20 - Outline - Journey","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.rendered.html","name":"base-icons-icon-library-20-outline-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-maps","patternName":"DB Icons 20x20 - Outline - Maps","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.rendered.html","name":"base-icons-icon-library-20-outline-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-navigation","patternName":"DB Icons 20x20 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.rendered.html","name":"base-icons-icon-library-20-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-notification","patternName":"DB Icons 20x20 - Outline - Notification","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.rendered.html","name":"base-icons-icon-library-20-outline-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-seat","patternName":"DB Icons 20x20 - Outline - Seat","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.rendered.html","name":"base-icons-icon-library-20-outline-seat","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-ticket","patternName":"DB Icons 20x20 - Outline - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.rendered.html","name":"base-icons-icon-library-20-outline-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-transportation","patternName":"DB Icons 20x20 - Outline - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.rendered.html","name":"base-icons-icon-library-20-outline-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-action","patternName":"DB Icons 24x24 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.rendered.html","name":"base-icons-icon-library-24-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-av","patternName":"DB Icons 24x24 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.rendered.html","name":"base-icons-icon-library-24-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-journey","patternName":"DB Icons 24x24 - Filled - Journey","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.rendered.html","name":"base-icons-icon-library-24-filled-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-maps","patternName":"DB Icons 24x24 - Filled - Maps","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.rendered.html","name":"base-icons-icon-library-24-filled-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-navigation","patternName":"DB Icons 24x24 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.rendered.html","name":"base-icons-icon-library-24-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-notification","patternName":"DB Icons 24x24 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.rendered.html","name":"base-icons-icon-library-24-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-transportation","patternName":"DB Icons 24x24 - Filled - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.rendered.html","name":"base-icons-icon-library-24-filled-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-action","patternName":"DB Icons 24x24 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.rendered.html","name":"base-icons-icon-library-24-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-av","patternName":"DB Icons 24x24 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.rendered.html","name":"base-icons-icon-library-24-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-brand","patternName":"DB Icons 24x24 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.rendered.html","name":"base-icons-icon-library-24-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-communication","patternName":"DB Icons 24x24 - Outline - Communication","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.rendered.html","name":"base-icons-icon-library-24-outline-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-covid-19","patternName":"DB Icons 24x24 - Outline - Covid 19","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.rendered.html","name":"base-icons-icon-library-24-outline-covid-19","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-facilities","patternName":"DB Icons 24x24 - Outline - Facilities","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.rendered.html","name":"base-icons-icon-library-24-outline-facilities","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-feature","patternName":"DB Icons 24x24 - Outline - Feature","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.rendered.html","name":"base-icons-icon-library-24-outline-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-food","patternName":"DB Icons 24x24 - Outline - Food","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.rendered.html","name":"base-icons-icon-library-24-outline-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-it","patternName":"DB Icons 24x24 - Outline - IT","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.rendered.html","name":"base-icons-icon-library-24-outline-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-journey","patternName":"DB Icons 24x24 - Outline - Journey","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.rendered.html","name":"base-icons-icon-library-24-outline-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-maps","patternName":"DB Icons 24x24 - Outline - Maps","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.rendered.html","name":"base-icons-icon-library-24-outline-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-navigation","patternName":"DB Icons 24x24 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.rendered.html","name":"base-icons-icon-library-24-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-notification","patternName":"DB Icons 24x24 - Outline - Notification","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.rendered.html","name":"base-icons-icon-library-24-outline-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-seat","patternName":"DB Icons 24x24 - Outline - Seat","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.rendered.html","name":"base-icons-icon-library-24-outline-seat","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-ticket","patternName":"DB Icons 24x24 - Outline - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.rendered.html","name":"base-icons-icon-library-24-outline-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-transportation","patternName":"DB Icons 24x24 - Outline - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.rendered.html","name":"base-icons-icon-library-24-outline-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-action","patternName":"DB Icons 32x32 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.rendered.html","name":"base-icons-icon-library-32-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-av","patternName":"DB Icons 32x32 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.rendered.html","name":"base-icons-icon-library-32-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-maps","patternName":"DB Icons 32x32 - Filled - Maps","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.rendered.html","name":"base-icons-icon-library-32-filled-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-navigation","patternName":"DB Icons 32x32 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.rendered.html","name":"base-icons-icon-library-32-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-notification","patternName":"DB Icons 32x32 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.rendered.html","name":"base-icons-icon-library-32-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-transportation","patternName":"DB Icons 32x32 - Filled - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.rendered.html","name":"base-icons-icon-library-32-filled-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-action","patternName":"DB Icons 32x32 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.rendered.html","name":"base-icons-icon-library-32-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-av","patternName":"DB Icons 32x32 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.rendered.html","name":"base-icons-icon-library-32-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-brand","patternName":"DB Icons 32x32 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.rendered.html","name":"base-icons-icon-library-32-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-communication","patternName":"DB Icons 32x32 - Outline - Communication","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.rendered.html","name":"base-icons-icon-library-32-outline-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-covid-19","patternName":"DB Icons 32x32 - Outline - Covid 19","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.rendered.html","name":"base-icons-icon-library-32-outline-covid-19","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-facilities","patternName":"DB Icons 32x32 - Outline - Facilities","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.rendered.html","name":"base-icons-icon-library-32-outline-facilities","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-feature","patternName":"DB Icons 32x32 - Outline - Feature","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.rendered.html","name":"base-icons-icon-library-32-outline-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-food","patternName":"DB Icons 32x32 - Outline - Food","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.rendered.html","name":"base-icons-icon-library-32-outline-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-it","patternName":"DB Icons 32x32 - Outline - IT","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.rendered.html","name":"base-icons-icon-library-32-outline-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-journey","patternName":"DB Icons 32x32 - Outline - Journey","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.rendered.html","name":"base-icons-icon-library-32-outline-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-maps","patternName":"DB Icons 32x32 - Outline - Maps","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.rendered.html","name":"base-icons-icon-library-32-outline-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-navigation","patternName":"DB Icons 32x32 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.rendered.html","name":"base-icons-icon-library-32-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-notification","patternName":"DB Icons 32x32 - Outline - Notification","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.rendered.html","name":"base-icons-icon-library-32-outline-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-seat","patternName":"DB Icons 32x32 - Outline - Seat","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.rendered.html","name":"base-icons-icon-library-32-outline-seat","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-ticket","patternName":"DB Icons 32x32 - Outline - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.rendered.html","name":"base-icons-icon-library-32-outline-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-transportation","patternName":"DB Icons 32x32 - Outline - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.rendered.html","name":"base-icons-icon-library-32-outline-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-48-filled-av","patternName":"DB Icons 48x48 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.rendered.html","name":"base-icons-icon-library-48-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-48-outline-av","patternName":"DB Icons 48x48 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.rendered.html","name":"base-icons-icon-library-48-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-48-outline-brand","patternName":"DB Icons 48x48 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.rendered.html","name":"base-icons-icon-library-48-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-64-filled-av","patternName":"DB Icons 64x64 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.rendered.html","name":"base-icons-icon-library-64-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-64-outline-av","patternName":"DB Icons 64x64 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.rendered.html","name":"base-icons-icon-library-64-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-64-outline-brand","patternName":"DB Icons 64x64 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.rendered.html","name":"base-icons-icon-library-64-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-illustration-icons","patternName":"Illustration Icons","patternState":"","patternPath":"base-icons-illustration-icons/base-icons-illustration-icons.rendered.html","name":"base-icons-illustration-icons","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-base-icons","patternName":"View All","patternPath":"base-icons/index.html","patternGroup":"base","patternSubgroup":"icons","name":"base-icons","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"type","patternSubgroupUC":"Type","patternSubgroup":"type","patternSubgroupDash":"type","patternSubgroupItems":[{"patternPartial":"base-fonts","patternName":"Fonts","patternState":"complete","patternPath":"base-type-fonts/base-type-fonts.rendered.html","name":"base-type-fonts","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-1st-priority","patternName":"Highlight Colors 1st Priority","patternState":"","patternPath":"base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.rendered.html","name":"base-type-highlight-colors-1st-priority","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-2nd-priority","patternName":"Highlight Colors 2nd Priority","patternState":"","patternPath":"base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.rendered.html","name":"base-type-highlight-colors-2nd-priority","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-neutral","patternName":"Highlight Colors Neutral","patternState":"","patternPath":"base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.rendered.html","name":"base-type-highlight-colors-neutral","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-positive","patternName":"Highlight Colors Positive","patternState":"","patternPath":"base-type-highlight-colors-positive/base-type-highlight-colors-positive.rendered.html","name":"base-type-highlight-colors-positive","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-base-type","patternName":"View All","patternPath":"base-type/index.html","patternGroup":"base","patternSubgroup":"type","name":"base-type","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":0,"patternItems":[{"patternPartial":"viewall-base-all","patternName":"View all Base","patternPath":"base/index.html","name":"base","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"elements","patternGroupUC":"Elements","patternGroup":"elements","patternGroupDash":"elements","patternGroupItems":[{"patternSubgroupLC":"buttons","patternSubgroupUC":"Buttons","patternSubgroup":"buttons","patternSubgroupDash":"buttons","patternSubgroupItems":[{"patternPartial":"elements-button","patternName":"Button","patternState":"","patternPath":"elements-buttons-button/elements-buttons-button.rendered.html","name":"elements-buttons-button","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-button-brand-primary","patternName":"Button Brand Primary","patternState":"","patternPath":"elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.rendered.html","name":"elements-buttons-01-button-brand-primary","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"elements-button-primary","patternName":"Button Primary","patternState":"","patternPath":"elements-buttons-03-button-primary/elements-buttons-03-button-primary.rendered.html","name":"elements-buttons-03-button-primary","isDocPattern":false,"order":3,"variantOrder":0},{"patternPartial":"elements-button-secondary-outline","patternName":"Button Secondary Outline","patternState":"","patternPath":"elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.rendered.html","name":"elements-buttons-04-button-secondary-outline","isDocPattern":false,"order":4,"variantOrder":0},{"patternPartial":"elements-button-secondary-solid","patternName":"Button Secondary Solid","patternState":"","patternPath":"elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.rendered.html","name":"elements-buttons-05-button-secondary-solid","isDocPattern":false,"order":5,"variantOrder":0},{"patternPartial":"elements-button-tertiary-plain","patternName":"Button Tertiary Plain","patternState":"","patternPath":"elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.rendered.html","name":"elements-buttons-06-button-tertiary-plain","isDocPattern":false,"order":6,"variantOrder":0},{"patternPartial":"elements-button-sizes","patternName":"Button Sizes","patternState":"","patternPath":"elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.rendered.html","name":"elements-buttons-09-button-sizes","isDocPattern":false,"order":9,"variantOrder":0},{"patternPartial":"viewall-elements-buttons","patternName":"View All","patternPath":"elements-buttons/index.html","patternGroup":"elements","patternSubgroup":"buttons","name":"elements-buttons","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"checkbox","patternSubgroupUC":"Checkbox","patternSubgroup":"checkbox","patternSubgroupDash":"checkbox","patternSubgroupItems":[{"patternPartial":"elements-checkbox","patternName":"Checkbox","patternState":"complete","patternPath":"elements-checkbox-checkbox/elements-checkbox-checkbox.rendered.html","name":"elements-checkbox-checkbox","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-checked","patternName":"Checkbox Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.rendered.html","name":"elements-checkbox-checkbox-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-disabled","patternName":"Checkbox Disabled","patternState":"complete","patternPath":"elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.rendered.html","name":"elements-checkbox-checkbox-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-disabled-checked","patternName":"Checkbox Disabled Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.rendered.html","name":"elements-checkbox-checkbox-disabled-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-indeterminate","patternName":"Checkbox - indeterminate","patternState":"complete","patternPath":"elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.rendered.html","name":"elements-checkbox-checkbox-indeterminate","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-label-hidden","patternName":"Checkbox - Hidden label","patternState":"complete","patternPath":"elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.rendered.html","name":"elements-checkbox-checkbox-label-hidden","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background","patternName":"Checkbox On Dark Background","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.rendered.html","name":"elements-checkbox-checkbox-on-dark-background","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-checked","patternName":"Checkbox On Dark Background Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-disabled","patternName":"Checkbox On Dark Background Disabled","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-disabled-checked","patternName":"Checkbox On Dark Background Disabled Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-disabled-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-indeterminate","patternName":"Checkbox - indeterminate on dark background","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-indeterminate","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-checkbox","patternName":"View All","patternPath":"elements-checkbox/index.html","patternGroup":"elements","patternSubgroup":"checkbox","name":"elements-checkbox","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"chips","patternSubgroupUC":"Chips","patternSubgroup":"chips","patternSubgroupDash":"chips","patternSubgroupItems":[{"patternPartial":"elements-chips","patternName":"Filter chips","patternState":"","patternPath":"elements-chips-chips/elements-chips-chips.rendered.html","name":"elements-chips-chips","isDocPattern":false,"order":10,"variantOrder":0},{"patternPartial":"elements-chips-type-selection","patternName":"Selection chips","patternState":"","patternPath":"elements-chips-chips-type-selection/elements-chips-chips-type-selection.rendered.html","name":"elements-chips-chips-type-selection","isDocPattern":false,"order":10,"variantOrder":20},{"patternPartial":"elements-chips-with-icon","patternName":"Chips with icon","patternState":"","patternPath":"elements-chips-chips-with-icon/elements-chips-chips-with-icon.rendered.html","name":"elements-chips-chips-with-icon","isDocPattern":false,"order":10,"variantOrder":30},{"patternPartial":"elements-chips-disabled","patternName":"Chips – disabled","patternState":"","patternPath":"elements-chips-chips-disabled/elements-chips-chips-disabled.rendered.html","name":"elements-chips-chips-disabled","isDocPattern":false,"order":10,"variantOrder":40},{"patternPartial":"viewall-elements-chips","patternName":"View All","patternPath":"elements-chips/index.html","patternGroup":"elements","patternSubgroup":"chips","name":"elements-chips","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"headline","patternSubgroupUC":"Headline","patternSubgroup":"headline","patternSubgroupDash":"headline","patternSubgroupItems":[{"patternPartial":"elements-headline","patternName":"Headline","patternState":"","patternPath":"elements-headline-headline/elements-headline-headline.rendered.html","name":"elements-headline-headline","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-headline-pulse","patternName":"Headline Pulse","patternState":"","patternPath":"elements-headline-headline-pulse/elements-headline-headline-pulse.rendered.html","name":"elements-headline-headline-pulse","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-headline","patternName":"View All","patternPath":"elements-headline/index.html","patternGroup":"elements","patternSubgroup":"headline","name":"elements-headline","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"image","patternSubgroupUC":"Image","patternSubgroup":"image","patternSubgroupDash":"image","patternSubgroupItems":[{"patternPartial":"elements-image","patternName":"Image","patternState":"","patternPath":"elements-image-image/elements-image-image.rendered.html","name":"elements-image-image","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-avif","patternName":"Image - AVIF","patternState":"complete","patternPath":"elements-image-image-avif/elements-image-image-avif.rendered.html","name":"elements-image-image-avif","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-lazy-loading","patternName":"Image - Lazy loading","patternState":"complete","patternPath":"elements-image-image-lazy-loading/elements-image-image-lazy-loading.rendered.html","name":"elements-image-image-lazy-loading","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-responsive-density","patternName":"Image - Responsive and pixel density","patternState":"complete","patternPath":"elements-image-image-responsive-density/elements-image-image-responsive-density.rendered.html","name":"elements-image-image-responsive-density","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-responsive-mediaquery","patternName":"Image - Responsive mediaquery","patternState":"complete","patternPath":"elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.rendered.html","name":"elements-image-image-responsive-mediaquery","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-webp","patternName":"Image - WebP","patternState":"complete","patternPath":"elements-image-image-webp/elements-image-image-webp.rendered.html","name":"elements-image-image-webp","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-with-caption","patternName":"Image - with caption","patternState":"inevaluation","patternPath":"elements-image-image-with-caption/elements-image-image-with-caption.rendered.html","name":"elements-image-image-with-caption","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-image","patternName":"View All","patternPath":"elements-image/index.html","patternGroup":"elements","patternSubgroup":"image","name":"elements-image","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"input","patternSubgroupUC":"Input","patternSubgroup":"input","patternSubgroupDash":"input","patternSubgroupItems":[{"patternPartial":"elements-input-variations","patternName":"Input variations","patternState":"","patternPath":"elements-input-input-variations/elements-input-input-variations.rendered.html","name":"elements-input-input-variations","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"elements-input","patternName":"Input","patternState":"","patternPath":"elements-input-input/elements-input-input.rendered.html","name":"elements-input-input","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-input-auto-suggest","patternName":"Input - Auto suggestions","patternState":"","patternPath":"elements-input-input-auto-suggest/elements-input-input-auto-suggest.rendered.html","name":"elements-input-input-auto-suggest","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-input-description","patternName":"Input with description","patternState":"","patternPath":"elements-input-input-description/elements-input-input-description.rendered.html","name":"elements-input-input-description","isDocPattern":false,"order":2,"variantOrder":3},{"patternPartial":"elements-input-filled","patternName":"Input - filled with a value","patternState":"","patternPath":"elements-input-input-filled/elements-input-input-filled.rendered.html","name":"elements-input-input-filled","isDocPattern":false,"order":2,"variantOrder":4},{"patternPartial":"elements-input-valid","patternName":"Input - valid state","patternState":"","patternPath":"elements-input-input-valid/elements-input-input-valid.rendered.html","name":"elements-input-input-valid","isDocPattern":false,"order":2,"variantOrder":5},{"patternPartial":"elements-input-invalid","patternName":"Input - invalid state (type in less than its minimum of 5 characters)","patternState":"","patternPath":"elements-input-input-invalid/elements-input-input-invalid.rendered.html","name":"elements-input-input-invalid","isDocPattern":false,"order":2,"variantOrder":6},{"patternPartial":"elements-input-invalid-attribute","patternName":"Input - Invalid state by HTML attribute","patternState":"complete","patternPath":"elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.rendered.html","name":"elements-input-input-invalid-attribute","isDocPattern":false,"order":2,"variantOrder":7},{"patternPartial":"elements-input-disabled","patternName":"Input - disabled state","patternState":"","patternPath":"elements-input-input-disabled/elements-input-input-disabled.rendered.html","name":"elements-input-input-disabled","isDocPattern":false,"order":2,"variantOrder":8},{"patternPartial":"elements-input-search","patternName":"Input - search type","patternState":"","patternPath":"elements-input-input-search/elements-input-input-search.rendered.html","name":"elements-input-input-search","isDocPattern":false,"order":2,"variantOrder":9},{"patternPartial":"elements-input-search-filled","patternName":"Input - search type - filled","patternState":"","patternPath":"elements-input-input-search-filled/elements-input-input-search-filled.rendered.html","name":"elements-input-input-search-filled","isDocPattern":false,"order":2,"variantOrder":10},{"patternPartial":"elements-input-hidden-label","patternName":"Input - Hidden label","patternState":"complete","patternPath":"elements-input-input-hidden-label/elements-input-input-hidden-label.rendered.html","name":"elements-input-input-hidden-label","isDocPattern":false,"order":2,"variantOrder":11},{"patternPartial":"viewall-elements-input","patternName":"View All","patternPath":"elements-input/index.html","patternGroup":"elements","patternSubgroup":"input","name":"elements-input","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"link","patternSubgroupUC":"Link","patternSubgroup":"link","patternSubgroupDash":"link","patternSubgroupItems":[{"patternPartial":"elements-links","patternName":"Links","patternState":"inreview","patternPath":"elements-link-links/elements-link-links.rendered.html","name":"elements-link-links","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-links-small","patternName":"Links Small","patternState":"inreview","patternPath":"elements-link-links-small/elements-link-links-small.rendered.html","name":"elements-link-links-small","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-link","patternName":"View All","patternPath":"elements-link/index.html","patternGroup":"elements","patternSubgroup":"link","name":"elements-link","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"loading-indicator","patternSubgroupUC":"Loading Indicator","patternSubgroup":"loading-indicator","patternSubgroupDash":"loading-indicator","patternSubgroupItems":[{"patternPartial":"elements-loading-indicator","patternName":"Loading Indicator","patternState":"","patternPath":"elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.rendered.html","name":"elements-loading-indicator-loading-indicator","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-loading-indicator-size-s","patternName":"Loading Indicator Size S","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.rendered.html","name":"elements-loading-indicator-loading-indicator-size-s","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-loading-indicator-size-XS","patternName":"Loading Indicator Size XS","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.rendered.html","name":"elements-loading-indicator-loading-indicator-size-XS","isDocPattern":false,"order":0,"variantOrder":1},{"patternPartial":"elements-loading-indicator-size-m","patternName":"Loading Indicator Size M","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.rendered.html","name":"elements-loading-indicator-loading-indicator-size-m","isDocPattern":false,"order":0,"variantOrder":3},{"patternPartial":"elements-loading-indicator-size-l","patternName":"Loading Indicator Size L","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.rendered.html","name":"elements-loading-indicator-loading-indicator-size-l","isDocPattern":false,"order":0,"variantOrder":4},{"patternPartial":"elements-loading-indicator-size-xl","patternName":"Loading Indicator Size XL","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.rendered.html","name":"elements-loading-indicator-loading-indicator-size-xl","isDocPattern":false,"order":0,"variantOrder":5},{"patternPartial":"viewall-elements-loading-indicator","patternName":"View All","patternPath":"elements-loading-indicator/index.html","patternGroup":"elements","patternSubgroup":"loading-indicator","name":"elements-loading-indicator","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"logo","patternSubgroupUC":"Logo","patternSubgroup":"logo","patternSubgroupDash":"logo","patternSubgroupItems":[{"patternPartial":"elements-logo","patternName":"Logo","patternState":"","patternPath":"elements-logo-logo/elements-logo-logo.rendered.html","name":"elements-logo-logo","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-logo-on-backgrounds","patternName":"Logo On Backgrounds","patternState":"","patternPath":"elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.rendered.html","name":"elements-logo-logo-on-backgrounds","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-logo-sizes","patternName":"Logo Sizes","patternState":"","patternPath":"elements-logo-logo-sizes/elements-logo-logo-sizes.rendered.html","name":"elements-logo-logo-sizes","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-logo-with-following-headline","patternName":"Logo With Following Headline","patternState":"","patternPath":"elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.rendered.html","name":"elements-logo-logo-with-following-headline","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-logo","patternName":"View All","patternPath":"elements-logo/index.html","patternGroup":"elements","patternSubgroup":"logo","name":"elements-logo","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"progress","patternSubgroupUC":"Progress","patternSubgroup":"progress","patternSubgroupDash":"progress","patternSubgroupItems":[{"patternPartial":"elements-progress","patternName":"Linear loader","patternState":"inreview","patternPath":"elements-progress-progress/elements-progress-progress.rendered.html","name":"elements-progress-progress","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-progress-linear-spinner","patternName":"Linear spinner","patternState":"inreview","patternPath":"elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.rendered.html","name":"elements-progress-progress-linear-spinner","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-progress-linear-spinner-indeterminate","patternName":"Linear spinner indeterminate","patternState":"inreview","patternPath":"elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.rendered.html","name":"elements-progress-progress-linear-spinner-indeterminate","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-progress","patternName":"View All","patternPath":"elements-progress/index.html","patternGroup":"elements","patternSubgroup":"progress","name":"elements-progress","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"radio","patternSubgroupUC":"Radio","patternSubgroup":"radio","patternSubgroupDash":"radio","patternSubgroupItems":[{"patternPartial":"elements-radios","patternName":"Radios","patternState":"complete","patternPath":"elements-radio-radios/elements-radio-radios.rendered.html","name":"elements-radio-radios","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-checked","patternName":"Radios Checked","patternState":"complete","patternPath":"elements-radio-radios-checked/elements-radio-radios-checked.rendered.html","name":"elements-radio-radios-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-disabled","patternName":"Radios Disabled","patternState":"complete","patternPath":"elements-radio-radios-disabled/elements-radio-radios-disabled.rendered.html","name":"elements-radio-radios-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-disabled-checked","patternName":"Radios Disabled Checked","patternState":"complete","patternPath":"elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.rendered.html","name":"elements-radio-radios-disabled-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-invalid-attribute","patternName":"Radios Invalid Attribute","patternState":"complete","patternPath":"elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.rendered.html","name":"elements-radio-radios-invalid-attribute","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-label-hidden","patternName":"Radio - Hidden label","patternState":"complete","patternPath":"elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.rendered.html","name":"elements-radio-radios-label-hidden","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-required","patternName":"Radios Required","patternState":"complete","patternPath":"elements-radio-radios-required/elements-radio-radios-required.rendered.html","name":"elements-radio-radios-required","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-radio","patternName":"View All","patternPath":"elements-radio/index.html","patternGroup":"elements","patternSubgroup":"radio","name":"elements-radio","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"select","patternSubgroupUC":"Select","patternSubgroup":"select","patternSubgroupDash":"select","patternSubgroupItems":[{"patternPartial":"elements-select","patternName":"Select","patternState":"","patternPath":"elements-select-select/elements-select-select.rendered.html","name":"elements-select-select","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-variations","patternName":"Select Variations","patternState":"","patternPath":"elements-select-select-variations/elements-select-select-variations.rendered.html","name":"elements-select-select-variations","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-variations-disabled","patternName":"Select Variations Disabled","patternState":"","patternPath":"elements-select-select-variations-disabled/elements-select-select-variations-disabled.rendered.html","name":"elements-select-select-variations-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-variations-optgroups","patternName":"Select Variations Optgroups","patternState":"","patternPath":"elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.rendered.html","name":"elements-select-select-variations-optgroups","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-invalid-attribute","patternName":"Select - Invalid state by HTML attribute","patternState":"complete","patternPath":"elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.rendered.html","name":"elements-select-select-invalid-attribute","isDocPattern":false,"order":0,"variantOrder":7},{"patternPartial":"elements-select-hidden-label","patternName":"Select - Hidden label","patternState":"complete","patternPath":"elements-select-select-hidden-label/elements-select-select-hidden-label.rendered.html","name":"elements-select-select-hidden-label","isDocPattern":false,"order":0,"variantOrder":8},{"patternPartial":"viewall-elements-select","patternName":"View All","patternPath":"elements-select/index.html","patternGroup":"elements","patternSubgroup":"select","name":"elements-select","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"tags","patternSubgroupUC":"Tags","patternSubgroup":"tags","patternSubgroupDash":"tags","patternSubgroupItems":[{"patternPartial":"elements-tags","patternName":"Tags","patternState":"","patternPath":"elements-tags-tags/elements-tags-tags.rendered.html","name":"elements-tags-tags","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-tags-small","patternName":"Tags Small","patternState":"","patternPath":"elements-tags-tags-small/elements-tags-tags-small.rendered.html","name":"elements-tags-tags-small","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-tags-with-icon","patternName":"Tags With Icon","patternState":"","patternPath":"elements-tags-tags-with-icon/elements-tags-tags-with-icon.rendered.html","name":"elements-tags-tags-with-icon","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-tags","patternName":"View All","patternPath":"elements-tags/index.html","patternGroup":"elements","patternSubgroup":"tags","name":"elements-tags","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"textarea","patternSubgroupUC":"Textarea","patternSubgroup":"textarea","patternSubgroupDash":"textarea","patternSubgroupItems":[{"patternPartial":"elements-textarea-variations","patternName":"Textarea variations","patternState":"","patternPath":"elements-textarea-textarea-variations/elements-textarea-textarea-variations.rendered.html","name":"elements-textarea-textarea-variations","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"elements-textarea","patternName":"Textarea","patternState":"","patternPath":"elements-textarea-textarea/elements-textarea-textarea.rendered.html","name":"elements-textarea-textarea","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-textarea-disabled","patternName":"Textarea Disabled","patternState":"","patternPath":"elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.rendered.html","name":"elements-textarea-textarea-disabled","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-textarea-description","patternName":"Textarea with description","patternState":"","patternPath":"elements-textarea-textarea-description/elements-textarea-textarea-description.rendered.html","name":"elements-textarea-textarea-description","isDocPattern":false,"order":2,"variantOrder":3},{"patternPartial":"elements-textarea-filled","patternName":"Textarea filled with a value","patternState":"","patternPath":"elements-textarea-textarea-filled/elements-textarea-textarea-filled.rendered.html","name":"elements-textarea-textarea-filled","isDocPattern":false,"order":2,"variantOrder":4},{"patternPartial":"elements-textarea-valid","patternName":"Textarea - valid state","patternState":"","patternPath":"elements-textarea-textarea-valid/elements-textarea-textarea-valid.rendered.html","name":"elements-textarea-textarea-valid","isDocPattern":false,"order":2,"variantOrder":5},{"patternPartial":"elements-textarea-invalid","patternName":"Textarea - invalid state (type in less than its minimum of 5 characters)","patternState":"","patternPath":"elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.rendered.html","name":"elements-textarea-textarea-invalid","isDocPattern":false,"order":2,"variantOrder":6},{"patternPartial":"elements-textarea-invalid-attribute","patternName":"Textarea - Invalid state by HTML attribute","patternState":"complete","patternPath":"elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.rendered.html","name":"elements-textarea-textarea-invalid-attribute","isDocPattern":false,"order":2,"variantOrder":7},{"patternPartial":"elements-textarea-hidden-label","patternName":"Textarea - Hidden label","patternState":"complete","patternPath":"elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.rendered.html","name":"elements-textarea-textarea-hidden-label","isDocPattern":false,"order":2,"variantOrder":8},{"patternPartial":"viewall-elements-textarea","patternName":"View All","patternPath":"elements-textarea/index.html","patternGroup":"elements","patternSubgroup":"textarea","name":"elements-textarea","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"toggle","patternSubgroupUC":"Toggle","patternSubgroup":"toggle","patternSubgroupDash":"toggle","patternSubgroupItems":[{"patternPartial":"elements-toggle","patternName":"Toggle","patternState":"complete","patternPath":"elements-toggle-toggle/elements-toggle-toggle.rendered.html","name":"elements-toggle-toggle","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-toggle-disabled","patternName":"Toggle Disabled","patternState":"complete","patternPath":"elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.rendered.html","name":"elements-toggle-toggle-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-toggle-on","patternName":"Toggle On","patternState":"complete","patternPath":"elements-toggle-toggle-on/elements-toggle-toggle-on.rendered.html","name":"elements-toggle-toggle-on","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-toggle-on-disabled","patternName":"Toggle On Disabled","patternState":"complete","patternPath":"elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.rendered.html","name":"elements-toggle-toggle-on-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-toggle","patternName":"View All","patternPath":"elements-toggle/index.html","patternGroup":"elements","patternSubgroup":"toggle","name":"elements-toggle","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":1,"patternItems":[{"patternPartial":"viewall-elements-all","patternName":"View all Elements","patternPath":"elements/index.html","name":"elements","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"components","patternGroupUC":"Components","patternGroup":"components","patternGroupDash":"components","patternGroupItems":[{"patternSubgroupLC":"accordion","patternSubgroupUC":"Accordion","patternSubgroup":"accordion","patternSubgroupDash":"accordion","patternSubgroupItems":[{"patternPartial":"components-accordion","patternName":"Accordion","patternState":"","patternPath":"components-accordion-accordion/components-accordion-accordion.rendered.html","name":"components-accordion-accordion","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-accordion-high-emphasis","patternName":"Accordion High Emphasis","patternState":"","patternPath":"components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.rendered.html","name":"components-accordion-accordion-high-emphasis","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-accordion-sizes","patternName":"Accordion Sizes","patternState":"","patternPath":"components-accordion-accordion-sizes/components-accordion-accordion-sizes.rendered.html","name":"components-accordion-accordion-sizes","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-accordion","patternName":"View All","patternPath":"components-accordion/index.html","patternGroup":"components","patternSubgroup":"accordion","name":"components-accordion","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"breadcrumb","patternSubgroupUC":"Breadcrumb","patternSubgroup":"breadcrumb","patternSubgroupDash":"breadcrumb","patternSubgroupItems":[{"patternPartial":"components-breadcrumb","patternName":"Breadcrumb","patternState":"inreview","patternPath":"components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.rendered.html","name":"components-breadcrumb-breadcrumb","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-breadcrumb","patternName":"View All","patternPath":"components-breadcrumb/index.html","patternGroup":"components","patternSubgroup":"breadcrumb","name":"components-breadcrumb","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"cards","patternSubgroupUC":"Cards","patternSubgroup":"cards","patternSubgroupDash":"cards","patternSubgroupItems":[{"patternPartial":"components-cards-banner","patternName":"Cards Banner","patternState":"inprogress","patternPath":"components-cards-cards-banner/components-cards-cards-banner.rendered.html","name":"components-cards-cards-banner","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-cards","patternName":"View All","patternPath":"components-cards/index.html","patternGroup":"components","patternSubgroup":"cards","name":"components-cards","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"dialog","patternSubgroupUC":"Dialog","patternSubgroup":"dialog","patternSubgroupDash":"dialog","patternSubgroupItems":[{"patternPartial":"components-dialog","patternName":"Dialog","patternState":"inreview","patternPath":"components-dialog-dialog/components-dialog-dialog.rendered.html","name":"components-dialog-dialog","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-dialog-button-alignment-end","patternName":"Dialog Button Alignment End","patternState":"inreview","patternPath":"components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.rendered.html","name":"components-dialog-dialog-button-alignment-end","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-dialog","patternName":"View All","patternPath":"components-dialog/index.html","patternGroup":"components","patternSubgroup":"dialog","name":"components-dialog","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"dropdown","patternSubgroupUC":"Dropdown","patternSubgroup":"dropdown","patternSubgroupDash":"dropdown","patternSubgroupItems":[{"patternPartial":"components-dropdown","patternName":"Dropdown","patternState":"inreview","patternPath":"components-dropdown-dropdown/components-dropdown-dropdown.rendered.html","name":"components-dropdown-dropdown","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-dropdown-opposite-position","patternName":"Dropdown (within the header area) / opposite position","patternState":"inreview","patternPath":"components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.rendered.html","name":"components-dropdown-dropdown-opposite-position","isDocPattern":false,"order":0,"variantOrder":2},{"patternPartial":"viewall-components-dropdown","patternName":"View All","patternPath":"components-dropdown/index.html","patternGroup":"components","patternSubgroup":"dropdown","name":"components-dropdown","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"form","patternSubgroupUC":"Form","patternSubgroup":"form","patternSubgroupDash":"form","patternSubgroupItems":[{"patternPartial":"components-example-form","patternName":"Example Form","patternState":"complete","patternPath":"components-form-example-form/components-form-example-form.rendered.html","name":"components-form-example-form","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-form","patternName":"View All","patternPath":"components-form/index.html","patternGroup":"components","patternSubgroup":"form","name":"components-form","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"language-switcher","patternSubgroupUC":"Language Switcher","patternSubgroup":"language-switcher","patternSubgroupDash":"language-switcher","patternSubgroupItems":[{"patternPartial":"components-language-switcher","patternName":"Language switcher","patternState":"inprogress","patternPath":"components-language-switcher-language-switcher/components-language-switcher-language-switcher.rendered.html","name":"components-language-switcher-language-switcher","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-language-switcher-spa","patternName":"Language switcher with buttons","patternState":"inprogress","patternPath":"components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.rendered.html","name":"components-language-switcher-language-switcher-spa","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-language-switcher","patternName":"View All","patternPath":"components-language-switcher/index.html","patternGroup":"components","patternSubgroup":"language-switcher","name":"components-language-switcher","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"notifications","patternSubgroupUC":"Notifications","patternSubgroup":"notifications","patternSubgroupDash":"notifications","patternSubgroupItems":[{"patternPartial":"components-notifications","patternName":"Notifications","patternState":"","patternPath":"components-notifications-notifications/components-notifications-notifications.rendered.html","name":"components-notifications-notifications","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-notifications-variants","patternName":"Notifications Variants","patternState":"","patternPath":"components-notifications-notifications-variants/components-notifications-notifications-variants.rendered.html","name":"components-notifications-notifications-variants","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-notifications-hovering","patternName":"Notifications Hovering","patternState":"","patternPath":"components-notifications-notifications-hovering/components-notifications-notifications-hovering.rendered.html","name":"components-notifications-notifications-hovering","isDocPattern":false,"order":0,"variantOrder":1},{"patternPartial":"components-notifications-hovering-leading-icon","patternName":"Notifications - Leading Icon","patternState":"","patternPath":"components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.rendered.html","name":"components-notifications-notifications-hovering-leading-icon","isDocPattern":false,"order":0,"variantOrder":2},{"patternPartial":"components-notifications-hovering-trailing-icon","patternName":"Notifications - Trailing Icon","patternState":"","patternPath":"components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.rendered.html","name":"components-notifications-notifications-hovering-trailing-icon","isDocPattern":false,"order":0,"variantOrder":3},{"patternPartial":"viewall-components-notifications","patternName":"View All","patternPath":"components-notifications/index.html","patternGroup":"components","patternSubgroup":"notifications","name":"components-notifications","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"overflow-menu","patternSubgroupUC":"Overflow Menu","patternSubgroup":"overflow-menu","patternSubgroupDash":"overflow-menu","patternSubgroupItems":[{"patternPartial":"components-overflow-menu","patternName":"Overflow menu","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.rendered.html","name":"components-overflow-menu-overflow-menu","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"components-overflow-menu-navigation","patternName":"Overflow menu - Navigation","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.rendered.html","name":"components-overflow-menu-overflow-menu-navigation","isDocPattern":false,"order":1,"variantOrder":2},{"patternPartial":"components-overflow-menu-opposite-position","patternName":"Overflow menu / opposite position","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.rendered.html","name":"components-overflow-menu-overflow-menu-opposite-position","isDocPattern":false,"order":1,"variantOrder":3},{"patternPartial":"components-overflow-menu-navigation-opposite-position","patternName":"Overflow menu - Navigation / opposite position","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.rendered.html","name":"components-overflow-menu-overflow-menu-navigation-opposite-position","isDocPattern":false,"order":1,"variantOrder":4},{"patternPartial":"viewall-components-overflow-menu","patternName":"View All","patternPath":"components-overflow-menu/index.html","patternGroup":"components","patternSubgroup":"overflow-menu","name":"components-overflow-menu","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"pagination","patternSubgroupUC":"Pagination","patternSubgroup":"pagination","patternSubgroupDash":"pagination","patternSubgroupItems":[{"patternPartial":"components-pagination","patternName":"Pagination","patternState":"inreview","patternPath":"components-pagination-pagination/components-pagination-pagination.rendered.html","name":"components-pagination-pagination","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-pagination","patternName":"View All","patternPath":"components-pagination/index.html","patternGroup":"components","patternSubgroup":"pagination","name":"components-pagination","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"sidenavi","patternSubgroupUC":"Sidenavi","patternSubgroup":"sidenavi","patternSubgroupDash":"sidenavi","patternSubgroupItems":[{"patternPartial":"components-sidenavi","patternName":"Sidenavi","patternState":"inreview","patternPath":"components-sidenavi-sidenavi/components-sidenavi-sidenavi.rendered.html","name":"components-sidenavi-sidenavi","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-sidenavi","patternName":"View All","patternPath":"components-sidenavi/index.html","patternGroup":"components","patternSubgroup":"sidenavi","name":"components-sidenavi","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"tab-bar","patternSubgroupUC":"Tab Bar","patternSubgroup":"tab-bar","patternSubgroupDash":"tab-bar","patternSubgroupItems":[{"patternPartial":"components-tab-bar","patternName":"Tab Bar","patternState":"","patternPath":"components-tab-bar-tab-bar/components-tab-bar-tab-bar.rendered.html","name":"components-tab-bar-tab-bar","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-tab-bar","patternName":"View All","patternPath":"components-tab-bar/index.html","patternGroup":"components","patternSubgroup":"tab-bar","name":"components-tab-bar","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"table","patternSubgroupUC":"Table","patternSubgroup":"table","patternSubgroupDash":"table","patternSubgroupItems":[{"patternPartial":"components-table","patternName":"Table","patternState":"inreview","patternPath":"components-table-table/components-table-table.rendered.html","name":"components-table-table","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-alignments","patternName":"Table - alignment","patternState":"inreview","patternPath":"components-table-table-alignments/components-table-table-alignments.rendered.html","name":"components-table-table-alignments","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-border-around","patternName":"Table - border around cells","patternState":"inreview","patternPath":"components-table-table-border-around/components-table-table-border-around.rendered.html","name":"components-table-table-border-around","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-border-horizontal","patternName":"Table - border horizontal","patternState":"inreview","patternPath":"components-table-table-border-horizontal/components-table-table-border-horizontal.rendered.html","name":"components-table-table-border-horizontal","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-density","patternName":"Table - density","patternState":"inreview","patternPath":"components-table-table-density/components-table-table-density.rendered.html","name":"components-table-table-density","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-font-size","patternName":"Table - font size","patternState":"inreview","patternPath":"components-table-table-font-size/components-table-table-font-size.rendered.html","name":"components-table-table-font-size","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-icons","patternName":"Table - icons","patternState":"inreview","patternPath":"components-table-table-icons/components-table-table-icons.rendered.html","name":"components-table-table-icons","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-overflow-menu","patternName":"Table Overflow Menu","patternState":"inreview","patternPath":"components-table-table-overflow-menu/components-table-table-overflow-menu.rendered.html","name":"components-table-table-overflow-menu","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-row-title","patternName":"Table Row Title","patternState":"inreview","patternPath":"components-table-table-row-title/components-table-table-row-title.rendered.html","name":"components-table-table-row-title","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-rows-zebra","patternName":"Table - row zebra styling","patternState":"inreview","patternPath":"components-table-table-rows-zebra/components-table-table-rows-zebra.rendered.html","name":"components-table-table-rows-zebra","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-sticky-header","patternName":"Table - sticky header","patternState":"inreview","patternPath":"components-table-table-sticky-header/components-table-table-sticky-header.rendered.html","name":"components-table-table-sticky-header","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-table","patternName":"View All","patternPath":"components-table/index.html","patternGroup":"components","patternSubgroup":"table","name":"components-table","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":2,"patternItems":[{"patternPartial":"viewall-components-all","patternName":"View all Components","patternPath":"components/index.html","name":"components","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"areas","patternGroupUC":"Areas","patternGroup":"areas","patternGroupDash":"areas","patternGroupItems":[{"patternSubgroupLC":"footer","patternSubgroupUC":"Footer","patternSubgroup":"footer","patternSubgroupDash":"footer","patternSubgroupItems":[{"patternPartial":"areas-footer","patternName":"Footer","patternState":"inprogress","patternPath":"areas-footer-footer/areas-footer-footer.rendered.html","name":"areas-footer-footer","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"areas-footer-with-border","patternName":"Footer With Border","patternState":"inprogress","patternPath":"areas-footer-footer-with-border/areas-footer-footer-with-border.rendered.html","name":"areas-footer-footer-with-border","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-areas-footer","patternName":"View All","patternPath":"areas-footer/index.html","patternGroup":"areas","patternSubgroup":"footer","name":"areas-footer","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"grid","patternSubgroupUC":"Grid","patternSubgroup":"grid","patternSubgroupDash":"grid","patternSubgroupItems":[{"patternPartial":"areas-grid","patternName":"Grid","patternState":"inprogress","patternPath":"areas-grid-grid/areas-grid-grid.rendered.html","name":"areas-grid-grid","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-areas-grid","patternName":"View All","patternPath":"areas-grid/index.html","patternGroup":"areas","patternSubgroup":"grid","name":"areas-grid","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"header","patternSubgroupUC":"Header","patternSubgroup":"header","patternSubgroupDash":"header","patternSubgroupItems":[{"patternPartial":"areas-header","patternName":"Header","patternState":"inprogress","patternPath":"areas-header-header/areas-header-header.rendered.html","name":"areas-header-header","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"areas-header-loggedin","patternName":"Header Loggedin","patternState":"inprogress","patternPath":"areas-header-header-loggedin/areas-header-header-loggedin.rendered.html","name":"areas-header-header-loggedin","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"areas-meta","patternName":"Meta","patternState":"inprogress","patternPath":"areas-header-meta/areas-header-meta.rendered.html","name":"areas-header-meta","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-areas-header","patternName":"View All","patternPath":"areas-header/index.html","patternGroup":"areas","patternSubgroup":"header","name":"areas-header","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":30,"patternItems":[{"patternPartial":"viewall-areas-all","patternName":"View all Areas","patternPath":"areas/index.html","name":"areas","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"pages","patternGroupUC":"Pages","patternGroup":"pages","patternGroupDash":"pages","patternGroupItems":[],"order":40,"patternItems":[{"patternPartial":"pages-sample-page","patternName":"Sample Page","patternState":"inprogress","patternPath":"pages-sample-page/pages-sample-page.rendered.html","name":"pages-sample-page","isDocPattern":false,"order":0,"variantOrder":0}]}], "ishControlsHide": {"s":false,"m":false,"l":false,"full":false,"random":false,"disco":true,"hay":true,"mqs":false,"find":false,"views-all":false,"views-annotations":false,"views-code":false,"views-new":false,"tools-all":false,"tools-docs":false}}; +var patternPaths = {"areas":{"footer":"areas-footer-footer","footer-with-border":"areas-footer-footer-with-border","grid":"areas-grid-grid","header":"areas-header-header","header-loggedin":"areas-header-header-loggedin","meta":"areas-header-meta"},"base":{"feedback":"base-colors-feedback","poi":"base-colors-poi","primary":"base-colors-primary","secondary":"base-colors-secondary","transportation":"base-colors-transportation","icon-library":"base-icons-icon-library","icon-library-16-filled-action":"base-icons-icon-library-16-filled-action","icon-library-16-filled-navigation":"base-icons-icon-library-16-filled-navigation","icon-library-16-filled-notification":"base-icons-icon-library-16-filled-notification","icon-library-16-outline-action":"base-icons-icon-library-16-outline-action","icon-library-16-outline-navigation":"base-icons-icon-library-16-outline-navigation","icon-library-20-filled-action":"base-icons-icon-library-20-filled-action","icon-library-20-filled-av":"base-icons-icon-library-20-filled-av","icon-library-20-filled-communication":"base-icons-icon-library-20-filled-communication","icon-library-20-filled-feature":"base-icons-icon-library-20-filled-feature","icon-library-20-filled-food":"base-icons-icon-library-20-filled-food","icon-library-20-filled-it":"base-icons-icon-library-20-filled-it","icon-library-20-filled-journey":"base-icons-icon-library-20-filled-journey","icon-library-20-filled-maps":"base-icons-icon-library-20-filled-maps","icon-library-20-filled-navigation":"base-icons-icon-library-20-filled-navigation","icon-library-20-filled-notification":"base-icons-icon-library-20-filled-notification","icon-library-20-filled-ticket":"base-icons-icon-library-20-filled-ticket","icon-library-20-filled-transportation":"base-icons-icon-library-20-filled-transportation","icon-library-20-outline-action":"base-icons-icon-library-20-outline-action","icon-library-20-outline-av":"base-icons-icon-library-20-outline-av","icon-library-20-outline-brand":"base-icons-icon-library-20-outline-brand","icon-library-20-outline-communication":"base-icons-icon-library-20-outline-communication","icon-library-20-outline-covid-19":"base-icons-icon-library-20-outline-covid-19","icon-library-20-outline-facilities":"base-icons-icon-library-20-outline-facilities","icon-library-20-outline-feature":"base-icons-icon-library-20-outline-feature","icon-library-20-outline-food":"base-icons-icon-library-20-outline-food","icon-library-20-outline-it":"base-icons-icon-library-20-outline-it","icon-library-20-outline-journey":"base-icons-icon-library-20-outline-journey","icon-library-20-outline-maps":"base-icons-icon-library-20-outline-maps","icon-library-20-outline-navigation":"base-icons-icon-library-20-outline-navigation","icon-library-20-outline-notification":"base-icons-icon-library-20-outline-notification","icon-library-20-outline-seat":"base-icons-icon-library-20-outline-seat","icon-library-20-outline-ticket":"base-icons-icon-library-20-outline-ticket","icon-library-20-outline-transportation":"base-icons-icon-library-20-outline-transportation","icon-library-24-filled-action":"base-icons-icon-library-24-filled-action","icon-library-24-filled-av":"base-icons-icon-library-24-filled-av","icon-library-24-filled-journey":"base-icons-icon-library-24-filled-journey","icon-library-24-filled-maps":"base-icons-icon-library-24-filled-maps","icon-library-24-filled-navigation":"base-icons-icon-library-24-filled-navigation","icon-library-24-filled-notification":"base-icons-icon-library-24-filled-notification","icon-library-24-filled-transportation":"base-icons-icon-library-24-filled-transportation","icon-library-24-outline-action":"base-icons-icon-library-24-outline-action","icon-library-24-outline-av":"base-icons-icon-library-24-outline-av","icon-library-24-outline-brand":"base-icons-icon-library-24-outline-brand","icon-library-24-outline-communication":"base-icons-icon-library-24-outline-communication","icon-library-24-outline-covid-19":"base-icons-icon-library-24-outline-covid-19","icon-library-24-outline-facilities":"base-icons-icon-library-24-outline-facilities","icon-library-24-outline-feature":"base-icons-icon-library-24-outline-feature","icon-library-24-outline-food":"base-icons-icon-library-24-outline-food","icon-library-24-outline-it":"base-icons-icon-library-24-outline-it","icon-library-24-outline-journey":"base-icons-icon-library-24-outline-journey","icon-library-24-outline-maps":"base-icons-icon-library-24-outline-maps","icon-library-24-outline-navigation":"base-icons-icon-library-24-outline-navigation","icon-library-24-outline-notification":"base-icons-icon-library-24-outline-notification","icon-library-24-outline-seat":"base-icons-icon-library-24-outline-seat","icon-library-24-outline-ticket":"base-icons-icon-library-24-outline-ticket","icon-library-24-outline-transportation":"base-icons-icon-library-24-outline-transportation","icon-library-32-filled-action":"base-icons-icon-library-32-filled-action","icon-library-32-filled-av":"base-icons-icon-library-32-filled-av","icon-library-32-filled-maps":"base-icons-icon-library-32-filled-maps","icon-library-32-filled-navigation":"base-icons-icon-library-32-filled-navigation","icon-library-32-filled-notification":"base-icons-icon-library-32-filled-notification","icon-library-32-filled-transportation":"base-icons-icon-library-32-filled-transportation","icon-library-32-outline-action":"base-icons-icon-library-32-outline-action","icon-library-32-outline-av":"base-icons-icon-library-32-outline-av","icon-library-32-outline-brand":"base-icons-icon-library-32-outline-brand","icon-library-32-outline-communication":"base-icons-icon-library-32-outline-communication","icon-library-32-outline-covid-19":"base-icons-icon-library-32-outline-covid-19","icon-library-32-outline-facilities":"base-icons-icon-library-32-outline-facilities","icon-library-32-outline-feature":"base-icons-icon-library-32-outline-feature","icon-library-32-outline-food":"base-icons-icon-library-32-outline-food","icon-library-32-outline-it":"base-icons-icon-library-32-outline-it","icon-library-32-outline-journey":"base-icons-icon-library-32-outline-journey","icon-library-32-outline-maps":"base-icons-icon-library-32-outline-maps","icon-library-32-outline-navigation":"base-icons-icon-library-32-outline-navigation","icon-library-32-outline-notification":"base-icons-icon-library-32-outline-notification","icon-library-32-outline-seat":"base-icons-icon-library-32-outline-seat","icon-library-32-outline-ticket":"base-icons-icon-library-32-outline-ticket","icon-library-32-outline-transportation":"base-icons-icon-library-32-outline-transportation","icon-library-48-filled-av":"base-icons-icon-library-48-filled-av","icon-library-48-outline-av":"base-icons-icon-library-48-outline-av","icon-library-48-outline-brand":"base-icons-icon-library-48-outline-brand","icon-library-64-filled-av":"base-icons-icon-library-64-filled-av","icon-library-64-outline-av":"base-icons-icon-library-64-outline-av","icon-library-64-outline-brand":"base-icons-icon-library-64-outline-brand","illustration-icons":"base-icons-illustration-icons","fonts":"base-type-fonts","highlight-colors-1st-priority":"base-type-highlight-colors-1st-priority","highlight-colors-2nd-priority":"base-type-highlight-colors-2nd-priority","highlight-colors-neutral":"base-type-highlight-colors-neutral","highlight-colors-positive":"base-type-highlight-colors-positive"},"components":{"accordion":"components-accordion-accordion","accordion-high-emphasis":"components-accordion-accordion-high-emphasis","accordion-sizes":"components-accordion-accordion-sizes","breadcrumb":"components-breadcrumb-breadcrumb","cards-banner":"components-cards-cards-banner","dialog":"components-dialog-dialog","dialog-button-alignment-end":"components-dialog-dialog-button-alignment-end","dropdown":"components-dropdown-dropdown","dropdown-opposite-position":"components-dropdown-dropdown-opposite-position","example-form":"components-form-example-form","language-switcher":"components-language-switcher-language-switcher","language-switcher-spa":"components-language-switcher-language-switcher-spa","notifications":"components-notifications-notifications","notifications-hovering":"components-notifications-notifications-hovering","notifications-hovering-leading-icon":"components-notifications-notifications-hovering-leading-icon","notifications-hovering-trailing-icon":"components-notifications-notifications-hovering-trailing-icon","notifications-variants":"components-notifications-notifications-variants","overflow-menu":"components-overflow-menu-overflow-menu","overflow-menu-navigation":"components-overflow-menu-overflow-menu-navigation","overflow-menu-navigation-opposite-position":"components-overflow-menu-overflow-menu-navigation-opposite-position","overflow-menu-opposite-position":"components-overflow-menu-overflow-menu-opposite-position","pagination":"components-pagination-pagination","sidenavi":"components-sidenavi-sidenavi","tab-bar":"components-tab-bar-tab-bar","table":"components-table-table","table-alignments":"components-table-table-alignments","table-border-around":"components-table-table-border-around","table-border-horizontal":"components-table-table-border-horizontal","table-density":"components-table-table-density","table-font-size":"components-table-table-font-size","table-icons":"components-table-table-icons","table-overflow-menu":"components-table-table-overflow-menu","table-row-title":"components-table-table-row-title","table-rows-zebra":"components-table-table-rows-zebra","table-sticky-header":"components-table-table-sticky-header"},"elements":{"button-brand-primary":"elements-buttons-01-button-brand-primary","button-primary":"elements-buttons-03-button-primary","button-secondary-outline":"elements-buttons-04-button-secondary-outline","button-secondary-solid":"elements-buttons-05-button-secondary-solid","button-tertiary-plain":"elements-buttons-06-button-tertiary-plain","button-sizes":"elements-buttons-09-button-sizes","button":"elements-buttons-button","checkbox":"elements-checkbox-checkbox","checkbox-checked":"elements-checkbox-checkbox-checked","checkbox-disabled":"elements-checkbox-checkbox-disabled","checkbox-disabled-checked":"elements-checkbox-checkbox-disabled-checked","checkbox-indeterminate":"elements-checkbox-checkbox-indeterminate","checkbox-label-hidden":"elements-checkbox-checkbox-label-hidden","checkbox-on-dark-background":"elements-checkbox-checkbox-on-dark-background","checkbox-on-dark-background-checked":"elements-checkbox-checkbox-on-dark-background-checked","checkbox-on-dark-background-disabled":"elements-checkbox-checkbox-on-dark-background-disabled","checkbox-on-dark-background-disabled-checked":"elements-checkbox-checkbox-on-dark-background-disabled-checked","checkbox-on-dark-background-indeterminate":"elements-checkbox-checkbox-on-dark-background-indeterminate","chips":"elements-chips-chips","chips-disabled":"elements-chips-chips-disabled","chips-type-selection":"elements-chips-chips-type-selection","chips-with-icon":"elements-chips-chips-with-icon","headline":"elements-headline-headline","headline-pulse":"elements-headline-headline-pulse","image":"elements-image-image","image-avif":"elements-image-image-avif","image-lazy-loading":"elements-image-image-lazy-loading","image-responsive-density":"elements-image-image-responsive-density","image-responsive-mediaquery":"elements-image-image-responsive-mediaquery","image-webp":"elements-image-image-webp","image-with-caption":"elements-image-image-with-caption","input":"elements-input-input","input-auto-suggest":"elements-input-input-auto-suggest","input-description":"elements-input-input-description","input-disabled":"elements-input-input-disabled","input-filled":"elements-input-input-filled","input-hidden-label":"elements-input-input-hidden-label","input-invalid":"elements-input-input-invalid","input-invalid-attribute":"elements-input-input-invalid-attribute","input-search":"elements-input-input-search","input-search-filled":"elements-input-input-search-filled","input-valid":"elements-input-input-valid","input-variations":"elements-input-input-variations","links":"elements-link-links","links-small":"elements-link-links-small","loading-indicator":"elements-loading-indicator-loading-indicator","loading-indicator-size-l":"elements-loading-indicator-loading-indicator-size-l","loading-indicator-size-m":"elements-loading-indicator-loading-indicator-size-m","loading-indicator-size-s":"elements-loading-indicator-loading-indicator-size-s","loading-indicator-size-xl":"elements-loading-indicator-loading-indicator-size-xl","loading-indicator-size-XS":"elements-loading-indicator-loading-indicator-size-XS","logo":"elements-logo-logo","logo-on-backgrounds":"elements-logo-logo-on-backgrounds","logo-sizes":"elements-logo-logo-sizes","logo-with-following-headline":"elements-logo-logo-with-following-headline","progress":"elements-progress-progress","progress-linear-spinner":"elements-progress-progress-linear-spinner","progress-linear-spinner-indeterminate":"elements-progress-progress-linear-spinner-indeterminate","radios":"elements-radio-radios","radios-checked":"elements-radio-radios-checked","radios-disabled":"elements-radio-radios-disabled","radios-disabled-checked":"elements-radio-radios-disabled-checked","radios-invalid-attribute":"elements-radio-radios-invalid-attribute","radios-label-hidden":"elements-radio-radios-label-hidden","radios-required":"elements-radio-radios-required","select":"elements-select-select","select-hidden-label":"elements-select-select-hidden-label","select-invalid-attribute":"elements-select-select-invalid-attribute","select-variations":"elements-select-select-variations","select-variations-disabled":"elements-select-select-variations-disabled","select-variations-optgroups":"elements-select-select-variations-optgroups","tags":"elements-tags-tags","tags-small":"elements-tags-tags-small","tags-with-icon":"elements-tags-tags-with-icon","textarea":"elements-textarea-textarea","textarea-description":"elements-textarea-textarea-description","textarea-disabled":"elements-textarea-textarea-disabled","textarea-filled":"elements-textarea-textarea-filled","textarea-hidden-label":"elements-textarea-textarea-hidden-label","textarea-invalid":"elements-textarea-textarea-invalid","textarea-invalid-attribute":"elements-textarea-textarea-invalid-attribute","textarea-valid":"elements-textarea-textarea-valid","textarea-variations":"elements-textarea-textarea-variations","toggle":"elements-toggle-toggle","toggle-disabled":"elements-toggle-toggle-disabled","toggle-on":"elements-toggle-toggle-on","toggle-on-disabled":"elements-toggle-toggle-on-disabled"},"pages":{"sample-page":"pages-sample-page","intro":"pages-intro"}}; +var viewAllPaths = {"areas":{"footer":"areas-footer","all":"areas","grid":"areas-grid","header":"areas-header"},"base":{"colors":"base-colors","all":"base","icons":"base-icons","type":"base-type"},"components":{"accordion":"components-accordion","all":"components","breadcrumb":"components-breadcrumb","cards":"components-cards","dialog":"components-dialog","dropdown":"components-dropdown","form":"components-form","language-switcher":"components-language-switcher","notifications":"components-notifications","overflow-menu":"components-overflow-menu","pagination":"components-pagination","sidenavi":"components-sidenavi","tab-bar":"components-tab-bar","table":"components-table"},"elements":{"buttons":"elements-buttons","all":"elements","checkbox":"elements-checkbox","chips":"elements-chips","headline":"elements-headline","image":"elements-image","input":"elements-input","link":"elements-link","loading-indicator":"elements-loading-indicator","logo":"elements-logo","progress":"elements-progress","radio":"elements-radio","select":"elements-select","tags":"elements-tags","textarea":"elements-textarea","toggle":"elements-toggle"},"pages":{"all":"pages"}}; +var plugins = [{"name":"@mfranzke/plugin-node-uiextension","templates":[],"stylesheets":["../../../css/pattern-scaffolding-project-specific.css"],"javascripts":["patternlab-components/pattern-lab/@mfranzke-plugin-node-uiextension/js/@mfranzke-plugin-node-uiextension.js"],"onready":"PluginUIExtension.init()","callback":"","navLinks":{"before":[],"after":[]},"toolLinks":{"before":[],"after":[{"text":"Imprint","url":"https://www.dbsystel.de/dbsystel-en/legal-3715942","class":"","icon":"help"},{"text":"Datenschutzerklärung","url":"https://db-ui.github.io/datenschutzerklaerung.html","class":"","icon":"help"}]}}]; +var defaultShowPatternInfo = false; +var defaultPattern = "pages-intro"; +module.exports = { config, ishControls, navItems, patternPaths, viewAllPaths, plugins, defaultShowPatternInfo, defaultPattern }; \ No newline at end of file diff --git a/version/v2.18.3/styleguide/data/patternlab-data.js b/version/v2.18.3/styleguide/data/patternlab-data.js new file mode 100644 index 0000000000..20a11a3e1c --- /dev/null +++ b/version/v2.18.3/styleguide/data/patternlab-data.js @@ -0,0 +1,8 @@ +var config = {"cacheBust":true,"cleanPublic":true,"defaultPattern":"pages-intro","defaultShowPatternInfo":false,"defaultPatternInfoPanelCode":"html","defaultInitialViewportWidth":true,"disableDeprecationWarningForOrderPatterns":true,"disableDeprecationWarningForHiddenPatterns":true,"ishControlsHide":{"s":false,"m":false,"l":false,"full":false,"random":false,"disco":true,"hay":true,"mqs":false,"find":false,"views-all":false,"views-annotations":false,"views-code":false,"views-new":false,"tools-all":false,"tools-docs":false},"ishViewportRange":{"s":[360,500],"m":[500,800],"l":[800,2600]},"logLevel":"info","outputFileSuffixes":{"rendered":".rendered","rawTemplate":"","markupOnly":".markup-only"},"paths":{"source":{"root":"./source/","patterns":"./source/_patterns/","data":"./source/_data/enterprise/","meta":"./source/_meta/","annotations":"./source/_annotations/","styleguide":"dist/","patternlabFiles":{"general-header":"views/partials/general-header.mustache","general-footer":"views/partials/general-footer.mustache","patternSection":"views/partials/patternSection.mustache","patternSectionSubgroup":"views/partials/patternSectionSubgroup.mustache","viewall":"views/viewall.mustache"},"js":"./source/js","images":"./source/images","fonts":"./node_modules/@db-ui/base/build/assets/fonts","css":"./source/css","icons":"./node_modules/@db-ui/base/build/assets/icons","samples":"./source/samples","iframeResizer.contentWindow.js":"node_modules/iframe-resizer/js/iframeResizer.contentWindow.js","details-element-polyfill.js":"node_modules/details-element-polyfill/dist/details-element-polyfill.js","dialog-polyfill.js":"node_modules/dialog-polyfill/dist/dialog-polyfill.js","dialog-polyfill.css":"node_modules/dialog-polyfill/dist/dialog-polyfill.css","sitemap":"./source/sitemap.xml"},"public":{"root":"out/","patterns":"out/patterns/","data":"out/styleguide/data/","annotations":"out/annotations/","styleguide":"out/styleguide/","js":"out/js","images":"out/images","fonts":"out/fonts","css":"out/css","icons":"out/icons","samples":"out/samples","iframeResizer.contentWindow.js":"out/js/iframeResizer.contentWindow.js","details-element-polyfill.js":"out/js/details-element-polyfill.js","dialog-polyfill.js":"out/js/dialog-polyfill.js","dialog-polyfill.css":"out/css/dialog-polyfill.css","sitemap":"out/sitemap.xml"}},"patternExtension":"hbs","patternStateCascade":["inevaluation","inprogress","inreview","complete"],"patternExportAll":false,"patternExportDirectory":"pattern_exports","patternExportPatternPartials":[],"patternExportPreserveDirectoryStructure":true,"patternExportRaw":false,"patternMergeVariantArrays":true,"renderFlatPatternsOnViewAllPages":false,"serverOptions":{"wait":1000,"port":8080,"ignore":"/^.*public/(?!.*[.]css$).*$/i"},"starterkitSubDir":"dist","styleGuideExcludes":["pages"],"theme":{"color":"light","density":"compact","layout":"vertical","logo":{"text":"","altText":"Deutsche Bahn Logo","url":"./","srcLight":"images/db_logo.svg","srcDark":"images/db_logo.svg","width":"33","height":"23"}},"uikits":[{"name":"uikit-workshop","package":"@pattern-lab/uikit-workshop","outputDir":"","enabled":true,"excludedPatternStates":[],"excludedTags":["style-1.6"]}],"engines":{"handlebars":{"package":"@pattern-lab/engine-handlebars","extensions":["hbs"],"extend":"helpers/*.js"},"mustache":{"package":"@pattern-lab/engine-mustache","extensions":"mustache"}},"transformedAssetTypes":["scss"],"plugins":{"@mfranzke/plugin-node-uiextension":{"enabled":true,"initialized":false,"options":{"stylesheets":["css/pattern-scaffolding-project-specific.css"],"navLinks":{"before":[],"after":[]},"toolLinks":{"before":[],"after":[{"text":"Imprint","url":"https://www.dbsystel.de/dbsystel-en/legal-3715942","class":"","icon":"help"},{"text":"Datenschutzerklärung","url":"https://db-ui.github.io/datenschutzerklaerung.html","class":"","icon":"help"}]}}},"plugin-node-patternlab-inline-remote-assets":{"enabled":true,"initialized":false,"options":{}}}}; +var ishControls = {"ishControlsHide":{"s":false,"m":false,"l":false,"full":false,"random":false,"disco":true,"hay":true,"mqs":false,"find":false,"views-all":false,"views-annotations":false,"views-code":false,"views-new":false,"tools-all":false,"tools-docs":false}}; +var navItems = {"patternGroups": [{"patternGroupLC":"base","patternGroupUC":"Base","patternGroup":"base","patternGroupDash":"base","patternGroupItems":[{"patternSubgroupLC":"colors","patternSubgroupUC":"Colors","patternSubgroup":"colors","patternSubgroupDash":"colors","patternSubgroupItems":[{"patternPartial":"base-primary","patternName":"Marketingportal Brand Colors - Primary","patternState":"complete","patternPath":"base-colors-primary/base-colors-primary.rendered.html","name":"base-colors-primary","isDocPattern":false,"order":10,"variantOrder":0},{"patternPartial":"base-secondary","patternName":"Marketingportal Brand Colors - Secondary","patternState":"complete","patternPath":"base-colors-secondary/base-colors-secondary.rendered.html","name":"base-colors-secondary","isDocPattern":false,"order":20,"variantOrder":0},{"patternPartial":"base-feedback","patternName":"Marketingportal Brand Colors - Feedback","patternState":"inreview","patternPath":"base-colors-feedback/base-colors-feedback.rendered.html","name":"base-colors-feedback","isDocPattern":false,"order":30,"variantOrder":0},{"patternPartial":"base-poi","patternName":"Marketingportal Brand Colors - POI","patternState":"inreview","patternPath":"base-colors-poi/base-colors-poi.rendered.html","name":"base-colors-poi","isDocPattern":false,"order":40,"variantOrder":0},{"patternPartial":"base-transportation","patternName":"Marketingportal Brand Colors - Transport","patternState":"complete","patternPath":"base-colors-transportation/base-colors-transportation.rendered.html","name":"base-colors-transportation","isDocPattern":false,"order":50,"variantOrder":0},{"patternPartial":"viewall-base-colors","patternName":"View All","patternPath":"base-colors/index.html","patternGroup":"base","patternSubgroup":"colors","name":"base-colors","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"icons","patternSubgroupUC":"Icons","patternSubgroup":"icons","patternSubgroupDash":"icons","patternSubgroupItems":[{"patternPartial":"base-icon-library","patternName":"Icon Library","patternState":"","patternPath":"base-icons-icon-library/base-icons-icon-library.rendered.html","name":"base-icons-icon-library","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-filled-action","patternName":"DB Icons 16x16 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-16-filled-action/base-icons-icon-library-16-filled-action.rendered.html","name":"base-icons-icon-library-16-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-filled-navigation","patternName":"DB Icons 16x16 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-16-filled-navigation/base-icons-icon-library-16-filled-navigation.rendered.html","name":"base-icons-icon-library-16-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-filled-notification","patternName":"DB Icons 16x16 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-16-filled-notification/base-icons-icon-library-16-filled-notification.rendered.html","name":"base-icons-icon-library-16-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-outline-action","patternName":"DB Icons 16x16 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-16-outline-action/base-icons-icon-library-16-outline-action.rendered.html","name":"base-icons-icon-library-16-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-16-outline-navigation","patternName":"DB Icons 16x16 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-16-outline-navigation/base-icons-icon-library-16-outline-navigation.rendered.html","name":"base-icons-icon-library-16-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-action","patternName":"DB Icons 20x20 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-action/base-icons-icon-library-20-filled-action.rendered.html","name":"base-icons-icon-library-20-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-av","patternName":"DB Icons 20x20 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-av/base-icons-icon-library-20-filled-av.rendered.html","name":"base-icons-icon-library-20-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-communication","patternName":"DB Icons 20x20 - Filled - Communication","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-communication/base-icons-icon-library-20-filled-communication.rendered.html","name":"base-icons-icon-library-20-filled-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-feature","patternName":"DB Icons 20x20 - Filled - Feature","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-feature/base-icons-icon-library-20-filled-feature.rendered.html","name":"base-icons-icon-library-20-filled-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-food","patternName":"DB Icons 20x20 - Filled - Food","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-food/base-icons-icon-library-20-filled-food.rendered.html","name":"base-icons-icon-library-20-filled-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-it","patternName":"DB Icons 20x20 - Filled - IT","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-it/base-icons-icon-library-20-filled-it.rendered.html","name":"base-icons-icon-library-20-filled-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-journey","patternName":"DB Icons 20x20 - Filled - Journey","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-journey/base-icons-icon-library-20-filled-journey.rendered.html","name":"base-icons-icon-library-20-filled-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-maps","patternName":"DB Icons 20x20 - Filled - Maps","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-maps/base-icons-icon-library-20-filled-maps.rendered.html","name":"base-icons-icon-library-20-filled-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-navigation","patternName":"DB Icons 20x20 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-navigation/base-icons-icon-library-20-filled-navigation.rendered.html","name":"base-icons-icon-library-20-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-notification","patternName":"DB Icons 20x20 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-notification/base-icons-icon-library-20-filled-notification.rendered.html","name":"base-icons-icon-library-20-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-ticket","patternName":"DB Icons 20x20 - Filled - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-ticket/base-icons-icon-library-20-filled-ticket.rendered.html","name":"base-icons-icon-library-20-filled-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-filled-transportation","patternName":"DB Icons 20x20 - Filled - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-20-filled-transportation/base-icons-icon-library-20-filled-transportation.rendered.html","name":"base-icons-icon-library-20-filled-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-action","patternName":"DB Icons 20x20 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-action/base-icons-icon-library-20-outline-action.rendered.html","name":"base-icons-icon-library-20-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-av","patternName":"DB Icons 20x20 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-av/base-icons-icon-library-20-outline-av.rendered.html","name":"base-icons-icon-library-20-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-brand","patternName":"DB Icons 20x20 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-brand/base-icons-icon-library-20-outline-brand.rendered.html","name":"base-icons-icon-library-20-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-communication","patternName":"DB Icons 20x20 - Outline - Communication","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-communication/base-icons-icon-library-20-outline-communication.rendered.html","name":"base-icons-icon-library-20-outline-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-covid-19","patternName":"DB Icons 20x20 - Outline - Covid 19","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-covid-19/base-icons-icon-library-20-outline-covid-19.rendered.html","name":"base-icons-icon-library-20-outline-covid-19","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-facilities","patternName":"DB Icons 20x20 - Outline - Facilities","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-facilities/base-icons-icon-library-20-outline-facilities.rendered.html","name":"base-icons-icon-library-20-outline-facilities","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-feature","patternName":"DB Icons 20x20 - Outline - Feature","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-feature/base-icons-icon-library-20-outline-feature.rendered.html","name":"base-icons-icon-library-20-outline-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-food","patternName":"DB Icons 20x20 - Outline - Food","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-food/base-icons-icon-library-20-outline-food.rendered.html","name":"base-icons-icon-library-20-outline-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-it","patternName":"DB Icons 20x20 - Outline - IT","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-it/base-icons-icon-library-20-outline-it.rendered.html","name":"base-icons-icon-library-20-outline-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-journey","patternName":"DB Icons 20x20 - Outline - Journey","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-journey/base-icons-icon-library-20-outline-journey.rendered.html","name":"base-icons-icon-library-20-outline-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-maps","patternName":"DB Icons 20x20 - Outline - Maps","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-maps/base-icons-icon-library-20-outline-maps.rendered.html","name":"base-icons-icon-library-20-outline-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-navigation","patternName":"DB Icons 20x20 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-navigation/base-icons-icon-library-20-outline-navigation.rendered.html","name":"base-icons-icon-library-20-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-notification","patternName":"DB Icons 20x20 - Outline - Notification","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-notification/base-icons-icon-library-20-outline-notification.rendered.html","name":"base-icons-icon-library-20-outline-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-seat","patternName":"DB Icons 20x20 - Outline - Seat","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-seat/base-icons-icon-library-20-outline-seat.rendered.html","name":"base-icons-icon-library-20-outline-seat","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-ticket","patternName":"DB Icons 20x20 - Outline - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-ticket/base-icons-icon-library-20-outline-ticket.rendered.html","name":"base-icons-icon-library-20-outline-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-20-outline-transportation","patternName":"DB Icons 20x20 - Outline - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-20-outline-transportation/base-icons-icon-library-20-outline-transportation.rendered.html","name":"base-icons-icon-library-20-outline-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-action","patternName":"DB Icons 24x24 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-action/base-icons-icon-library-24-filled-action.rendered.html","name":"base-icons-icon-library-24-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-av","patternName":"DB Icons 24x24 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-av/base-icons-icon-library-24-filled-av.rendered.html","name":"base-icons-icon-library-24-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-journey","patternName":"DB Icons 24x24 - Filled - Journey","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-journey/base-icons-icon-library-24-filled-journey.rendered.html","name":"base-icons-icon-library-24-filled-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-maps","patternName":"DB Icons 24x24 - Filled - Maps","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-maps/base-icons-icon-library-24-filled-maps.rendered.html","name":"base-icons-icon-library-24-filled-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-navigation","patternName":"DB Icons 24x24 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-navigation/base-icons-icon-library-24-filled-navigation.rendered.html","name":"base-icons-icon-library-24-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-notification","patternName":"DB Icons 24x24 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-notification/base-icons-icon-library-24-filled-notification.rendered.html","name":"base-icons-icon-library-24-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-filled-transportation","patternName":"DB Icons 24x24 - Filled - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-24-filled-transportation/base-icons-icon-library-24-filled-transportation.rendered.html","name":"base-icons-icon-library-24-filled-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-action","patternName":"DB Icons 24x24 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-action/base-icons-icon-library-24-outline-action.rendered.html","name":"base-icons-icon-library-24-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-av","patternName":"DB Icons 24x24 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-av/base-icons-icon-library-24-outline-av.rendered.html","name":"base-icons-icon-library-24-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-brand","patternName":"DB Icons 24x24 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-brand/base-icons-icon-library-24-outline-brand.rendered.html","name":"base-icons-icon-library-24-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-communication","patternName":"DB Icons 24x24 - Outline - Communication","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-communication/base-icons-icon-library-24-outline-communication.rendered.html","name":"base-icons-icon-library-24-outline-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-covid-19","patternName":"DB Icons 24x24 - Outline - Covid 19","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-covid-19/base-icons-icon-library-24-outline-covid-19.rendered.html","name":"base-icons-icon-library-24-outline-covid-19","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-facilities","patternName":"DB Icons 24x24 - Outline - Facilities","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-facilities/base-icons-icon-library-24-outline-facilities.rendered.html","name":"base-icons-icon-library-24-outline-facilities","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-feature","patternName":"DB Icons 24x24 - Outline - Feature","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-feature/base-icons-icon-library-24-outline-feature.rendered.html","name":"base-icons-icon-library-24-outline-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-food","patternName":"DB Icons 24x24 - Outline - Food","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-food/base-icons-icon-library-24-outline-food.rendered.html","name":"base-icons-icon-library-24-outline-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-it","patternName":"DB Icons 24x24 - Outline - IT","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-it/base-icons-icon-library-24-outline-it.rendered.html","name":"base-icons-icon-library-24-outline-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-journey","patternName":"DB Icons 24x24 - Outline - Journey","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-journey/base-icons-icon-library-24-outline-journey.rendered.html","name":"base-icons-icon-library-24-outline-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-maps","patternName":"DB Icons 24x24 - Outline - Maps","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-maps/base-icons-icon-library-24-outline-maps.rendered.html","name":"base-icons-icon-library-24-outline-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-navigation","patternName":"DB Icons 24x24 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-navigation/base-icons-icon-library-24-outline-navigation.rendered.html","name":"base-icons-icon-library-24-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-notification","patternName":"DB Icons 24x24 - Outline - Notification","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-notification/base-icons-icon-library-24-outline-notification.rendered.html","name":"base-icons-icon-library-24-outline-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-seat","patternName":"DB Icons 24x24 - Outline - Seat","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-seat/base-icons-icon-library-24-outline-seat.rendered.html","name":"base-icons-icon-library-24-outline-seat","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-ticket","patternName":"DB Icons 24x24 - Outline - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-ticket/base-icons-icon-library-24-outline-ticket.rendered.html","name":"base-icons-icon-library-24-outline-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-24-outline-transportation","patternName":"DB Icons 24x24 - Outline - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-24-outline-transportation/base-icons-icon-library-24-outline-transportation.rendered.html","name":"base-icons-icon-library-24-outline-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-action","patternName":"DB Icons 32x32 - Filled - Action","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-action/base-icons-icon-library-32-filled-action.rendered.html","name":"base-icons-icon-library-32-filled-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-av","patternName":"DB Icons 32x32 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-av/base-icons-icon-library-32-filled-av.rendered.html","name":"base-icons-icon-library-32-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-maps","patternName":"DB Icons 32x32 - Filled - Maps","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-maps/base-icons-icon-library-32-filled-maps.rendered.html","name":"base-icons-icon-library-32-filled-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-navigation","patternName":"DB Icons 32x32 - Filled - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-navigation/base-icons-icon-library-32-filled-navigation.rendered.html","name":"base-icons-icon-library-32-filled-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-notification","patternName":"DB Icons 32x32 - Filled - Notification","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-notification/base-icons-icon-library-32-filled-notification.rendered.html","name":"base-icons-icon-library-32-filled-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-filled-transportation","patternName":"DB Icons 32x32 - Filled - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-32-filled-transportation/base-icons-icon-library-32-filled-transportation.rendered.html","name":"base-icons-icon-library-32-filled-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-action","patternName":"DB Icons 32x32 - Outline - Action","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-action/base-icons-icon-library-32-outline-action.rendered.html","name":"base-icons-icon-library-32-outline-action","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-av","patternName":"DB Icons 32x32 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-av/base-icons-icon-library-32-outline-av.rendered.html","name":"base-icons-icon-library-32-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-brand","patternName":"DB Icons 32x32 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-brand/base-icons-icon-library-32-outline-brand.rendered.html","name":"base-icons-icon-library-32-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-communication","patternName":"DB Icons 32x32 - Outline - Communication","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-communication/base-icons-icon-library-32-outline-communication.rendered.html","name":"base-icons-icon-library-32-outline-communication","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-covid-19","patternName":"DB Icons 32x32 - Outline - Covid 19","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-covid-19/base-icons-icon-library-32-outline-covid-19.rendered.html","name":"base-icons-icon-library-32-outline-covid-19","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-facilities","patternName":"DB Icons 32x32 - Outline - Facilities","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-facilities/base-icons-icon-library-32-outline-facilities.rendered.html","name":"base-icons-icon-library-32-outline-facilities","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-feature","patternName":"DB Icons 32x32 - Outline - Feature","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-feature/base-icons-icon-library-32-outline-feature.rendered.html","name":"base-icons-icon-library-32-outline-feature","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-food","patternName":"DB Icons 32x32 - Outline - Food","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-food/base-icons-icon-library-32-outline-food.rendered.html","name":"base-icons-icon-library-32-outline-food","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-it","patternName":"DB Icons 32x32 - Outline - IT","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-it/base-icons-icon-library-32-outline-it.rendered.html","name":"base-icons-icon-library-32-outline-it","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-journey","patternName":"DB Icons 32x32 - Outline - Journey","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-journey/base-icons-icon-library-32-outline-journey.rendered.html","name":"base-icons-icon-library-32-outline-journey","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-maps","patternName":"DB Icons 32x32 - Outline - Maps","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-maps/base-icons-icon-library-32-outline-maps.rendered.html","name":"base-icons-icon-library-32-outline-maps","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-navigation","patternName":"DB Icons 32x32 - Outline - Navigation","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-navigation/base-icons-icon-library-32-outline-navigation.rendered.html","name":"base-icons-icon-library-32-outline-navigation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-notification","patternName":"DB Icons 32x32 - Outline - Notification","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-notification/base-icons-icon-library-32-outline-notification.rendered.html","name":"base-icons-icon-library-32-outline-notification","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-seat","patternName":"DB Icons 32x32 - Outline - Seat","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-seat/base-icons-icon-library-32-outline-seat.rendered.html","name":"base-icons-icon-library-32-outline-seat","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-ticket","patternName":"DB Icons 32x32 - Outline - Ticket","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-ticket/base-icons-icon-library-32-outline-ticket.rendered.html","name":"base-icons-icon-library-32-outline-ticket","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-32-outline-transportation","patternName":"DB Icons 32x32 - Outline - Transportation","patternState":"complete","patternPath":"base-icons-icon-library-32-outline-transportation/base-icons-icon-library-32-outline-transportation.rendered.html","name":"base-icons-icon-library-32-outline-transportation","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-48-filled-av","patternName":"DB Icons 48x48 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-48-filled-av/base-icons-icon-library-48-filled-av.rendered.html","name":"base-icons-icon-library-48-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-48-outline-av","patternName":"DB Icons 48x48 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-48-outline-av/base-icons-icon-library-48-outline-av.rendered.html","name":"base-icons-icon-library-48-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-48-outline-brand","patternName":"DB Icons 48x48 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-48-outline-brand/base-icons-icon-library-48-outline-brand.rendered.html","name":"base-icons-icon-library-48-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-64-filled-av","patternName":"DB Icons 64x64 - Filled - AV","patternState":"complete","patternPath":"base-icons-icon-library-64-filled-av/base-icons-icon-library-64-filled-av.rendered.html","name":"base-icons-icon-library-64-filled-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-64-outline-av","patternName":"DB Icons 64x64 - Outline - AV","patternState":"complete","patternPath":"base-icons-icon-library-64-outline-av/base-icons-icon-library-64-outline-av.rendered.html","name":"base-icons-icon-library-64-outline-av","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-icon-library-64-outline-brand","patternName":"DB Icons 64x64 - Outline - Brand","patternState":"complete","patternPath":"base-icons-icon-library-64-outline-brand/base-icons-icon-library-64-outline-brand.rendered.html","name":"base-icons-icon-library-64-outline-brand","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-illustration-icons","patternName":"Illustration Icons","patternState":"","patternPath":"base-icons-illustration-icons/base-icons-illustration-icons.rendered.html","name":"base-icons-illustration-icons","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-base-icons","patternName":"View All","patternPath":"base-icons/index.html","patternGroup":"base","patternSubgroup":"icons","name":"base-icons","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"type","patternSubgroupUC":"Type","patternSubgroup":"type","patternSubgroupDash":"type","patternSubgroupItems":[{"patternPartial":"base-fonts","patternName":"Fonts","patternState":"complete","patternPath":"base-type-fonts/base-type-fonts.rendered.html","name":"base-type-fonts","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-1st-priority","patternName":"Highlight Colors 1st Priority","patternState":"","patternPath":"base-type-highlight-colors-1st-priority/base-type-highlight-colors-1st-priority.rendered.html","name":"base-type-highlight-colors-1st-priority","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-2nd-priority","patternName":"Highlight Colors 2nd Priority","patternState":"","patternPath":"base-type-highlight-colors-2nd-priority/base-type-highlight-colors-2nd-priority.rendered.html","name":"base-type-highlight-colors-2nd-priority","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-neutral","patternName":"Highlight Colors Neutral","patternState":"","patternPath":"base-type-highlight-colors-neutral/base-type-highlight-colors-neutral.rendered.html","name":"base-type-highlight-colors-neutral","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"base-highlight-colors-positive","patternName":"Highlight Colors Positive","patternState":"","patternPath":"base-type-highlight-colors-positive/base-type-highlight-colors-positive.rendered.html","name":"base-type-highlight-colors-positive","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-base-type","patternName":"View All","patternPath":"base-type/index.html","patternGroup":"base","patternSubgroup":"type","name":"base-type","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":0,"patternItems":[{"patternPartial":"viewall-base-all","patternName":"View all Base","patternPath":"base/index.html","name":"base","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"elements","patternGroupUC":"Elements","patternGroup":"elements","patternGroupDash":"elements","patternGroupItems":[{"patternSubgroupLC":"buttons","patternSubgroupUC":"Buttons","patternSubgroup":"buttons","patternSubgroupDash":"buttons","patternSubgroupItems":[{"patternPartial":"elements-button","patternName":"Button","patternState":"","patternPath":"elements-buttons-button/elements-buttons-button.rendered.html","name":"elements-buttons-button","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-button-brand-primary","patternName":"Button Brand Primary","patternState":"","patternPath":"elements-buttons-01-button-brand-primary/elements-buttons-01-button-brand-primary.rendered.html","name":"elements-buttons-01-button-brand-primary","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"elements-button-primary","patternName":"Button Primary","patternState":"","patternPath":"elements-buttons-03-button-primary/elements-buttons-03-button-primary.rendered.html","name":"elements-buttons-03-button-primary","isDocPattern":false,"order":3,"variantOrder":0},{"patternPartial":"elements-button-secondary-outline","patternName":"Button Secondary Outline","patternState":"","patternPath":"elements-buttons-04-button-secondary-outline/elements-buttons-04-button-secondary-outline.rendered.html","name":"elements-buttons-04-button-secondary-outline","isDocPattern":false,"order":4,"variantOrder":0},{"patternPartial":"elements-button-secondary-solid","patternName":"Button Secondary Solid","patternState":"","patternPath":"elements-buttons-05-button-secondary-solid/elements-buttons-05-button-secondary-solid.rendered.html","name":"elements-buttons-05-button-secondary-solid","isDocPattern":false,"order":5,"variantOrder":0},{"patternPartial":"elements-button-tertiary-plain","patternName":"Button Tertiary Plain","patternState":"","patternPath":"elements-buttons-06-button-tertiary-plain/elements-buttons-06-button-tertiary-plain.rendered.html","name":"elements-buttons-06-button-tertiary-plain","isDocPattern":false,"order":6,"variantOrder":0},{"patternPartial":"elements-button-sizes","patternName":"Button Sizes","patternState":"","patternPath":"elements-buttons-09-button-sizes/elements-buttons-09-button-sizes.rendered.html","name":"elements-buttons-09-button-sizes","isDocPattern":false,"order":9,"variantOrder":0},{"patternPartial":"viewall-elements-buttons","patternName":"View All","patternPath":"elements-buttons/index.html","patternGroup":"elements","patternSubgroup":"buttons","name":"elements-buttons","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"checkbox","patternSubgroupUC":"Checkbox","patternSubgroup":"checkbox","patternSubgroupDash":"checkbox","patternSubgroupItems":[{"patternPartial":"elements-checkbox","patternName":"Checkbox","patternState":"complete","patternPath":"elements-checkbox-checkbox/elements-checkbox-checkbox.rendered.html","name":"elements-checkbox-checkbox","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-checked","patternName":"Checkbox Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-checked/elements-checkbox-checkbox-checked.rendered.html","name":"elements-checkbox-checkbox-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-disabled","patternName":"Checkbox Disabled","patternState":"complete","patternPath":"elements-checkbox-checkbox-disabled/elements-checkbox-checkbox-disabled.rendered.html","name":"elements-checkbox-checkbox-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-disabled-checked","patternName":"Checkbox Disabled Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-disabled-checked/elements-checkbox-checkbox-disabled-checked.rendered.html","name":"elements-checkbox-checkbox-disabled-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-indeterminate","patternName":"Checkbox - indeterminate","patternState":"complete","patternPath":"elements-checkbox-checkbox-indeterminate/elements-checkbox-checkbox-indeterminate.rendered.html","name":"elements-checkbox-checkbox-indeterminate","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-label-hidden","patternName":"Checkbox - Hidden label","patternState":"complete","patternPath":"elements-checkbox-checkbox-label-hidden/elements-checkbox-checkbox-label-hidden.rendered.html","name":"elements-checkbox-checkbox-label-hidden","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background","patternName":"Checkbox On Dark Background","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background/elements-checkbox-checkbox-on-dark-background.rendered.html","name":"elements-checkbox-checkbox-on-dark-background","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-checked","patternName":"Checkbox On Dark Background Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-checked/elements-checkbox-checkbox-on-dark-background-checked.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-disabled","patternName":"Checkbox On Dark Background Disabled","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-disabled/elements-checkbox-checkbox-on-dark-background-disabled.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-disabled-checked","patternName":"Checkbox On Dark Background Disabled Checked","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-disabled-checked/elements-checkbox-checkbox-on-dark-background-disabled-checked.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-disabled-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-checkbox-on-dark-background-indeterminate","patternName":"Checkbox - indeterminate on dark background","patternState":"complete","patternPath":"elements-checkbox-checkbox-on-dark-background-indeterminate/elements-checkbox-checkbox-on-dark-background-indeterminate.rendered.html","name":"elements-checkbox-checkbox-on-dark-background-indeterminate","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-checkbox","patternName":"View All","patternPath":"elements-checkbox/index.html","patternGroup":"elements","patternSubgroup":"checkbox","name":"elements-checkbox","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"chips","patternSubgroupUC":"Chips","patternSubgroup":"chips","patternSubgroupDash":"chips","patternSubgroupItems":[{"patternPartial":"elements-chips","patternName":"Filter chips","patternState":"","patternPath":"elements-chips-chips/elements-chips-chips.rendered.html","name":"elements-chips-chips","isDocPattern":false,"order":10,"variantOrder":0},{"patternPartial":"elements-chips-type-selection","patternName":"Selection chips","patternState":"","patternPath":"elements-chips-chips-type-selection/elements-chips-chips-type-selection.rendered.html","name":"elements-chips-chips-type-selection","isDocPattern":false,"order":10,"variantOrder":20},{"patternPartial":"elements-chips-with-icon","patternName":"Chips with icon","patternState":"","patternPath":"elements-chips-chips-with-icon/elements-chips-chips-with-icon.rendered.html","name":"elements-chips-chips-with-icon","isDocPattern":false,"order":10,"variantOrder":30},{"patternPartial":"elements-chips-disabled","patternName":"Chips – disabled","patternState":"","patternPath":"elements-chips-chips-disabled/elements-chips-chips-disabled.rendered.html","name":"elements-chips-chips-disabled","isDocPattern":false,"order":10,"variantOrder":40},{"patternPartial":"viewall-elements-chips","patternName":"View All","patternPath":"elements-chips/index.html","patternGroup":"elements","patternSubgroup":"chips","name":"elements-chips","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"headline","patternSubgroupUC":"Headline","patternSubgroup":"headline","patternSubgroupDash":"headline","patternSubgroupItems":[{"patternPartial":"elements-headline","patternName":"Headline","patternState":"","patternPath":"elements-headline-headline/elements-headline-headline.rendered.html","name":"elements-headline-headline","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-headline-pulse","patternName":"Headline Pulse","patternState":"","patternPath":"elements-headline-headline-pulse/elements-headline-headline-pulse.rendered.html","name":"elements-headline-headline-pulse","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-headline","patternName":"View All","patternPath":"elements-headline/index.html","patternGroup":"elements","patternSubgroup":"headline","name":"elements-headline","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"image","patternSubgroupUC":"Image","patternSubgroup":"image","patternSubgroupDash":"image","patternSubgroupItems":[{"patternPartial":"elements-image","patternName":"Image","patternState":"","patternPath":"elements-image-image/elements-image-image.rendered.html","name":"elements-image-image","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-avif","patternName":"Image - AVIF","patternState":"complete","patternPath":"elements-image-image-avif/elements-image-image-avif.rendered.html","name":"elements-image-image-avif","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-lazy-loading","patternName":"Image - Lazy loading","patternState":"complete","patternPath":"elements-image-image-lazy-loading/elements-image-image-lazy-loading.rendered.html","name":"elements-image-image-lazy-loading","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-responsive-density","patternName":"Image - Responsive and pixel density","patternState":"complete","patternPath":"elements-image-image-responsive-density/elements-image-image-responsive-density.rendered.html","name":"elements-image-image-responsive-density","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-responsive-mediaquery","patternName":"Image - Responsive mediaquery","patternState":"complete","patternPath":"elements-image-image-responsive-mediaquery/elements-image-image-responsive-mediaquery.rendered.html","name":"elements-image-image-responsive-mediaquery","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-webp","patternName":"Image - WebP","patternState":"complete","patternPath":"elements-image-image-webp/elements-image-image-webp.rendered.html","name":"elements-image-image-webp","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-image-with-caption","patternName":"Image - with caption","patternState":"inevaluation","patternPath":"elements-image-image-with-caption/elements-image-image-with-caption.rendered.html","name":"elements-image-image-with-caption","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-image","patternName":"View All","patternPath":"elements-image/index.html","patternGroup":"elements","patternSubgroup":"image","name":"elements-image","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"input","patternSubgroupUC":"Input","patternSubgroup":"input","patternSubgroupDash":"input","patternSubgroupItems":[{"patternPartial":"elements-input-variations","patternName":"Input variations","patternState":"","patternPath":"elements-input-input-variations/elements-input-input-variations.rendered.html","name":"elements-input-input-variations","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"elements-input","patternName":"Input","patternState":"","patternPath":"elements-input-input/elements-input-input.rendered.html","name":"elements-input-input","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-input-auto-suggest","patternName":"Input - Auto suggestions","patternState":"","patternPath":"elements-input-input-auto-suggest/elements-input-input-auto-suggest.rendered.html","name":"elements-input-input-auto-suggest","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-input-description","patternName":"Input with description","patternState":"","patternPath":"elements-input-input-description/elements-input-input-description.rendered.html","name":"elements-input-input-description","isDocPattern":false,"order":2,"variantOrder":3},{"patternPartial":"elements-input-filled","patternName":"Input - filled with a value","patternState":"","patternPath":"elements-input-input-filled/elements-input-input-filled.rendered.html","name":"elements-input-input-filled","isDocPattern":false,"order":2,"variantOrder":4},{"patternPartial":"elements-input-valid","patternName":"Input - valid state","patternState":"","patternPath":"elements-input-input-valid/elements-input-input-valid.rendered.html","name":"elements-input-input-valid","isDocPattern":false,"order":2,"variantOrder":5},{"patternPartial":"elements-input-invalid","patternName":"Input - invalid state (type in less than its minimum of 5 characters)","patternState":"","patternPath":"elements-input-input-invalid/elements-input-input-invalid.rendered.html","name":"elements-input-input-invalid","isDocPattern":false,"order":2,"variantOrder":6},{"patternPartial":"elements-input-invalid-attribute","patternName":"Input - Invalid state by HTML attribute","patternState":"complete","patternPath":"elements-input-input-invalid-attribute/elements-input-input-invalid-attribute.rendered.html","name":"elements-input-input-invalid-attribute","isDocPattern":false,"order":2,"variantOrder":7},{"patternPartial":"elements-input-disabled","patternName":"Input - disabled state","patternState":"","patternPath":"elements-input-input-disabled/elements-input-input-disabled.rendered.html","name":"elements-input-input-disabled","isDocPattern":false,"order":2,"variantOrder":8},{"patternPartial":"elements-input-search","patternName":"Input - search type","patternState":"","patternPath":"elements-input-input-search/elements-input-input-search.rendered.html","name":"elements-input-input-search","isDocPattern":false,"order":2,"variantOrder":9},{"patternPartial":"elements-input-search-filled","patternName":"Input - search type - filled","patternState":"","patternPath":"elements-input-input-search-filled/elements-input-input-search-filled.rendered.html","name":"elements-input-input-search-filled","isDocPattern":false,"order":2,"variantOrder":10},{"patternPartial":"elements-input-hidden-label","patternName":"Input - Hidden label","patternState":"complete","patternPath":"elements-input-input-hidden-label/elements-input-input-hidden-label.rendered.html","name":"elements-input-input-hidden-label","isDocPattern":false,"order":2,"variantOrder":11},{"patternPartial":"viewall-elements-input","patternName":"View All","patternPath":"elements-input/index.html","patternGroup":"elements","patternSubgroup":"input","name":"elements-input","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"link","patternSubgroupUC":"Link","patternSubgroup":"link","patternSubgroupDash":"link","patternSubgroupItems":[{"patternPartial":"elements-links","patternName":"Links","patternState":"inreview","patternPath":"elements-link-links/elements-link-links.rendered.html","name":"elements-link-links","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-links-small","patternName":"Links Small","patternState":"inreview","patternPath":"elements-link-links-small/elements-link-links-small.rendered.html","name":"elements-link-links-small","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-link","patternName":"View All","patternPath":"elements-link/index.html","patternGroup":"elements","patternSubgroup":"link","name":"elements-link","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"loading-indicator","patternSubgroupUC":"Loading Indicator","patternSubgroup":"loading-indicator","patternSubgroupDash":"loading-indicator","patternSubgroupItems":[{"patternPartial":"elements-loading-indicator","patternName":"Loading Indicator","patternState":"","patternPath":"elements-loading-indicator-loading-indicator/elements-loading-indicator-loading-indicator.rendered.html","name":"elements-loading-indicator-loading-indicator","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-loading-indicator-size-s","patternName":"Loading Indicator Size S","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-s/elements-loading-indicator-loading-indicator-size-s.rendered.html","name":"elements-loading-indicator-loading-indicator-size-s","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-loading-indicator-size-XS","patternName":"Loading Indicator Size XS","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-XS/elements-loading-indicator-loading-indicator-size-XS.rendered.html","name":"elements-loading-indicator-loading-indicator-size-XS","isDocPattern":false,"order":0,"variantOrder":1},{"patternPartial":"elements-loading-indicator-size-m","patternName":"Loading Indicator Size M","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-m/elements-loading-indicator-loading-indicator-size-m.rendered.html","name":"elements-loading-indicator-loading-indicator-size-m","isDocPattern":false,"order":0,"variantOrder":3},{"patternPartial":"elements-loading-indicator-size-l","patternName":"Loading Indicator Size L","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-l/elements-loading-indicator-loading-indicator-size-l.rendered.html","name":"elements-loading-indicator-loading-indicator-size-l","isDocPattern":false,"order":0,"variantOrder":4},{"patternPartial":"elements-loading-indicator-size-xl","patternName":"Loading Indicator Size XL","patternState":"","patternPath":"elements-loading-indicator-loading-indicator-size-xl/elements-loading-indicator-loading-indicator-size-xl.rendered.html","name":"elements-loading-indicator-loading-indicator-size-xl","isDocPattern":false,"order":0,"variantOrder":5},{"patternPartial":"viewall-elements-loading-indicator","patternName":"View All","patternPath":"elements-loading-indicator/index.html","patternGroup":"elements","patternSubgroup":"loading-indicator","name":"elements-loading-indicator","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"logo","patternSubgroupUC":"Logo","patternSubgroup":"logo","patternSubgroupDash":"logo","patternSubgroupItems":[{"patternPartial":"elements-logo","patternName":"Logo","patternState":"","patternPath":"elements-logo-logo/elements-logo-logo.rendered.html","name":"elements-logo-logo","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-logo-on-backgrounds","patternName":"Logo On Backgrounds","patternState":"","patternPath":"elements-logo-logo-on-backgrounds/elements-logo-logo-on-backgrounds.rendered.html","name":"elements-logo-logo-on-backgrounds","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-logo-sizes","patternName":"Logo Sizes","patternState":"","patternPath":"elements-logo-logo-sizes/elements-logo-logo-sizes.rendered.html","name":"elements-logo-logo-sizes","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-logo-with-following-headline","patternName":"Logo With Following Headline","patternState":"","patternPath":"elements-logo-logo-with-following-headline/elements-logo-logo-with-following-headline.rendered.html","name":"elements-logo-logo-with-following-headline","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-logo","patternName":"View All","patternPath":"elements-logo/index.html","patternGroup":"elements","patternSubgroup":"logo","name":"elements-logo","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"progress","patternSubgroupUC":"Progress","patternSubgroup":"progress","patternSubgroupDash":"progress","patternSubgroupItems":[{"patternPartial":"elements-progress","patternName":"Linear loader","patternState":"inreview","patternPath":"elements-progress-progress/elements-progress-progress.rendered.html","name":"elements-progress-progress","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-progress-linear-spinner","patternName":"Linear spinner","patternState":"inreview","patternPath":"elements-progress-progress-linear-spinner/elements-progress-progress-linear-spinner.rendered.html","name":"elements-progress-progress-linear-spinner","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-progress-linear-spinner-indeterminate","patternName":"Linear spinner indeterminate","patternState":"inreview","patternPath":"elements-progress-progress-linear-spinner-indeterminate/elements-progress-progress-linear-spinner-indeterminate.rendered.html","name":"elements-progress-progress-linear-spinner-indeterminate","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-progress","patternName":"View All","patternPath":"elements-progress/index.html","patternGroup":"elements","patternSubgroup":"progress","name":"elements-progress","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"radio","patternSubgroupUC":"Radio","patternSubgroup":"radio","patternSubgroupDash":"radio","patternSubgroupItems":[{"patternPartial":"elements-radios","patternName":"Radios","patternState":"complete","patternPath":"elements-radio-radios/elements-radio-radios.rendered.html","name":"elements-radio-radios","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-checked","patternName":"Radios Checked","patternState":"complete","patternPath":"elements-radio-radios-checked/elements-radio-radios-checked.rendered.html","name":"elements-radio-radios-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-disabled","patternName":"Radios Disabled","patternState":"complete","patternPath":"elements-radio-radios-disabled/elements-radio-radios-disabled.rendered.html","name":"elements-radio-radios-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-disabled-checked","patternName":"Radios Disabled Checked","patternState":"complete","patternPath":"elements-radio-radios-disabled-checked/elements-radio-radios-disabled-checked.rendered.html","name":"elements-radio-radios-disabled-checked","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-invalid-attribute","patternName":"Radios Invalid Attribute","patternState":"complete","patternPath":"elements-radio-radios-invalid-attribute/elements-radio-radios-invalid-attribute.rendered.html","name":"elements-radio-radios-invalid-attribute","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-label-hidden","patternName":"Radio - Hidden label","patternState":"complete","patternPath":"elements-radio-radios-label-hidden/elements-radio-radios-label-hidden.rendered.html","name":"elements-radio-radios-label-hidden","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-radios-required","patternName":"Radios Required","patternState":"complete","patternPath":"elements-radio-radios-required/elements-radio-radios-required.rendered.html","name":"elements-radio-radios-required","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-radio","patternName":"View All","patternPath":"elements-radio/index.html","patternGroup":"elements","patternSubgroup":"radio","name":"elements-radio","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"select","patternSubgroupUC":"Select","patternSubgroup":"select","patternSubgroupDash":"select","patternSubgroupItems":[{"patternPartial":"elements-select","patternName":"Select","patternState":"","patternPath":"elements-select-select/elements-select-select.rendered.html","name":"elements-select-select","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-variations","patternName":"Select Variations","patternState":"","patternPath":"elements-select-select-variations/elements-select-select-variations.rendered.html","name":"elements-select-select-variations","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-variations-disabled","patternName":"Select Variations Disabled","patternState":"","patternPath":"elements-select-select-variations-disabled/elements-select-select-variations-disabled.rendered.html","name":"elements-select-select-variations-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-variations-optgroups","patternName":"Select Variations Optgroups","patternState":"","patternPath":"elements-select-select-variations-optgroups/elements-select-select-variations-optgroups.rendered.html","name":"elements-select-select-variations-optgroups","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-select-invalid-attribute","patternName":"Select - Invalid state by HTML attribute","patternState":"complete","patternPath":"elements-select-select-invalid-attribute/elements-select-select-invalid-attribute.rendered.html","name":"elements-select-select-invalid-attribute","isDocPattern":false,"order":0,"variantOrder":7},{"patternPartial":"elements-select-hidden-label","patternName":"Select - Hidden label","patternState":"complete","patternPath":"elements-select-select-hidden-label/elements-select-select-hidden-label.rendered.html","name":"elements-select-select-hidden-label","isDocPattern":false,"order":0,"variantOrder":8},{"patternPartial":"viewall-elements-select","patternName":"View All","patternPath":"elements-select/index.html","patternGroup":"elements","patternSubgroup":"select","name":"elements-select","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"tags","patternSubgroupUC":"Tags","patternSubgroup":"tags","patternSubgroupDash":"tags","patternSubgroupItems":[{"patternPartial":"elements-tags","patternName":"Tags","patternState":"","patternPath":"elements-tags-tags/elements-tags-tags.rendered.html","name":"elements-tags-tags","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-tags-small","patternName":"Tags Small","patternState":"","patternPath":"elements-tags-tags-small/elements-tags-tags-small.rendered.html","name":"elements-tags-tags-small","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-tags-with-icon","patternName":"Tags With Icon","patternState":"","patternPath":"elements-tags-tags-with-icon/elements-tags-tags-with-icon.rendered.html","name":"elements-tags-tags-with-icon","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-tags","patternName":"View All","patternPath":"elements-tags/index.html","patternGroup":"elements","patternSubgroup":"tags","name":"elements-tags","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"textarea","patternSubgroupUC":"Textarea","patternSubgroup":"textarea","patternSubgroupDash":"textarea","patternSubgroupItems":[{"patternPartial":"elements-textarea-variations","patternName":"Textarea variations","patternState":"","patternPath":"elements-textarea-textarea-variations/elements-textarea-textarea-variations.rendered.html","name":"elements-textarea-textarea-variations","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"elements-textarea","patternName":"Textarea","patternState":"","patternPath":"elements-textarea-textarea/elements-textarea-textarea.rendered.html","name":"elements-textarea-textarea","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-textarea-disabled","patternName":"Textarea Disabled","patternState":"","patternPath":"elements-textarea-textarea-disabled/elements-textarea-textarea-disabled.rendered.html","name":"elements-textarea-textarea-disabled","isDocPattern":false,"order":2,"variantOrder":0},{"patternPartial":"elements-textarea-description","patternName":"Textarea with description","patternState":"","patternPath":"elements-textarea-textarea-description/elements-textarea-textarea-description.rendered.html","name":"elements-textarea-textarea-description","isDocPattern":false,"order":2,"variantOrder":3},{"patternPartial":"elements-textarea-filled","patternName":"Textarea filled with a value","patternState":"","patternPath":"elements-textarea-textarea-filled/elements-textarea-textarea-filled.rendered.html","name":"elements-textarea-textarea-filled","isDocPattern":false,"order":2,"variantOrder":4},{"patternPartial":"elements-textarea-valid","patternName":"Textarea - valid state","patternState":"","patternPath":"elements-textarea-textarea-valid/elements-textarea-textarea-valid.rendered.html","name":"elements-textarea-textarea-valid","isDocPattern":false,"order":2,"variantOrder":5},{"patternPartial":"elements-textarea-invalid","patternName":"Textarea - invalid state (type in less than its minimum of 5 characters)","patternState":"","patternPath":"elements-textarea-textarea-invalid/elements-textarea-textarea-invalid.rendered.html","name":"elements-textarea-textarea-invalid","isDocPattern":false,"order":2,"variantOrder":6},{"patternPartial":"elements-textarea-invalid-attribute","patternName":"Textarea - Invalid state by HTML attribute","patternState":"complete","patternPath":"elements-textarea-textarea-invalid-attribute/elements-textarea-textarea-invalid-attribute.rendered.html","name":"elements-textarea-textarea-invalid-attribute","isDocPattern":false,"order":2,"variantOrder":7},{"patternPartial":"elements-textarea-hidden-label","patternName":"Textarea - Hidden label","patternState":"complete","patternPath":"elements-textarea-textarea-hidden-label/elements-textarea-textarea-hidden-label.rendered.html","name":"elements-textarea-textarea-hidden-label","isDocPattern":false,"order":2,"variantOrder":8},{"patternPartial":"viewall-elements-textarea","patternName":"View All","patternPath":"elements-textarea/index.html","patternGroup":"elements","patternSubgroup":"textarea","name":"elements-textarea","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"toggle","patternSubgroupUC":"Toggle","patternSubgroup":"toggle","patternSubgroupDash":"toggle","patternSubgroupItems":[{"patternPartial":"elements-toggle","patternName":"Toggle","patternState":"complete","patternPath":"elements-toggle-toggle/elements-toggle-toggle.rendered.html","name":"elements-toggle-toggle","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-toggle-disabled","patternName":"Toggle Disabled","patternState":"complete","patternPath":"elements-toggle-toggle-disabled/elements-toggle-toggle-disabled.rendered.html","name":"elements-toggle-toggle-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-toggle-on","patternName":"Toggle On","patternState":"complete","patternPath":"elements-toggle-toggle-on/elements-toggle-toggle-on.rendered.html","name":"elements-toggle-toggle-on","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"elements-toggle-on-disabled","patternName":"Toggle On Disabled","patternState":"complete","patternPath":"elements-toggle-toggle-on-disabled/elements-toggle-toggle-on-disabled.rendered.html","name":"elements-toggle-toggle-on-disabled","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-elements-toggle","patternName":"View All","patternPath":"elements-toggle/index.html","patternGroup":"elements","patternSubgroup":"toggle","name":"elements-toggle","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":1,"patternItems":[{"patternPartial":"viewall-elements-all","patternName":"View all Elements","patternPath":"elements/index.html","name":"elements","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"components","patternGroupUC":"Components","patternGroup":"components","patternGroupDash":"components","patternGroupItems":[{"patternSubgroupLC":"accordion","patternSubgroupUC":"Accordion","patternSubgroup":"accordion","patternSubgroupDash":"accordion","patternSubgroupItems":[{"patternPartial":"components-accordion","patternName":"Accordion","patternState":"","patternPath":"components-accordion-accordion/components-accordion-accordion.rendered.html","name":"components-accordion-accordion","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-accordion-high-emphasis","patternName":"Accordion High Emphasis","patternState":"","patternPath":"components-accordion-accordion-high-emphasis/components-accordion-accordion-high-emphasis.rendered.html","name":"components-accordion-accordion-high-emphasis","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-accordion-sizes","patternName":"Accordion Sizes","patternState":"","patternPath":"components-accordion-accordion-sizes/components-accordion-accordion-sizes.rendered.html","name":"components-accordion-accordion-sizes","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-accordion","patternName":"View All","patternPath":"components-accordion/index.html","patternGroup":"components","patternSubgroup":"accordion","name":"components-accordion","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"breadcrumb","patternSubgroupUC":"Breadcrumb","patternSubgroup":"breadcrumb","patternSubgroupDash":"breadcrumb","patternSubgroupItems":[{"patternPartial":"components-breadcrumb","patternName":"Breadcrumb","patternState":"inreview","patternPath":"components-breadcrumb-breadcrumb/components-breadcrumb-breadcrumb.rendered.html","name":"components-breadcrumb-breadcrumb","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-breadcrumb","patternName":"View All","patternPath":"components-breadcrumb/index.html","patternGroup":"components","patternSubgroup":"breadcrumb","name":"components-breadcrumb","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"cards","patternSubgroupUC":"Cards","patternSubgroup":"cards","patternSubgroupDash":"cards","patternSubgroupItems":[{"patternPartial":"components-cards-banner","patternName":"Cards Banner","patternState":"inprogress","patternPath":"components-cards-cards-banner/components-cards-cards-banner.rendered.html","name":"components-cards-cards-banner","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-cards","patternName":"View All","patternPath":"components-cards/index.html","patternGroup":"components","patternSubgroup":"cards","name":"components-cards","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"dialog","patternSubgroupUC":"Dialog","patternSubgroup":"dialog","patternSubgroupDash":"dialog","patternSubgroupItems":[{"patternPartial":"components-dialog","patternName":"Dialog","patternState":"inreview","patternPath":"components-dialog-dialog/components-dialog-dialog.rendered.html","name":"components-dialog-dialog","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-dialog-button-alignment-end","patternName":"Dialog Button Alignment End","patternState":"inreview","patternPath":"components-dialog-dialog-button-alignment-end/components-dialog-dialog-button-alignment-end.rendered.html","name":"components-dialog-dialog-button-alignment-end","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-dialog","patternName":"View All","patternPath":"components-dialog/index.html","patternGroup":"components","patternSubgroup":"dialog","name":"components-dialog","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"dropdown","patternSubgroupUC":"Dropdown","patternSubgroup":"dropdown","patternSubgroupDash":"dropdown","patternSubgroupItems":[{"patternPartial":"components-dropdown","patternName":"Dropdown","patternState":"inreview","patternPath":"components-dropdown-dropdown/components-dropdown-dropdown.rendered.html","name":"components-dropdown-dropdown","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-dropdown-opposite-position","patternName":"Dropdown (within the header area) / opposite position","patternState":"inreview","patternPath":"components-dropdown-dropdown-opposite-position/components-dropdown-dropdown-opposite-position.rendered.html","name":"components-dropdown-dropdown-opposite-position","isDocPattern":false,"order":0,"variantOrder":2},{"patternPartial":"viewall-components-dropdown","patternName":"View All","patternPath":"components-dropdown/index.html","patternGroup":"components","patternSubgroup":"dropdown","name":"components-dropdown","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"form","patternSubgroupUC":"Form","patternSubgroup":"form","patternSubgroupDash":"form","patternSubgroupItems":[{"patternPartial":"components-example-form","patternName":"Example Form","patternState":"complete","patternPath":"components-form-example-form/components-form-example-form.rendered.html","name":"components-form-example-form","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-form","patternName":"View All","patternPath":"components-form/index.html","patternGroup":"components","patternSubgroup":"form","name":"components-form","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"language-switcher","patternSubgroupUC":"Language Switcher","patternSubgroup":"language-switcher","patternSubgroupDash":"language-switcher","patternSubgroupItems":[{"patternPartial":"components-language-switcher","patternName":"Language switcher","patternState":"inprogress","patternPath":"components-language-switcher-language-switcher/components-language-switcher-language-switcher.rendered.html","name":"components-language-switcher-language-switcher","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-language-switcher-spa","patternName":"Language switcher with buttons","patternState":"inprogress","patternPath":"components-language-switcher-language-switcher-spa/components-language-switcher-language-switcher-spa.rendered.html","name":"components-language-switcher-language-switcher-spa","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-language-switcher","patternName":"View All","patternPath":"components-language-switcher/index.html","patternGroup":"components","patternSubgroup":"language-switcher","name":"components-language-switcher","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"notifications","patternSubgroupUC":"Notifications","patternSubgroup":"notifications","patternSubgroupDash":"notifications","patternSubgroupItems":[{"patternPartial":"components-notifications","patternName":"Notifications","patternState":"","patternPath":"components-notifications-notifications/components-notifications-notifications.rendered.html","name":"components-notifications-notifications","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-notifications-variants","patternName":"Notifications Variants","patternState":"","patternPath":"components-notifications-notifications-variants/components-notifications-notifications-variants.rendered.html","name":"components-notifications-notifications-variants","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-notifications-hovering","patternName":"Notifications Hovering","patternState":"","patternPath":"components-notifications-notifications-hovering/components-notifications-notifications-hovering.rendered.html","name":"components-notifications-notifications-hovering","isDocPattern":false,"order":0,"variantOrder":1},{"patternPartial":"components-notifications-hovering-leading-icon","patternName":"Notifications - Leading Icon","patternState":"","patternPath":"components-notifications-notifications-hovering-leading-icon/components-notifications-notifications-hovering-leading-icon.rendered.html","name":"components-notifications-notifications-hovering-leading-icon","isDocPattern":false,"order":0,"variantOrder":2},{"patternPartial":"components-notifications-hovering-trailing-icon","patternName":"Notifications - Trailing Icon","patternState":"","patternPath":"components-notifications-notifications-hovering-trailing-icon/components-notifications-notifications-hovering-trailing-icon.rendered.html","name":"components-notifications-notifications-hovering-trailing-icon","isDocPattern":false,"order":0,"variantOrder":3},{"patternPartial":"viewall-components-notifications","patternName":"View All","patternPath":"components-notifications/index.html","patternGroup":"components","patternSubgroup":"notifications","name":"components-notifications","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"overflow-menu","patternSubgroupUC":"Overflow Menu","patternSubgroup":"overflow-menu","patternSubgroupDash":"overflow-menu","patternSubgroupItems":[{"patternPartial":"components-overflow-menu","patternName":"Overflow menu","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu/components-overflow-menu-overflow-menu.rendered.html","name":"components-overflow-menu-overflow-menu","isDocPattern":false,"order":1,"variantOrder":0},{"patternPartial":"components-overflow-menu-navigation","patternName":"Overflow menu - Navigation","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu-navigation/components-overflow-menu-overflow-menu-navigation.rendered.html","name":"components-overflow-menu-overflow-menu-navigation","isDocPattern":false,"order":1,"variantOrder":2},{"patternPartial":"components-overflow-menu-opposite-position","patternName":"Overflow menu / opposite position","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu-opposite-position/components-overflow-menu-overflow-menu-opposite-position.rendered.html","name":"components-overflow-menu-overflow-menu-opposite-position","isDocPattern":false,"order":1,"variantOrder":3},{"patternPartial":"components-overflow-menu-navigation-opposite-position","patternName":"Overflow menu - Navigation / opposite position","patternState":"inreview","patternPath":"components-overflow-menu-overflow-menu-navigation-opposite-position/components-overflow-menu-overflow-menu-navigation-opposite-position.rendered.html","name":"components-overflow-menu-overflow-menu-navigation-opposite-position","isDocPattern":false,"order":1,"variantOrder":4},{"patternPartial":"viewall-components-overflow-menu","patternName":"View All","patternPath":"components-overflow-menu/index.html","patternGroup":"components","patternSubgroup":"overflow-menu","name":"components-overflow-menu","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"pagination","patternSubgroupUC":"Pagination","patternSubgroup":"pagination","patternSubgroupDash":"pagination","patternSubgroupItems":[{"patternPartial":"components-pagination","patternName":"Pagination","patternState":"inreview","patternPath":"components-pagination-pagination/components-pagination-pagination.rendered.html","name":"components-pagination-pagination","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-pagination","patternName":"View All","patternPath":"components-pagination/index.html","patternGroup":"components","patternSubgroup":"pagination","name":"components-pagination","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"sidenavi","patternSubgroupUC":"Sidenavi","patternSubgroup":"sidenavi","patternSubgroupDash":"sidenavi","patternSubgroupItems":[{"patternPartial":"components-sidenavi","patternName":"Sidenavi","patternState":"inreview","patternPath":"components-sidenavi-sidenavi/components-sidenavi-sidenavi.rendered.html","name":"components-sidenavi-sidenavi","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-sidenavi","patternName":"View All","patternPath":"components-sidenavi/index.html","patternGroup":"components","patternSubgroup":"sidenavi","name":"components-sidenavi","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"tab-bar","patternSubgroupUC":"Tab Bar","patternSubgroup":"tab-bar","patternSubgroupDash":"tab-bar","patternSubgroupItems":[{"patternPartial":"components-tab-bar","patternName":"Tab Bar","patternState":"","patternPath":"components-tab-bar-tab-bar/components-tab-bar-tab-bar.rendered.html","name":"components-tab-bar-tab-bar","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-tab-bar","patternName":"View All","patternPath":"components-tab-bar/index.html","patternGroup":"components","patternSubgroup":"tab-bar","name":"components-tab-bar","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"table","patternSubgroupUC":"Table","patternSubgroup":"table","patternSubgroupDash":"table","patternSubgroupItems":[{"patternPartial":"components-table","patternName":"Table","patternState":"inreview","patternPath":"components-table-table/components-table-table.rendered.html","name":"components-table-table","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-alignments","patternName":"Table - alignment","patternState":"inreview","patternPath":"components-table-table-alignments/components-table-table-alignments.rendered.html","name":"components-table-table-alignments","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-border-around","patternName":"Table - border around cells","patternState":"inreview","patternPath":"components-table-table-border-around/components-table-table-border-around.rendered.html","name":"components-table-table-border-around","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-border-horizontal","patternName":"Table - border horizontal","patternState":"inreview","patternPath":"components-table-table-border-horizontal/components-table-table-border-horizontal.rendered.html","name":"components-table-table-border-horizontal","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-density","patternName":"Table - density","patternState":"inreview","patternPath":"components-table-table-density/components-table-table-density.rendered.html","name":"components-table-table-density","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-font-size","patternName":"Table - font size","patternState":"inreview","patternPath":"components-table-table-font-size/components-table-table-font-size.rendered.html","name":"components-table-table-font-size","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-icons","patternName":"Table - icons","patternState":"inreview","patternPath":"components-table-table-icons/components-table-table-icons.rendered.html","name":"components-table-table-icons","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-overflow-menu","patternName":"Table Overflow Menu","patternState":"inreview","patternPath":"components-table-table-overflow-menu/components-table-table-overflow-menu.rendered.html","name":"components-table-table-overflow-menu","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-row-title","patternName":"Table Row Title","patternState":"inreview","patternPath":"components-table-table-row-title/components-table-table-row-title.rendered.html","name":"components-table-table-row-title","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-rows-zebra","patternName":"Table - row zebra styling","patternState":"inreview","patternPath":"components-table-table-rows-zebra/components-table-table-rows-zebra.rendered.html","name":"components-table-table-rows-zebra","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"components-table-sticky-header","patternName":"Table - sticky header","patternState":"inreview","patternPath":"components-table-table-sticky-header/components-table-table-sticky-header.rendered.html","name":"components-table-table-sticky-header","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-components-table","patternName":"View All","patternPath":"components-table/index.html","patternGroup":"components","patternSubgroup":"table","name":"components-table","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":2,"patternItems":[{"patternPartial":"viewall-components-all","patternName":"View all Components","patternPath":"components/index.html","name":"components","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"areas","patternGroupUC":"Areas","patternGroup":"areas","patternGroupDash":"areas","patternGroupItems":[{"patternSubgroupLC":"footer","patternSubgroupUC":"Footer","patternSubgroup":"footer","patternSubgroupDash":"footer","patternSubgroupItems":[{"patternPartial":"areas-footer","patternName":"Footer","patternState":"inprogress","patternPath":"areas-footer-footer/areas-footer-footer.rendered.html","name":"areas-footer-footer","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"areas-footer-with-border","patternName":"Footer With Border","patternState":"inprogress","patternPath":"areas-footer-footer-with-border/areas-footer-footer-with-border.rendered.html","name":"areas-footer-footer-with-border","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-areas-footer","patternName":"View All","patternPath":"areas-footer/index.html","patternGroup":"areas","patternSubgroup":"footer","name":"areas-footer","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"grid","patternSubgroupUC":"Grid","patternSubgroup":"grid","patternSubgroupDash":"grid","patternSubgroupItems":[{"patternPartial":"areas-grid","patternName":"Grid","patternState":"inprogress","patternPath":"areas-grid-grid/areas-grid-grid.rendered.html","name":"areas-grid-grid","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-areas-grid","patternName":"View All","patternPath":"areas-grid/index.html","patternGroup":"areas","patternSubgroup":"grid","name":"areas-grid","isDocPattern":true,"order":9007199254740991}],"order":0},{"patternSubgroupLC":"header","patternSubgroupUC":"Header","patternSubgroup":"header","patternSubgroupDash":"header","patternSubgroupItems":[{"patternPartial":"areas-header","patternName":"Header","patternState":"inprogress","patternPath":"areas-header-header/areas-header-header.rendered.html","name":"areas-header-header","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"areas-header-loggedin","patternName":"Header Loggedin","patternState":"inprogress","patternPath":"areas-header-header-loggedin/areas-header-header-loggedin.rendered.html","name":"areas-header-header-loggedin","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"areas-meta","patternName":"Meta","patternState":"inprogress","patternPath":"areas-header-meta/areas-header-meta.rendered.html","name":"areas-header-meta","isDocPattern":false,"order":0,"variantOrder":0},{"patternPartial":"viewall-areas-header","patternName":"View All","patternPath":"areas-header/index.html","patternGroup":"areas","patternSubgroup":"header","name":"areas-header","isDocPattern":true,"order":9007199254740991}],"order":0}],"order":30,"patternItems":[{"patternPartial":"viewall-areas-all","patternName":"View all Areas","patternPath":"areas/index.html","name":"areas","isDocPattern":true,"order":9007199254740991}]},{"patternGroupLC":"pages","patternGroupUC":"Pages","patternGroup":"pages","patternGroupDash":"pages","patternGroupItems":[],"order":40,"patternItems":[{"patternPartial":"pages-sample-page","patternName":"Sample Page","patternState":"inprogress","patternPath":"pages-sample-page/pages-sample-page.rendered.html","name":"pages-sample-page","isDocPattern":false,"order":0,"variantOrder":0}]}], "ishControlsHide": {"s":false,"m":false,"l":false,"full":false,"random":false,"disco":true,"hay":true,"mqs":false,"find":false,"views-all":false,"views-annotations":false,"views-code":false,"views-new":false,"tools-all":false,"tools-docs":false}}; +var patternPaths = {"areas":{"footer":"areas-footer-footer","footer-with-border":"areas-footer-footer-with-border","grid":"areas-grid-grid","header":"areas-header-header","header-loggedin":"areas-header-header-loggedin","meta":"areas-header-meta"},"base":{"feedback":"base-colors-feedback","poi":"base-colors-poi","primary":"base-colors-primary","secondary":"base-colors-secondary","transportation":"base-colors-transportation","icon-library":"base-icons-icon-library","icon-library-16-filled-action":"base-icons-icon-library-16-filled-action","icon-library-16-filled-navigation":"base-icons-icon-library-16-filled-navigation","icon-library-16-filled-notification":"base-icons-icon-library-16-filled-notification","icon-library-16-outline-action":"base-icons-icon-library-16-outline-action","icon-library-16-outline-navigation":"base-icons-icon-library-16-outline-navigation","icon-library-20-filled-action":"base-icons-icon-library-20-filled-action","icon-library-20-filled-av":"base-icons-icon-library-20-filled-av","icon-library-20-filled-communication":"base-icons-icon-library-20-filled-communication","icon-library-20-filled-feature":"base-icons-icon-library-20-filled-feature","icon-library-20-filled-food":"base-icons-icon-library-20-filled-food","icon-library-20-filled-it":"base-icons-icon-library-20-filled-it","icon-library-20-filled-journey":"base-icons-icon-library-20-filled-journey","icon-library-20-filled-maps":"base-icons-icon-library-20-filled-maps","icon-library-20-filled-navigation":"base-icons-icon-library-20-filled-navigation","icon-library-20-filled-notification":"base-icons-icon-library-20-filled-notification","icon-library-20-filled-ticket":"base-icons-icon-library-20-filled-ticket","icon-library-20-filled-transportation":"base-icons-icon-library-20-filled-transportation","icon-library-20-outline-action":"base-icons-icon-library-20-outline-action","icon-library-20-outline-av":"base-icons-icon-library-20-outline-av","icon-library-20-outline-brand":"base-icons-icon-library-20-outline-brand","icon-library-20-outline-communication":"base-icons-icon-library-20-outline-communication","icon-library-20-outline-covid-19":"base-icons-icon-library-20-outline-covid-19","icon-library-20-outline-facilities":"base-icons-icon-library-20-outline-facilities","icon-library-20-outline-feature":"base-icons-icon-library-20-outline-feature","icon-library-20-outline-food":"base-icons-icon-library-20-outline-food","icon-library-20-outline-it":"base-icons-icon-library-20-outline-it","icon-library-20-outline-journey":"base-icons-icon-library-20-outline-journey","icon-library-20-outline-maps":"base-icons-icon-library-20-outline-maps","icon-library-20-outline-navigation":"base-icons-icon-library-20-outline-navigation","icon-library-20-outline-notification":"base-icons-icon-library-20-outline-notification","icon-library-20-outline-seat":"base-icons-icon-library-20-outline-seat","icon-library-20-outline-ticket":"base-icons-icon-library-20-outline-ticket","icon-library-20-outline-transportation":"base-icons-icon-library-20-outline-transportation","icon-library-24-filled-action":"base-icons-icon-library-24-filled-action","icon-library-24-filled-av":"base-icons-icon-library-24-filled-av","icon-library-24-filled-journey":"base-icons-icon-library-24-filled-journey","icon-library-24-filled-maps":"base-icons-icon-library-24-filled-maps","icon-library-24-filled-navigation":"base-icons-icon-library-24-filled-navigation","icon-library-24-filled-notification":"base-icons-icon-library-24-filled-notification","icon-library-24-filled-transportation":"base-icons-icon-library-24-filled-transportation","icon-library-24-outline-action":"base-icons-icon-library-24-outline-action","icon-library-24-outline-av":"base-icons-icon-library-24-outline-av","icon-library-24-outline-brand":"base-icons-icon-library-24-outline-brand","icon-library-24-outline-communication":"base-icons-icon-library-24-outline-communication","icon-library-24-outline-covid-19":"base-icons-icon-library-24-outline-covid-19","icon-library-24-outline-facilities":"base-icons-icon-library-24-outline-facilities","icon-library-24-outline-feature":"base-icons-icon-library-24-outline-feature","icon-library-24-outline-food":"base-icons-icon-library-24-outline-food","icon-library-24-outline-it":"base-icons-icon-library-24-outline-it","icon-library-24-outline-journey":"base-icons-icon-library-24-outline-journey","icon-library-24-outline-maps":"base-icons-icon-library-24-outline-maps","icon-library-24-outline-navigation":"base-icons-icon-library-24-outline-navigation","icon-library-24-outline-notification":"base-icons-icon-library-24-outline-notification","icon-library-24-outline-seat":"base-icons-icon-library-24-outline-seat","icon-library-24-outline-ticket":"base-icons-icon-library-24-outline-ticket","icon-library-24-outline-transportation":"base-icons-icon-library-24-outline-transportation","icon-library-32-filled-action":"base-icons-icon-library-32-filled-action","icon-library-32-filled-av":"base-icons-icon-library-32-filled-av","icon-library-32-filled-maps":"base-icons-icon-library-32-filled-maps","icon-library-32-filled-navigation":"base-icons-icon-library-32-filled-navigation","icon-library-32-filled-notification":"base-icons-icon-library-32-filled-notification","icon-library-32-filled-transportation":"base-icons-icon-library-32-filled-transportation","icon-library-32-outline-action":"base-icons-icon-library-32-outline-action","icon-library-32-outline-av":"base-icons-icon-library-32-outline-av","icon-library-32-outline-brand":"base-icons-icon-library-32-outline-brand","icon-library-32-outline-communication":"base-icons-icon-library-32-outline-communication","icon-library-32-outline-covid-19":"base-icons-icon-library-32-outline-covid-19","icon-library-32-outline-facilities":"base-icons-icon-library-32-outline-facilities","icon-library-32-outline-feature":"base-icons-icon-library-32-outline-feature","icon-library-32-outline-food":"base-icons-icon-library-32-outline-food","icon-library-32-outline-it":"base-icons-icon-library-32-outline-it","icon-library-32-outline-journey":"base-icons-icon-library-32-outline-journey","icon-library-32-outline-maps":"base-icons-icon-library-32-outline-maps","icon-library-32-outline-navigation":"base-icons-icon-library-32-outline-navigation","icon-library-32-outline-notification":"base-icons-icon-library-32-outline-notification","icon-library-32-outline-seat":"base-icons-icon-library-32-outline-seat","icon-library-32-outline-ticket":"base-icons-icon-library-32-outline-ticket","icon-library-32-outline-transportation":"base-icons-icon-library-32-outline-transportation","icon-library-48-filled-av":"base-icons-icon-library-48-filled-av","icon-library-48-outline-av":"base-icons-icon-library-48-outline-av","icon-library-48-outline-brand":"base-icons-icon-library-48-outline-brand","icon-library-64-filled-av":"base-icons-icon-library-64-filled-av","icon-library-64-outline-av":"base-icons-icon-library-64-outline-av","icon-library-64-outline-brand":"base-icons-icon-library-64-outline-brand","illustration-icons":"base-icons-illustration-icons","fonts":"base-type-fonts","highlight-colors-1st-priority":"base-type-highlight-colors-1st-priority","highlight-colors-2nd-priority":"base-type-highlight-colors-2nd-priority","highlight-colors-neutral":"base-type-highlight-colors-neutral","highlight-colors-positive":"base-type-highlight-colors-positive"},"components":{"accordion":"components-accordion-accordion","accordion-high-emphasis":"components-accordion-accordion-high-emphasis","accordion-sizes":"components-accordion-accordion-sizes","breadcrumb":"components-breadcrumb-breadcrumb","cards-banner":"components-cards-cards-banner","dialog":"components-dialog-dialog","dialog-button-alignment-end":"components-dialog-dialog-button-alignment-end","dropdown":"components-dropdown-dropdown","dropdown-opposite-position":"components-dropdown-dropdown-opposite-position","example-form":"components-form-example-form","language-switcher":"components-language-switcher-language-switcher","language-switcher-spa":"components-language-switcher-language-switcher-spa","notifications":"components-notifications-notifications","notifications-hovering":"components-notifications-notifications-hovering","notifications-hovering-leading-icon":"components-notifications-notifications-hovering-leading-icon","notifications-hovering-trailing-icon":"components-notifications-notifications-hovering-trailing-icon","notifications-variants":"components-notifications-notifications-variants","overflow-menu":"components-overflow-menu-overflow-menu","overflow-menu-navigation":"components-overflow-menu-overflow-menu-navigation","overflow-menu-navigation-opposite-position":"components-overflow-menu-overflow-menu-navigation-opposite-position","overflow-menu-opposite-position":"components-overflow-menu-overflow-menu-opposite-position","pagination":"components-pagination-pagination","sidenavi":"components-sidenavi-sidenavi","tab-bar":"components-tab-bar-tab-bar","table":"components-table-table","table-alignments":"components-table-table-alignments","table-border-around":"components-table-table-border-around","table-border-horizontal":"components-table-table-border-horizontal","table-density":"components-table-table-density","table-font-size":"components-table-table-font-size","table-icons":"components-table-table-icons","table-overflow-menu":"components-table-table-overflow-menu","table-row-title":"components-table-table-row-title","table-rows-zebra":"components-table-table-rows-zebra","table-sticky-header":"components-table-table-sticky-header"},"elements":{"button-brand-primary":"elements-buttons-01-button-brand-primary","button-primary":"elements-buttons-03-button-primary","button-secondary-outline":"elements-buttons-04-button-secondary-outline","button-secondary-solid":"elements-buttons-05-button-secondary-solid","button-tertiary-plain":"elements-buttons-06-button-tertiary-plain","button-sizes":"elements-buttons-09-button-sizes","button":"elements-buttons-button","checkbox":"elements-checkbox-checkbox","checkbox-checked":"elements-checkbox-checkbox-checked","checkbox-disabled":"elements-checkbox-checkbox-disabled","checkbox-disabled-checked":"elements-checkbox-checkbox-disabled-checked","checkbox-indeterminate":"elements-checkbox-checkbox-indeterminate","checkbox-label-hidden":"elements-checkbox-checkbox-label-hidden","checkbox-on-dark-background":"elements-checkbox-checkbox-on-dark-background","checkbox-on-dark-background-checked":"elements-checkbox-checkbox-on-dark-background-checked","checkbox-on-dark-background-disabled":"elements-checkbox-checkbox-on-dark-background-disabled","checkbox-on-dark-background-disabled-checked":"elements-checkbox-checkbox-on-dark-background-disabled-checked","checkbox-on-dark-background-indeterminate":"elements-checkbox-checkbox-on-dark-background-indeterminate","chips":"elements-chips-chips","chips-disabled":"elements-chips-chips-disabled","chips-type-selection":"elements-chips-chips-type-selection","chips-with-icon":"elements-chips-chips-with-icon","headline":"elements-headline-headline","headline-pulse":"elements-headline-headline-pulse","image":"elements-image-image","image-avif":"elements-image-image-avif","image-lazy-loading":"elements-image-image-lazy-loading","image-responsive-density":"elements-image-image-responsive-density","image-responsive-mediaquery":"elements-image-image-responsive-mediaquery","image-webp":"elements-image-image-webp","image-with-caption":"elements-image-image-with-caption","input":"elements-input-input","input-auto-suggest":"elements-input-input-auto-suggest","input-description":"elements-input-input-description","input-disabled":"elements-input-input-disabled","input-filled":"elements-input-input-filled","input-hidden-label":"elements-input-input-hidden-label","input-invalid":"elements-input-input-invalid","input-invalid-attribute":"elements-input-input-invalid-attribute","input-search":"elements-input-input-search","input-search-filled":"elements-input-input-search-filled","input-valid":"elements-input-input-valid","input-variations":"elements-input-input-variations","links":"elements-link-links","links-small":"elements-link-links-small","loading-indicator":"elements-loading-indicator-loading-indicator","loading-indicator-size-l":"elements-loading-indicator-loading-indicator-size-l","loading-indicator-size-m":"elements-loading-indicator-loading-indicator-size-m","loading-indicator-size-s":"elements-loading-indicator-loading-indicator-size-s","loading-indicator-size-xl":"elements-loading-indicator-loading-indicator-size-xl","loading-indicator-size-XS":"elements-loading-indicator-loading-indicator-size-XS","logo":"elements-logo-logo","logo-on-backgrounds":"elements-logo-logo-on-backgrounds","logo-sizes":"elements-logo-logo-sizes","logo-with-following-headline":"elements-logo-logo-with-following-headline","progress":"elements-progress-progress","progress-linear-spinner":"elements-progress-progress-linear-spinner","progress-linear-spinner-indeterminate":"elements-progress-progress-linear-spinner-indeterminate","radios":"elements-radio-radios","radios-checked":"elements-radio-radios-checked","radios-disabled":"elements-radio-radios-disabled","radios-disabled-checked":"elements-radio-radios-disabled-checked","radios-invalid-attribute":"elements-radio-radios-invalid-attribute","radios-label-hidden":"elements-radio-radios-label-hidden","radios-required":"elements-radio-radios-required","select":"elements-select-select","select-hidden-label":"elements-select-select-hidden-label","select-invalid-attribute":"elements-select-select-invalid-attribute","select-variations":"elements-select-select-variations","select-variations-disabled":"elements-select-select-variations-disabled","select-variations-optgroups":"elements-select-select-variations-optgroups","tags":"elements-tags-tags","tags-small":"elements-tags-tags-small","tags-with-icon":"elements-tags-tags-with-icon","textarea":"elements-textarea-textarea","textarea-description":"elements-textarea-textarea-description","textarea-disabled":"elements-textarea-textarea-disabled","textarea-filled":"elements-textarea-textarea-filled","textarea-hidden-label":"elements-textarea-textarea-hidden-label","textarea-invalid":"elements-textarea-textarea-invalid","textarea-invalid-attribute":"elements-textarea-textarea-invalid-attribute","textarea-valid":"elements-textarea-textarea-valid","textarea-variations":"elements-textarea-textarea-variations","toggle":"elements-toggle-toggle","toggle-disabled":"elements-toggle-toggle-disabled","toggle-on":"elements-toggle-toggle-on","toggle-on-disabled":"elements-toggle-toggle-on-disabled"},"pages":{"sample-page":"pages-sample-page","intro":"pages-intro"}}; +var viewAllPaths = {"areas":{"footer":"areas-footer","all":"areas","grid":"areas-grid","header":"areas-header"},"base":{"colors":"base-colors","all":"base","icons":"base-icons","type":"base-type"},"components":{"accordion":"components-accordion","all":"components","breadcrumb":"components-breadcrumb","cards":"components-cards","dialog":"components-dialog","dropdown":"components-dropdown","form":"components-form","language-switcher":"components-language-switcher","notifications":"components-notifications","overflow-menu":"components-overflow-menu","pagination":"components-pagination","sidenavi":"components-sidenavi","tab-bar":"components-tab-bar","table":"components-table"},"elements":{"buttons":"elements-buttons","all":"elements","checkbox":"elements-checkbox","chips":"elements-chips","headline":"elements-headline","image":"elements-image","input":"elements-input","link":"elements-link","loading-indicator":"elements-loading-indicator","logo":"elements-logo","progress":"elements-progress","radio":"elements-radio","select":"elements-select","tags":"elements-tags","textarea":"elements-textarea","toggle":"elements-toggle"},"pages":{"all":"pages"}}; +var plugins = [{"name":"@mfranzke/plugin-node-uiextension","templates":[],"stylesheets":["../../../css/pattern-scaffolding-project-specific.css"],"javascripts":["patternlab-components/pattern-lab/@mfranzke-plugin-node-uiextension/js/@mfranzke-plugin-node-uiextension.js"],"onready":"PluginUIExtension.init()","callback":"","navLinks":{"before":[],"after":[]},"toolLinks":{"before":[],"after":[{"text":"Imprint","url":"https://www.dbsystel.de/dbsystel-en/legal-3715942","class":"","icon":"help"},{"text":"Datenschutzerklärung","url":"https://db-ui.github.io/datenschutzerklaerung.html","class":"","icon":"help"}]}}]; +var defaultShowPatternInfo = false; +var defaultPattern = "pages-intro"; diff --git a/version/v2.18.3/styleguide/html/styleguide.html b/version/v2.18.3/styleguide/html/styleguide.html new file mode 100644 index 0000000000..d1d5d3abe9 --- /dev/null +++ b/version/v2.18.3/styleguide/html/styleguide.html @@ -0,0 +1,29624 @@ + + + + + + DB UI Core - Pattern Lab + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    + +
    + +

    + Base +

    + +
    + +
    + +
    +
    + +

    + Colors +

    + +
    +

    Source

    +

    We're using the colors provided by our other product DB UI Base, by which Design tokens are being provided.

    +

    Accessibility

    +

    Please have a look at the related page within the Marketingportal for more information as well: https://marketingportal.extranet.deutschebahn.com/marketingportal/Basiselemente/Farbe

    +

    Criteria

    +

    WCAG 2.1 (Level AA)

    +

    The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

    +

    Large Text

    +

    Large-scale text and images of large-scale text have a contrast ratio of at least 3:1

    +

    DB color palette for InDesign, Illustrator and Photoshop

    +

    A file containing the Deutsche Bahn color palette for Adobe InDesign, Adobe Illustrator or Adobe Photoshop is provided by the DB Marketingportal.

    +

    Inspirational external sources for this pattern

    + + +
    + +
    +
    + +
    + +

    + + + Marketingportal Brand Colors - Primary + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + DB Red + + + + $db-color-red
      + #ec0016 +       +
      • +
    • + DB White + + + + $db-color-white
      + #FFFFFF +       +
      • +
    • + DB Black + + + + $db-color-black
      + #000000 +       +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Marketingportal Brand Colors - Secondary + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + DB Yellow 100 + + + + $db-color-yellow-100
      + #FFFFDC +       +
      • +
    • + DB Yellow 200 + + + + $db-color-yellow-200
      + #FFFFAF +       +
      • +
    • + DB Yellow 300 + + + + $db-color-yellow-300
      + #FFF876 +       +
      • +
    • + DB Yellow 400 + + + + $db-color-yellow-400
      + #FFF000 +       +
      • +
    • + DB Yellow 500 + + + + $db-color-yellow-500
      + #FFD800 +       +
      • +
    • + DB Yellow 600 + + + + $db-color-yellow-600
      + #FFBB00 +       +
      • +
    • + DB Yellow 700 + + + + $db-color-yellow-700
      + #FF9B00 +       +
      • +
    • + DB Yellow 800 + + + + $db-color-yellow-800
      + #FF7A00 +       +
      • +
    • + DB Orange 100 + + + + $db-color-orange-100
      + #FFF4D8 +       +
      • +
    • + DB Orange 200 + + + + $db-color-orange-200
      + #FCE3B4 +       +
      • +
    • + DB Orange 300 + + + + $db-color-orange-300
      + #FACA7F +       +
      • +
    • + DB Orange 400 + + + + $db-color-orange-400
      + #F8AB37 +       +
      • +
    • + DB Orange 500 + + + + $db-color-orange-500
      + #F39200 +       +
      • +
    • + DB Orange 600 + + + + $db-color-orange-600
      + #D77B00 +       +
      • +
    • + DB Orange 700 + + + + $db-color-orange-700
      + #C05E00 +       +
      • +
    • + DB Orange 800 + + + + $db-color-orange-800
      + #A24800 +       +
      • +
    • + DB Red 100 + + + + $db-color-red-100
      + #fEE6E6 +       +
      • +
    • + DB Red 200 + + + + $db-color-red-200
      + #FCC8C3 +       +
      • +
    • + DB Red 300 + + + + $db-color-red-300
      + #FA9090 +       +
      • +
    • + DB Red 400 + + + + $db-color-red-400
      + #F75056 +       +
      • +
    • + DB Red 500 + + + + $db-color-red-500
      + #EC0016 +       +
      • +
    • + DB Red 600 + + + + $db-color-red-600
      + #C50014 +       +
      • +
    • + DB Red 700 + + + + $db-color-red-700
      + #9B000E +       +
      • +
    • + DB Red 800 + + + + $db-color-red-800
      + #740009 +       +
      • +
    • + DB Burgundy 100 + + + + $db-color-burgundy-100
      + #F4E8ED +       +
      • +
    • + DB Burgundy 200 + + + + $db-color-burgundy-200
      + #EDCBD6 +       +
      • +
    • + DB Burgundy 300 + + + + $db-color-burgundy-300
      + #DA9AA8 +       +
      • +
    • + DB Burgundy 400 + + + + $db-color-burgundy-400
      + #C0687B +       +
      • +
    • + DB Burgundy 500 + + + + $db-color-burgundy-500
      + #A9455D +       +
      • +
    • + DB Burgundy 600 + + + + $db-color-burgundy-600
      + #8C2E46 +       +
      • +
    • + DB Burgundy 700 + + + + $db-color-burgundy-700
      + #641E32 +       +
      • +
    • + DB Burgundy 800 + + + + $db-color-burgundy-800
      + #4D0820 +       +
      • +
    • + DB Pink 100 + + + + $db-color-pink-100
      + #FDEEF8 +       +
      • +
    • + DB Pink 200 + + + + $db-color-pink-200
      + #F9D2E5 +       +
      • +
    • + DB Pink 300 + + + + $db-color-pink-300
      + #F4AECE +       +
      • +
    • + DB Pink 400 + + + + $db-color-pink-400
      + #EE7BAE +       +
      • +
    • + DB Pink 500 + + + + $db-color-pink-500
      + #E93E8F +       +
      • +
    • + DB Pink 600 + + + + $db-color-pink-600
      + #DB0078 +       +
      • +
    • + DB Pink 700 + + + + $db-color-pink-700
      + #B80065 +       +
      • +
    • + DB Pink 800 + + + + $db-color-pink-800
      + #970052 +       +
      • +
    • + DB Violett 100 + + + + $db-color-violett-100
      + #F4EEFA +       +
      • +
    • + DB Violett 200 + + + + $db-color-violett-200
      + #E0CDE4 +       +
      • +
    • + DB Violett 300 + + + + $db-color-violett-300
      + #C2A1C7 +       +
      • +
    • + DB Violett 400 + + + + $db-color-violett-400
      + #9A6CA6 +       +
      • +
    • + DB Violett 500 + + + + $db-color-violett-500
      + #814997 +       +
      • +
    • + DB Violett 600 + + + + $db-color-violett-600
      + #6E368C +       +
      • +
    • + DB Violett 700 + + + + $db-color-violett-700
      + #581D70 +       +
      • +
    • + DB Violett 800 + + + + $db-color-violett-800
      + #421857 +       +
      • +
    • + DB Blue 100 + + + + $db-color-blue-100
      + #E0EFFB +       +
      • +
    • + DB Blue 200 + + + + $db-color-blue-200
      + #B4D5F6 +       +
      • +
    • + DB Blue 300 + + + + $db-color-blue-300
      + #73AEF4 +       +
      • +
    • + DB Blue 400 + + + + $db-color-blue-400
      + #347DE0 +       +
      • +
    • + DB Blue 500 + + + + $db-color-blue-500
      + #1455C0 +       +
      • +
    • + DB Blue 600 + + + + $db-color-blue-600
      + #0C3992 +       +
      • +
    • + DB Blue 700 + + + + $db-color-blue-700
      + #0A1E6E +       +
      • +
    • + DB Blue 800 + + + + $db-color-blue-800
      + #061350 +       +
      • +
    • + DB Cyan 100 + + + + $db-color-cyan-100
      + #E5FAFF +       +
      • +
    • + DB Cyan 200 + + + + $db-color-cyan-200
      + #BBE6F8 +       +
      • +
    • + DB Cyan 300 + + + + $db-color-cyan-300
      + #84CFEF +       +
      • +
    • + DB Cyan 400 + + + + $db-color-cyan-400
      + #55B9E6 +       +
      • +
    • + DB Cyan 500 + + + + $db-color-cyan-500
      + #309FD1 +       +
      • +
    • + DB Cyan 600 + + + + $db-color-cyan-600
      + #0087B9 +       +
      • +
    • + DB Cyan 700 + + + + $db-color-cyan-700
      + #006A96 +       +
      • +
    • + DB Cyan 800 + + + + $db-color-cyan-800
      + #004B6D +       +
      • +
    • + DB Turquoise 100 + + + + $db-color-turquoise-100
      + #E3F5F4 +       +
      • +
    • + DB Turquoise 200 + + + + $db-color-turquoise-200
      + #BEE2E5 +       +
      • +
    • + DB Turquoise 300 + + + + $db-color-turquoise-300
      + #83CACA +       +
      • +
    • + DB Turquoise 400 + + + + $db-color-turquoise-400
      + #3CB5AE +       +
      • +
    • + DB Turquoise 500 + + + + $db-color-turquoise-500
      + #00A099 +       +
      • +
    • + DB Turquoise 600 + + + + $db-color-turquoise-600
      + #008984 +       +
      • +
    • + DB Turquoise 700 + + + + $db-color-turquoise-700
      + #006E6B +       +
      • +
    • + DB Turquoise 800 + + + + $db-color-turquoise-800
      + #005752 +       +
      • +
    • + DB Green 100 + + + + $db-color-green-100
      + #E2f3E5 +       +
      • +
    • + DB Green 200 + + + + $db-color-green-200
      + #BDDBB9 +       +
      • +
    • + DB Green 300 + + + + $db-color-green-300
      + #8CBC80 +       +
      • +
    • + DB Green 400 + + + + $db-color-green-400
      + #66A558 +       +
      • +
    • + DB Green 500 + + + + $db-color-green-500
      + #408335 +       +
      • +
    • + DB Green 600 + + + + $db-color-green-600
      + #2A7230 +       +
      • +
    • + DB Green 700 + + + + $db-color-green-700
      + #165C27 +       +
      • +
    • + DB Green 800 + + + + $db-color-green-800
      + #154A26 +       +
      • +
    • + DB Light Green 100 + + + + $db-color-light-green-100
      + #EBF7DD +       +
      • +
    • + DB Light Green 200 + + + + $db-color-light-green-200
      + #C9EB9E +       +
      • +
    • + DB Light Green 300 + + + + $db-color-light-green-300
      + #9FD45F +       +
      • +
    • + DB Light Green 400 + + + + $db-color-light-green-400
      + #78BE14 +       +
      • +
    • + DB Light Green 500 + + + + $db-color-light-green-500
      + #63A615 +       +
      • +
    • + DB Light Green 600 + + + + $db-color-light-green-600
      + #508B1B +       +
      • +
    • + DB Light Green 700 + + + + $db-color-light-green-700
      + #44741A +       +
      • +
    • + DB Light Green 800 + + + + $db-color-light-green-800
      + #375F15 +       +
      • +
    • + DB Warm Gray 100 + + + + $db-color-warm-gray-100
      + #F5F4F1 +       +
      • +
    • + DB Warm Gray 200 + + + + $db-color-warm-gray-200
      + #DDDED6 +       +
      • +
    • + DB Warm Gray 300 + + + + $db-color-warm-gray-300
      + #BCBBB2 +       +
      • +
    • + DB Warm Gray 400 + + + + $db-color-warm-gray-400
      + #9C9A8E +       +
      • +
    • + DB Warm Gray 500 + + + + $db-color-warm-gray-500
      + #858379 +       +
      • +
    • + DB Warm Gray 600 + + + + $db-color-warm-gray-600
      + #747067 +       +
      • +
    • + DB Warm Gray 700 + + + + $db-color-warm-gray-700
      + #4F4B41 +       +
      • +
    • + DB Warm Gray 800 + + + + $db-color-warm-gray-800
      + #38342F +       +
      • +
    • + DB Cool Gray 100 + + + + $db-color-cool-gray-100
      + #F0F3F5 +       +
      • +
    • + DB Cool Gray 200 + + + + $db-color-cool-gray-200
      + #D7DCE1 +       +
      • +
    • + DB Cool Gray 300 + + + + $db-color-cool-gray-300
      + #AFB4BB +       +
      • +
    • + DB Cool Gray 400 + + + + $db-color-cool-gray-400
      + #878C96 +       +
      • +
    • + DB Cool Gray 500 + + + + $db-color-cool-gray-500
      + #646973 +       +
      • +
    • + DB Cool Gray 600 + + + + $db-color-cool-gray-600
      + #3C414B +       +
      • +
    • + DB Cool Gray 700 + + + + $db-color-cool-gray-700
      + #282D37 +       +
      • +
    • + DB Cool Gray 800 + + + + $db-color-cool-gray-800
      + #131821 +       +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Marketingportal Brand Colors - Feedback + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + DB Success + + + + $db-color-success: $db-color-light-green-600
      + #508B1B +       +
      • +
    • + DB Error + + + + $db-color-error: $db-color-red-500
      + #EC0016 +       +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Marketingportal Brand Colors - POI + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + food & drink + + + + $db-color-food-drink: $db-color-orange-500
      + #f39200 +       +
      • +
    • + health + + + + $db-color-health: $db-color-burgundy-500
      + #a9455d +       +
      • +
    • + things to know + + + + $db-color-things-to-know: $db-color-warm-gray-500
      + #858379 +       +
      • +
    • + community facilities + + + + $db-color-community-facilities: $db-color-turquoise-500
      + #00a099 +       +
      • +
    • + DB services & facilities + + + + $db-color-db-services-facilities: $db-color-blue-600
      + #0c3992 +       +
      • +
    • + shopping + + + + $db-color-shopping: $db-color-violett-500
      + #814997 +       +
      • +
    • + arts & culture + + + + $db-color-arts-culture: $db-color-pink-500
      + #e93e8f +       +
      • +
    • + leisure + + + + $db-color-leisure: $db-color-green-500
      + #408335 +       +
      • +
    • + services + + + + $db-color-services: $db-color-cyan-500
      + #309fd1 +       +
      • +
    • + guidance + + + + $db-color-guidance: $db-color-cool-gray-600
      + #3c414b +       +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Marketingportal Brand Colors - Transport + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + ICE + + + + $db-color-ice: $db-color-cool-gray-700
      + #282d37 +       +
      • +
    • + IC + + + + $db-color-ic: $db-color-cool-gray-500
      + #646973 +       +
      • +
    • + EC + + + + $db-color-ec: $db-color-cool-gray-500
      + #646973 +       +
      • +
    • + RE + + + + $db-color-re: $db-color-cool-gray-400
      + #878c96 +       +
      • +
    • + RB + + + + $db-color-rb: $db-color-cool-gray-300
      + #afb4bb +       +
      • +
    • + S-Bahn + + + + $db-color-s-bahn: $db-color-green-500
      + #408335 +       +
      • +
    • + U-Bahn + + + + $db-color-u-bahn: $db-color-blue-500
      + #1455c0 +       +
      • +
    • + Tram + + + + $db-color-tram: $db-color-burgundy-500
      + #a9455d +       +
      • +
    • + Intercity Bus + + + + $db-color-intercity-bus: $db-color-pink-500
      + #e93e8f +       +
      • +
    • + Bus + + + + $db-color-bus: $db-color-violett-500
      + #814997 +       +
      • +
    • + ship + + + + $db-color-ship: $db-color-cyan-500
      + #309fd1 +       +
      • +
    • + plane + + + + $db-color-plane: $db-color-turquoise-500
      + #00a099 +       +
      • +
    • + taxi + + + + $db-color-taxi: $db-color-yellow-500
      + #ffd800 +       +
      • +
    • + carsharing + + + + $db-color-carsharing: $db-color-orange-500
      + #f39200 +       +
      • +
    • + bikesharing + + + + $db-color-bikesharing: $db-color-light-green-500
      + #63a615 +       +
      • +
    • + walking + + + + $db-color-walking: $db-color-cool-gray-200
      + #d7dce1 +       +
      • +
    + +
    + + + +
    +
    + +

    + Icons +

    + +
    +

    New iconset

    +

    The included iconset has been developed in cooperation with the Center of Excellence @ Personenverkehr and replaces the previous enterprise only icons. More information: https://marketingportal.extranet.deutschebahn.com/marketingportal/Basiselemente/Icons/Funktionale-Icons-Architektur-und-Fahrzeuge

    +

    Usage

    +

    You could use the icons either within your SCSS code as described below, which is the recommended approach. +Alternatively you could also use the attribute based configuration.

    +

    And we're additionally providing the icons as the sources (SVG) files as well.

    +

    Icon font

    +

    Different glyphs

    +

    All of the available glyphs variables are shown on this page right next to the icon, with the SCSS and attribute based variables/values shown next to them.

    +

    SCSS (recommended)

    +
    Icon for element
    +

    Use the following SCSS mixin for setting an icon:

    +
    // schema
+@mixin icon(
+  $glyph: "",
+  $size: $icon-size,
+  $style: $icon-style,
+  $position: "before"
+);
+
+// example
+span.with-an-icon {
+  @include icon(glyph(account), 20, "outline");
+}
+
    +

    As both $icon-size and $icon-style are available to get configured with default values, and $position is only a variant (explained in the next paragraph) only the first one is really mandatory.

    +
    Displaying the icon after text
    +

    If you'd like to include the icon after the text, set the last parameter to after.

    +
    Hiding the text next to an icon
    +

    In case of the need to display only the icon and hide the text next to it, use the following mixin:

    +
    @include is-icon-text-replace();
+
    +

    Attribute based configuration

    +
    Icon for element
    +

    Use the data-icon and data-icon-variant HTML attributes for setting an icon:

    +
    <a href="#" data-icon="alarm" data-icon-variant="24-outline">Alarm</a>
+
    +

    The data-icon-variant is an optional attribute, that you don't need to declare in case that you'd like to use the default icon size and style, that are defined by the $icon-size and $icon-style SCSS variables (size: 24 and style: outline as defaults), that could obviously get overwritten by individual SCSS declarations; so you'll end up with a very simply definition when relying on the defaults:

    +
    <a href="#" data-icon="alarm">Alarm</a>
+
    +

    Of course this icons definition does as well have an equivalent for icons after the content: data-icon-variant-after

    +
    Displaying the icon after text
    +

    If you'd like to include the icon after the content/text, use the HTML attribute data-icon-after instead of data-icon, example:

    +
    <a
+  href="#"
+  data-icon-after="alarm"
+  data-icon-variant-after="24-outline"
+  class="elm-link"
+  >Alarm</a
+>
+
    +
    Hiding the text next to an icon
    +

    In case of the need to display only the icon and hide the text next to it, use the following class:

    +
    .is-icon-text-replace
+
    +
    Tweaking icons font-size
    +

    If you'd like to control the icons font-size any further (defining sizes in between all of the data-icon-variant declarations, like e.g. having an icon font-size of 23px instead of 24px when defining data-icon-variant="24-outline"), you could set set one of the CSS variables --icon-font-size-before or --icon-font-size-after (in this case --icon-font-size-before: 23px).

    +
    <a
+  href="#"
+  data-icon="alarm"
+  data-icon-variant="24-outline"
+  style="--icon-font-size-before: 23px"
+  >Alarm</a
+>
+
    +

    Further tweaking

    +

    SVG files

    +

    As mentioned above we're even also providing all of the icon sources (svg files) within this package in the folder node_modules/@db-ui/core/dist/icons/.

    +

    And we're enabling to change the colors for the illustrative icons ("pulse" and icon itself) as well as the functional icons (only the single-color icon), through the two following CSS variables / CSS custom properties, with their included default (second value):

    +
    var(--db-icon-color, currentColor)
+var(--db-icon-pulse-color, #EC0016)
+
    +

    Accessibility

    +

    Regarding accessibility icons are providing cognitive complementary visual support for sighted people (e.g. people with reading difficulties), as well as quick recognition of specific functionality and UX patterns like e.g. the bin/waste paper basket symbol for a delete action.

    +

    On the other hand icons shouldn't get recognized and output by assistive technologies like screenreaders, as those glyphs or signs being used in case of an icon webfont don't necessarly provide a meaning - and on the other hand each icon being used on the page should always as well get included in conjunction with some textual description both as a fallback as well as providing some meaning even and especially if the icon itself doesn't provide a unique meaning on it's own (to all users idependently from their skill level/experience, culture, etc.).

    +

    Additionally this pattern has been tested and approved regarding accessibility.

    +

    Inspirational external sources for this pattern

    + + +
    + +
    +
    + +
    + +

    + + + Icon Library + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 16x16 - Filled - Action + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(check-circle), 16, "filled")
        • +
      • HTML: data-icon="check-circle" data-icon-variant="16-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help), 16, "filled")
        • +
      • HTML: data-icon="help" data-icon-variant="16-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info), 16, "filled")
        • +
      • HTML: data-icon="info" data-icon-variant="16-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 16x16 - Filled - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(cancel), 16, "filled")
        • +
      • HTML: data-icon="cancel" data-icon-variant="16-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 16x16 - Filled - Notification + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(error), 16, "filled")
        • +
      • HTML: data-icon="error" data-icon-variant="16-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning), 16, "filled")
        • +
      • HTML: data-icon="warning" data-icon-variant="16-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 16x16 - Outline - Action + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(add), 16, "outline")
        • +
      • HTML: data-icon="add" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(done), 16, "outline")
        • +
      • HTML: data-icon="done" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(minus), 16, "outline")
        • +
      • HTML: data-icon="minus" data-icon-variant="16-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 16x16 - Outline - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(arrow-back), 16, "outline")
        • +
      • HTML: data-icon="arrow-back" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-down), 16, "outline")
        • +
      • HTML: data-icon="arrow-down" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-forward), 16, "outline")
        • +
      • HTML: data-icon="arrow-forward" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-up), 16, "outline")
        • +
      • HTML: data-icon="arrow-up" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-left), 16, "outline")
        • +
      • HTML: data-icon="chevron-left" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-right), 16, "outline")
        • +
      • HTML: data-icon="chevron-right" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(close), 16, "outline")
        • +
      • HTML: data-icon="close" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-less), 16, "outline")
        • +
      • HTML: data-icon="expand-less" data-icon-variant="16-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-more), 16, "outline")
        • +
      • HTML: data-icon="expand-more" data-icon-variant="16-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Action + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(account), 20, "filled")
        • +
      • HTML: data-icon="account" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-circle), 20, "filled")
        • +
      • HTML: data-icon="add-circle" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert), 20, "filled")
        • +
      • HTML: data-icon="alert" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(block), 20, "filled")
        • +
      • HTML: data-icon="block" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bookmark), 20, "filled")
        • +
      • HTML: data-icon="bookmark" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(build), 20, "filled")
        • +
      • HTML: data-icon="build" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(camera), 20, "filled")
        • +
      • HTML: data-icon="camera" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(check-circle), 20, "filled")
        • +
      • HTML: data-icon="check-circle" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud), 20, "filled")
        • +
      • HTML: data-icon="cloud" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(copy), 20, "filled")
        • +
      • HTML: data-icon="copy" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(credit-card), 20, "filled")
        • +
      • HTML: data-icon="credit-card" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dashboard), 20, "filled")
        • +
      • HTML: data-icon="dashboard" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(discount), 20, "filled")
        • +
      • HTML: data-icon="discount" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(edit), 20, "filled")
        • +
      • HTML: data-icon="edit" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder), 20, "filled")
        • +
      • HTML: data-icon="folder" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder-open), 20, "filled")
        • +
      • HTML: data-icon="folder-open" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(generic-card), 20, "filled")
        • +
      • HTML: data-icon="generic-card" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(heart), 20, "filled")
        • +
      • HTML: data-icon="heart" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help), 20, "filled")
        • +
      • HTML: data-icon="help" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(image), 20, "filled")
        • +
      • HTML: data-icon="image" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info), 20, "filled")
        • +
      • HTML: data-icon="info" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-close), 20, "filled")
        • +
      • HTML: data-icon="lock-close" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-open), 20, "filled")
        • +
      • HTML: data-icon="lock-open" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pin), 20, "filled")
        • +
      • HTML: data-icon="pin" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(print), 20, "filled")
        • +
      • HTML: data-icon="print" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(remove), 20, "filled")
        • +
      • HTML: data-icon="remove" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize), 20, "filled")
        • +
      • HTML: data-icon="resize" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(save), 20, "filled")
        • +
      • HTML: data-icon="save" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(schedule), 20, "filled")
        • +
      • HTML: data-icon="schedule" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sepa), 20, "filled")
        • +
      • HTML: data-icon="sepa" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-bag), 20, "filled")
        • +
      • HTML: data-icon="shopping-bag" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket), 20, "filled")
        • +
      • HTML: data-icon="shopping-basket" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "filled")
        • +
      • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(star), 20, "filled")
        • +
      • HTML: data-icon="star" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(voucher), 20, "filled")
        • +
      • HTML: data-icon="voucher" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 20, "filled")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 20, "filled")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(microphone), 20, "filled")
        • +
      • HTML: data-icon="microphone" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 20, "filled")
        • +
      • HTML: data-icon="play" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 20, "filled")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 20, "filled")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 20, "filled")
        • +
      • HTML: data-icon="stop" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subtitles), 20, "filled")
        • +
      • HTML: data-icon="subtitles" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Communication + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(call), 20, "filled")
        • +
      • HTML: data-icon="call" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chat), 20, "filled")
        • +
      • HTML: data-icon="chat" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(conversation), 20, "filled")
        • +
      • HTML: data-icon="conversation" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(feedback), 20, "filled")
        • +
      • HTML: data-icon="feedback" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(question), 20, "filled")
        • +
      • HTML: data-icon="question" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(receive-item), 20, "filled")
        • +
      • HTML: data-icon="receive-item" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share-item), 20, "filled")
        • +
      • HTML: data-icon="share-item" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Feature + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(day), 20, "filled")
        • +
      • HTML: data-icon="day" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hydrogen), 20, "filled")
        • +
      • HTML: data-icon="hydrogen" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(marketplace), 20, "filled")
        • +
      • HTML: data-icon="marketplace" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(medical), 20, "filled")
        • +
      • HTML: data-icon="medical" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(night), 20, "filled")
        • +
      • HTML: data-icon="night" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(platform), 20, "filled")
        • +
      • HTML: data-icon="platform" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(reservation), 20, "filled")
        • +
      • HTML: data-icon="reservation" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Food + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(coffee-cup), 20, "filled")
        • +
      • HTML: data-icon="coffee-cup" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - IT + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(database), 20, "filled")
        • +
      • HTML: data-icon="database" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Journey + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator), 20, "filled")
        • +
      • HTML: data-icon="capacity-indicator" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "filled")
        • +
      • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-high), 20, "filled")
        • +
      • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-low), 20, "filled")
        • +
      • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(destination), 20, "filled")
        • +
      • HTML: data-icon="destination" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Maps + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(gps), 20, "filled")
        • +
      • HTML: data-icon="gps" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(gps-north), 20, "filled")
        • +
      • HTML: data-icon="gps-north" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(home), 20, "filled")
        • +
      • HTML: data-icon="home" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parking), 20, "filled")
        • +
      • HTML: data-icon="parking" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(place), 20, "filled")
        • +
      • HTML: data-icon="place" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop-sign), 20, "filled")
        • +
      • HTML: data-icon="stop-sign" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(cancel), 20, "filled")
        • +
      • HTML: data-icon="cancel" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(grid-view), 20, "filled")
        • +
      • HTML: data-icon="grid-view" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Notification + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(error), 20, "filled")
        • +
      • HTML: data-icon="error" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning), 20, "filled")
        • +
      • HTML: data-icon="warning" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Ticket + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus-card), 20, "filled")
        • +
      • HTML: data-icon="bahnbonus-card" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahncard), 20, "filled")
        • +
      • HTML: data-icon="bahncard" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-cards), 20, "filled")
        • +
      • HTML: data-icon="multiple-cards" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Filled - Transportation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(airplane), 20, "filled")
        • +
      • HTML: data-icon="airplane" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle), 20, "filled")
        • +
      • HTML: data-icon="bicycle" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle-trailer), 20, "filled")
        • +
      • HTML: data-icon="bicycle-trailer" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(call-a-bike), 20, "filled")
        • +
      • HTML: data-icon="call-a-bike" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car), 20, "filled")
        • +
      • HTML: data-icon="car" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(carsharing), 20, "filled")
        • +
      • HTML: data-icon="carsharing" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-locomotive), 20, "filled")
        • +
      • HTML: data-icon="electric-locomotive" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-scooter), 20, "filled")
        • +
      • HTML: data-icon="electric-scooter" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-car), 20, "filled")
        • +
      • HTML: data-icon="ev-car" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ferry), 20, "filled")
        • +
      • HTML: data-icon="ferry" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handcart), 20, "filled")
        • +
      • HTML: data-icon="handcart" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice), 20, "filled")
        • +
      • HTML: data-icon="ice" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intercity-train), 20, "filled")
        • +
      • HTML: data-icon="intercity-train" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-bus), 20, "filled")
        • +
      • HTML: data-icon="local-bus" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(long-distance-bus), 20, "filled")
        • +
      • HTML: data-icon="long-distance-bus" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-train), 20, "filled")
        • +
      • HTML: data-icon="local-train" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(s-bahn), 20, "filled")
        • +
      • HTML: data-icon="s-bahn" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(scooter), 20, "filled")
        • +
      • HTML: data-icon="scooter" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(speedboat), 20, "filled")
        • +
      • HTML: data-icon="speedboat" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subway), 20, "filled")
        • +
      • HTML: data-icon="subway" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(taxi), 20, "filled")
        • +
      • HTML: data-icon="taxi" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-and-car), 20, "filled")
        • +
      • HTML: data-icon="train-and-car" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(tram), 20, "filled")
        • +
      • HTML: data-icon="tram" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking), 20, "filled")
        • +
      • HTML: data-icon="walking" data-icon-variant="20-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking-fast), 20, "filled")
        • +
      • HTML: data-icon="walking-fast" data-icon-variant="20-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Action + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(account), 20, "outline")
        • +
      • HTML: data-icon="account" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add), 20, "outline")
        • +
      • HTML: data-icon="add" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-circle), 20, "outline")
        • +
      • HTML: data-icon="add-circle" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-link), 20, "outline")
        • +
      • HTML: data-icon="add-link" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alarm), 20, "outline")
        • +
      • HTML: data-icon="alarm" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alarm-add), 20, "outline")
        • +
      • HTML: data-icon="alarm-add" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert), 20, "outline")
        • +
      • HTML: data-icon="alert" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert-off), 20, "outline")
        • +
      • HTML: data-icon="alert-off" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(attachment), 20, "outline")
        • +
      • HTML: data-icon="attachment" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(augmented-reality), 20, "outline")
        • +
      • HTML: data-icon="augmented-reality" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(block), 20, "outline")
        • +
      • HTML: data-icon="block" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bookmark), 20, "outline")
        • +
      • HTML: data-icon="bookmark" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bug), 20, "outline")
        • +
      • HTML: data-icon="bug" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(build), 20, "outline")
        • +
      • HTML: data-icon="build" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(calendar), 20, "outline")
        • +
      • HTML: data-icon="calendar" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(camera), 20, "outline")
        • +
      • HTML: data-icon="camera" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cash), 20, "outline")
        • +
      • HTML: data-icon="cash" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(check-circle), 20, "outline")
        • +
      • HTML: data-icon="check-circle" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud), 20, "outline")
        • +
      • HTML: data-icon="cloud" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud-download), 20, "outline")
        • +
      • HTML: data-icon="cloud-download" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud-upload), 20, "outline")
        • +
      • HTML: data-icon="cloud-upload" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(compass), 20, "outline")
        • +
      • HTML: data-icon="compass" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(copy), 20, "outline")
        • +
      • HTML: data-icon="copy" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(credit-card), 20, "outline")
        • +
      • HTML: data-icon="credit-card" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dashboard), 20, "outline")
        • +
      • HTML: data-icon="dashboard" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(delete), 20, "outline")
        • +
      • HTML: data-icon="delete" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(discount), 20, "outline")
        • +
      • HTML: data-icon="discount" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(document), 20, "outline")
        • +
      • HTML: data-icon="document" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(document-check), 20, "outline")
        • +
      • HTML: data-icon="document-check" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(done), 20, "outline")
        • +
      • HTML: data-icon="done" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(download), 20, "outline")
        • +
      • HTML: data-icon="download" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(drag-and-drop), 20, "outline")
        • +
      • HTML: data-icon="drag-and-drop" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(edit), 20, "outline")
        • +
      • HTML: data-icon="edit" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-delighted), 20, "outline")
        • +
      • HTML: data-icon="face-delighted" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-disappointed), 20, "outline")
        • +
      • HTML: data-icon="face-disappointed" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-neutral), 20, "outline")
        • +
      • HTML: data-icon="face-neutral" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-sad), 20, "outline")
        • +
      • HTML: data-icon="face-sad" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-smiling), 20, "outline")
        • +
      • HTML: data-icon="face-smiling" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(filter), 20, "outline")
        • +
      • HTML: data-icon="filter" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fingerprint), 20, "outline")
        • +
      • HTML: data-icon="fingerprint" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder), 20, "outline")
        • +
      • HTML: data-icon="folder" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder-open), 20, "outline")
        • +
      • HTML: data-icon="folder-open" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(generic-card), 20, "outline")
        • +
      • HTML: data-icon="generic-card" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(giftcard), 20, "outline")
        • +
      • HTML: data-icon="giftcard" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hearing), 20, "outline")
        • +
      • HTML: data-icon="hearing" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hearing-disabled), 20, "outline")
        • +
      • HTML: data-icon="hearing-disabled" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(heart), 20, "outline")
        • +
      • HTML: data-icon="heart" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help), 20, "outline")
        • +
      • HTML: data-icon="help" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(image), 20, "outline")
        • +
      • HTML: data-icon="image" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info), 20, "outline")
        • +
      • HTML: data-icon="info" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(key), 20, "outline")
        • +
      • HTML: data-icon="key" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(legal), 20, "outline")
        • +
      • HTML: data-icon="legal" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lightbulb), 20, "outline")
        • +
      • HTML: data-icon="lightbulb" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-close), 20, "outline")
        • +
      • HTML: data-icon="lock-close" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-open), 20, "outline")
        • +
      • HTML: data-icon="lock-open" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(log-out), 20, "outline")
        • +
      • HTML: data-icon="log-out" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(logbook), 20, "outline")
        • +
      • HTML: data-icon="logbook" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(minus), 20, "outline")
        • +
      • HTML: data-icon="minus" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(piggybank), 20, "outline")
        • +
      • HTML: data-icon="piggybank" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pin), 20, "outline")
        • +
      • HTML: data-icon="pin" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(print), 20, "outline")
        • +
      • HTML: data-icon="print" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(push-button), 20, "outline")
        • +
      • HTML: data-icon="push-button" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(remove), 20, "outline")
        • +
      • HTML: data-icon="remove" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize), 20, "outline")
        • +
      • HTML: data-icon="resize" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize-handle-corner), 20, "outline")
        • +
      • HTML: data-icon="resize-handle-corner" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(save), 20, "outline")
        • +
      • HTML: data-icon="save" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(schedule), 20, "outline")
        • +
      • HTML: data-icon="schedule" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(search), 20, "outline")
        • +
      • HTML: data-icon="search" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(send), 20, "outline")
        • +
      • HTML: data-icon="send" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sepa), 20, "outline")
        • +
      • HTML: data-icon="sepa" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(settings), 20, "outline")
        • +
      • HTML: data-icon="settings" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share), 20, "outline")
        • +
      • HTML: data-icon="share" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-bag), 20, "outline")
        • +
      • HTML: data-icon="shopping-bag" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket), 20, "outline")
        • +
      • HTML: data-icon="shopping-basket" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket-disabled), 20, "outline")
        • +
      • HTML: data-icon="shopping-basket-disabled" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-cart), 20, "outline")
        • +
      • HTML: data-icon="shopping-cart" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-cart-disabled), 20, "outline")
        • +
      • HTML: data-icon="shopping-cart-disabled" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sort-down), 20, "outline")
        • +
      • HTML: data-icon="sort-down" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sort-up), 20, "outline")
        • +
      • HTML: data-icon="sort-up" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(star), 20, "outline")
        • +
      • HTML: data-icon="star" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(swap-horizontal), 20, "outline")
        • +
      • HTML: data-icon="swap-horizontal" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(swap-vertical), 20, "outline")
        • +
      • HTML: data-icon="swap-vertical" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(thumb-up), 20, "outline")
        • +
      • HTML: data-icon="thumb-up" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(thumb-up-down), 20, "outline")
        • +
      • HTML: data-icon="thumb-up-down" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(translation), 20, "outline")
        • +
      • HTML: data-icon="translation" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(undo), 20, "outline")
        • +
      • HTML: data-icon="undo" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(upload), 20, "outline")
        • +
      • HTML: data-icon="upload" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(visibility), 20, "outline")
        • +
      • HTML: data-icon="visibility" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(visibility-off), 20, "outline")
        • +
      • HTML: data-icon="visibility-off" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(voucher), 20, "outline")
        • +
      • HTML: data-icon="voucher" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(website), 20, "outline")
        • +
      • HTML: data-icon="website" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(zoom-in), 20, "outline")
        • +
      • HTML: data-icon="zoom-in" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(zoom-out), 20, "outline")
        • +
      • HTML: data-icon="zoom-out" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 20, "outline")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-10), 20, "outline")
        • +
      • HTML: data-icon="fast-backward-10" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-30), 20, "outline")
        • +
      • HTML: data-icon="fast-backward-30" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-empty), 20, "outline")
        • +
      • HTML: data-icon="fast-backward-empty" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 20, "outline")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-10), 20, "outline")
        • +
      • HTML: data-icon="fast-forward-10" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-30), 20, "outline")
        • +
      • HTML: data-icon="fast-forward-30" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-empty), 20, "outline")
        • +
      • HTML: data-icon="fast-forward-empty" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(microphone), 20, "outline")
        • +
      • HTML: data-icon="microphone" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pause), 20, "outline")
        • +
      • HTML: data-icon="pause" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 20, "outline")
        • +
      • HTML: data-icon="play" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 20, "outline")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 20, "outline")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 20, "outline")
        • +
      • HTML: data-icon="stop" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subtitles), 20, "outline")
        • +
      • HTML: data-icon="subtitles" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-down), 20, "outline")
        • +
      • HTML: data-icon="volume-down" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-mute), 20, "outline")
        • +
      • HTML: data-icon="volume-mute" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-off), 20, "outline")
        • +
      • HTML: data-icon="volume-off" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-up), 20, "outline")
        • +
      • HTML: data-icon="volume-up" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Brand + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(logo), 20, "outline")
        • +
      • HTML: data-icon="logo" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Communication + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(call), 20, "outline")
        • +
      • HTML: data-icon="call" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chat), 20, "outline")
        • +
      • HTML: data-icon="chat" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(conversation), 20, "outline")
        • +
      • HTML: data-icon="conversation" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fax), 20, "outline")
        • +
      • HTML: data-icon="fax" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(feedback), 20, "outline")
        • +
      • HTML: data-icon="feedback" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mail), 20, "outline")
        • +
      • HTML: data-icon="mail" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mobile-phone), 20, "outline")
        • +
      • HTML: data-icon="mobile-phone" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mobile-off), 20, "outline")
        • +
      • HTML: data-icon="mobile-off" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(question), 20, "outline")
        • +
      • HTML: data-icon="question" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(receive-item), 20, "outline")
        • +
      • HTML: data-icon="receive-item" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share-item), 20, "outline")
        • +
      • HTML: data-icon="share-item" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wifi), 20, "outline")
        • +
      • HTML: data-icon="wifi" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wifi-off), 20, "outline")
        • +
      • HTML: data-icon="wifi-off" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Covid 19 + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(mask), 20, "outline")
        • +
      • HTML: data-icon="mask" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Facilities + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(playground), 20, "outline")
        • +
      • HTML: data-icon="playground" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(restricted-mobility-toilet), 20, "outline")
        • +
      • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower), 20, "outline")
        • +
      • HTML: data-icon="shower" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower-men), 20, "outline")
        • +
      • HTML: data-icon="shower-men" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower-women), 20, "outline")
        • +
      • HTML: data-icon="shower-women" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sink), 20, "outline")
        • +
      • HTML: data-icon="sink" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc), 20, "outline")
        • +
      • HTML: data-icon="wc" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-men), 20, "outline")
        • +
      • HTML: data-icon="wc-men" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-sign), 20, "outline")
        • +
      • HTML: data-icon="wc-sign" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-woman), 20, "outline")
        • +
      • HTML: data-icon="wc-woman" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Feature + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(air-condition), 20, "outline")
        • +
      • HTML: data-icon="air-condition" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(buggy), 20, "outline")
        • +
      • HTML: data-icon="buggy" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(clothing-hanger), 20, "outline")
        • +
      • HTML: data-icon="clothing-hanger" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(day), 20, "outline")
        • +
      • HTML: data-icon="day" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dog), 20, "outline")
        • +
      • HTML: data-icon="dog" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(entry-aid), 20, "outline")
        • +
      • HTML: data-icon="entry-aid" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(environmental-mobility-check), 20, "outline")
        • +
      • HTML: data-icon="environmental-mobility-check" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hydrogen), 20, "outline")
        • +
      • HTML: data-icon="hydrogen" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(luggage-compartment), 20, "outline")
        • +
      • HTML: data-icon="luggage-compartment" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(luggage-rack), 20, "outline")
        • +
      • HTML: data-icon="luggage-rack" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(marketplace), 20, "outline")
        • +
      • HTML: data-icon="marketplace" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(medical), 20, "outline")
        • +
      • HTML: data-icon="medical" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(night), 20, "outline")
        • +
      • HTML: data-icon="night" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(no-smoking), 20, "outline")
        • +
      • HTML: data-icon="no-smoking" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(person-with-cane), 20, "outline")
        • +
      • HTML: data-icon="person-with-cane" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(person-with-rollator), 20, "outline")
        • +
      • HTML: data-icon="person-with-rollator" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(platform), 20, "outline")
        • +
      • HTML: data-icon="platform" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(power-outlet), 20, "outline")
        • +
      • HTML: data-icon="power-outlet" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(reservation), 20, "outline")
        • +
      • HTML: data-icon="reservation" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(standing-room), 20, "outline")
        • +
      • HTML: data-icon="standing-room" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(steppless-entry), 20, "outline")
        • +
      • HTML: data-icon="steppless-entry" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(support-dog), 20, "outline")
        • +
      • HTML: data-icon="support-dog" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Food + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(breakfast), 20, "outline")
        • +
      • HTML: data-icon="breakfast" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(coffee-cup), 20, "outline")
        • +
      • HTML: data-icon="coffee-cup" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(drink), 20, "outline")
        • +
      • HTML: data-icon="drink" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(restaurant), 20, "outline")
        • +
      • HTML: data-icon="restaurant" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - IT + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(database), 20, "outline")
        • +
      • HTML: data-icon="database" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Journey + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(1st-class), 20, "outline")
        • +
      • HTML: data-icon="1st-class" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(2nd-class), 20, "outline")
        • +
      • HTML: data-icon="2nd-class" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alternative-connection), 20, "outline")
        • +
      • HTML: data-icon="alternative-connection" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(booking), 20, "outline")
        • +
      • HTML: data-icon="booking" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator), 20, "outline")
        • +
      • HTML: data-icon="capacity-indicator" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 20, "outline")
        • +
      • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-high), 20, "outline")
        • +
      • HTML: data-icon="capacity-indicator-high" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-low), 20, "outline")
        • +
      • HTML: data-icon="capacity-indicator-low" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(destination), 20, "outline")
        • +
      • HTML: data-icon="destination" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intermediary-stop), 20, "outline")
        • +
      • HTML: data-icon="intermediary-stop" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mixed-class), 20, "outline")
        • +
      • HTML: data-icon="mixed-class" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(round-trip), 20, "outline")
        • +
      • HTML: data-icon="round-trip" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(single-trip), 20, "outline")
        • +
      • HTML: data-icon="single-trip" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(start), 20, "outline")
        • +
      • HTML: data-icon="start" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Maps + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(gps), 20, "outline")
        • +
      • HTML: data-icon="gps" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(gps-north), 20, "outline")
        • +
      • HTML: data-icon="gps-north" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(home), 20, "outline")
        • +
      • HTML: data-icon="home" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(map), 20, "outline")
        • +
      • HTML: data-icon="map" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-straight), 20, "outline")
        • +
      • HTML: data-icon="navigation-straight" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-to-left), 20, "outline")
        • +
      • HTML: data-icon="navigation-to-left" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-to-right), 20, "outline")
        • +
      • HTML: data-icon="navigation-to-right" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-u-turn), 20, "outline")
        • +
      • HTML: data-icon="navigation-u-turn" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop-sign), 20, "outline")
        • +
      • HTML: data-icon="stop-sign" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parking), 20, "outline")
        • +
      • HTML: data-icon="parking" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(place), 20, "outline")
        • +
      • HTML: data-icon="place" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(set-position), 20, "outline")
        • +
      • HTML: data-icon="set-position" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(station), 20, "outline")
        • +
      • HTML: data-icon="station" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-station), 20, "outline")
        • +
      • HTML: data-icon="train-station" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(arrow-back), 20, "outline")
        • +
      • HTML: data-icon="arrow-back" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-down), 20, "outline")
        • +
      • HTML: data-icon="arrow-down" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-forward), 20, "outline")
        • +
      • HTML: data-icon="arrow-forward" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-up), 20, "outline")
        • +
      • HTML: data-icon="arrow-up" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cancel), 20, "outline")
        • +
      • HTML: data-icon="cancel" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-left), 20, "outline")
        • +
      • HTML: data-icon="chevron-left" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-right), 20, "outline")
        • +
      • HTML: data-icon="chevron-right" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(close), 20, "outline")
        • +
      • HTML: data-icon="close" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-less), 20, "outline")
        • +
      • HTML: data-icon="expand-less" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-more), 20, "outline")
        • +
      • HTML: data-icon="expand-more" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fullscreen), 20, "outline")
        • +
      • HTML: data-icon="fullscreen" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fullscreen-exit), 20, "outline")
        • +
      • HTML: data-icon="fullscreen-exit" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(grid-view), 20, "outline")
        • +
      • HTML: data-icon="grid-view" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(link), 20, "outline")
        • +
      • HTML: data-icon="link" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(link-external), 20, "outline")
        • +
      • HTML: data-icon="link-external" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(list), 20, "outline")
        • +
      • HTML: data-icon="list" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(menu), 20, "outline")
        • +
      • HTML: data-icon="menu" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(more-horizontal), 20, "outline")
        • +
      • HTML: data-icon="more-horizontal" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(more-vertical), 20, "outline")
        • +
      • HTML: data-icon="more-vertical" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(refresh), 20, "outline")
        • +
      • HTML: data-icon="refresh" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Notification + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(error), 20, "outline")
        • +
      • HTML: data-icon="error" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(notify), 20, "outline")
        • +
      • HTML: data-icon="notify" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(notify-cutoff), 20, "outline")
        • +
      • HTML: data-icon="notify-cutoff" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning), 20, "outline")
        • +
      • HTML: data-icon="warning" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Seat + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(aisle), 20, "outline")
        • +
      • HTML: data-icon="aisle" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(aisle-not-available), 20, "outline")
        • +
      • HTML: data-icon="aisle-not-available" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bed), 20, "outline")
        • +
      • HTML: data-icon="bed" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(childrens-compartment), 20, "outline")
        • +
      • HTML: data-icon="childrens-compartment" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(elderly), 20, "outline")
        • +
      • HTML: data-icon="elderly" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handicapped), 20, "outline")
        • +
      • HTML: data-icon="handicapped" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parent-child-compartment), 20, "outline")
        • +
      • HTML: data-icon="parent-child-compartment" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(priority), 20, "outline")
        • +
      • HTML: data-icon="priority" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(quiet-zone), 20, "outline")
        • +
      • HTML: data-icon="quiet-zone" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(table), 20, "outline")
        • +
      • HTML: data-icon="table" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(window), 20, "outline")
        • +
      • HTML: data-icon="window" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Ticket + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus), 20, "outline")
        • +
      • HTML: data-icon="bahnbonus" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus-card), 20, "outline")
        • +
      • HTML: data-icon="bahnbonus-card" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahncard), 20, "outline")
        • +
      • HTML: data-icon="bahncard" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(best-price), 20, "outline")
        • +
      • HTML: data-icon="best-price" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(commuter-ticket), 20, "outline")
        • +
      • HTML: data-icon="commuter-ticket" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in), 20, "outline")
        • +
      • HTML: data-icon="komfort-check-in" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in-check), 20, "outline")
        • +
      • HTML: data-icon="komfort-check-in-check" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in-circle), 20, "outline")
        • +
      • HTML: data-icon="komfort-check-in-circle" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-cards), 20, "outline")
        • +
      • HTML: data-icon="multiple-cards" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-passenger), 20, "outline")
        • +
      • HTML: data-icon="multiple-passenger" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(my-travel), 20, "outline")
        • +
      • HTML: data-icon="my-travel" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(outward-journey), 20, "outline")
        • +
      • HTML: data-icon="outward-journey" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(qr-code), 20, "outline")
        • +
      • HTML: data-icon="qr-code" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(qr-code-scan), 20, "outline")
        • +
      • HTML: data-icon="qr-code-scan" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(return-journey), 20, "outline")
        • +
      • HTML: data-icon="return-journey" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket), 20, "outline")
        • +
      • HTML: data-icon="ticket" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-discount), 20, "outline")
        • +
      • HTML: data-icon="ticket-discount" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-multiple), 20, "outline")
        • +
      • HTML: data-icon="ticket-multiple" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-subscription), 20, "outline")
        • +
      • HTML: data-icon="ticket-subscription" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(time-outward-journey), 20, "outline")
        • +
      • HTML: data-icon="time-outward-journey" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(time-return-journey), 20, "outline")
        • +
      • HTML: data-icon="time-return-journey" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(timetable), 20, "outline")
        • +
      • HTML: data-icon="timetable" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(travel-insurance), 20, "outline")
        • +
      • HTML: data-icon="travel-insurance" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 20x20 - Outline - Transportation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(airplane), 20, "outline")
        • +
      • HTML: data-icon="airplane" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle), 20, "outline")
        • +
      • HTML: data-icon="bicycle" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle-trailer), 20, "outline")
        • +
      • HTML: data-icon="bicycle-trailer" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(call-a-bike), 20, "outline")
        • +
      • HTML: data-icon="call-a-bike" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car), 20, "outline")
        • +
      • HTML: data-icon="car" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(carsharing), 20, "outline")
        • +
      • HTML: data-icon="carsharing" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car-sequence), 20, "outline")
        • +
      • HTML: data-icon="car-sequence" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-locomotive), 20, "outline")
        • +
      • HTML: data-icon="electric-locomotive" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-scooter), 20, "outline")
        • +
      • HTML: data-icon="electric-scooter" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-bus), 20, "outline")
        • +
      • HTML: data-icon="ev-bus" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-car), 20, "outline")
        • +
      • HTML: data-icon="ev-car" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-train), 20, "outline")
        • +
      • HTML: data-icon="ev-train" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ferry), 20, "outline")
        • +
      • HTML: data-icon="ferry" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handcart), 20, "outline")
        • +
      • HTML: data-icon="handcart" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice), 20, "outline")
        • +
      • HTML: data-icon="ice" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intercity-train), 20, "outline")
        • +
      • HTML: data-icon="intercity-train" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice-side-view), 20, "outline")
        • +
      • HTML: data-icon="ice-side-view" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-bus), 20, "outline")
        • +
      • HTML: data-icon="local-bus" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(long-distance-bus), 20, "outline")
        • +
      • HTML: data-icon="long-distance-bus" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-train), 20, "outline")
        • +
      • HTML: data-icon="local-train" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(rail-and-fly), 20, "outline")
        • +
      • HTML: data-icon="rail-and-fly" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(railroad-car), 20, "outline")
        • +
      • HTML: data-icon="railroad-car" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(s-bahn), 20, "outline")
        • +
      • HTML: data-icon="s-bahn" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(scooter), 20, "outline")
        • +
      • HTML: data-icon="scooter" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sev), 20, "outline")
        • +
      • HTML: data-icon="sev" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(speedboat), 20, "outline")
        • +
      • HTML: data-icon="speedboat" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sprinter), 20, "outline")
        • +
      • HTML: data-icon="sprinter" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subway), 20, "outline")
        • +
      • HTML: data-icon="subway" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(taxi), 20, "outline")
        • +
      • HTML: data-icon="taxi" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-and-car), 20, "outline")
        • +
      • HTML: data-icon="train-and-car" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(tram), 20, "outline")
        • +
      • HTML: data-icon="tram" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking), 20, "outline")
        • +
      • HTML: data-icon="walking" data-icon-variant="20-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking-fast), 20, "outline")
        • +
      • HTML: data-icon="walking-fast" data-icon-variant="20-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - Action + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "filled")
        • +
      • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "filled")
        • +
      • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "filled")
        • +
      • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "filled")
        • +
      • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "filled")
        • +
      • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "filled")
        • +
      • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "filled")
        • +
      • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "filled")
        • +
      • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "filled")
        • +
      • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "filled")
        • +
      • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "filled")
        • +
      • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "filled")
        • +
      • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - AV + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "filled")
        • +
      • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "filled")
        • +
      • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "filled")
        • +
      • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "filled")
        • +
      • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "filled")
        • +
      • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "filled")
        • +
      • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "filled")
        • +
      • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - Journey + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "filled")
        • +
      • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "filled")
        • +
      • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "filled")
        • +
      • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "filled")
        • +
      • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "filled")
        • +
      • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - Maps + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "filled")
        • +
      • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "filled")
        • +
      • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "filled")
        • +
      • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - Notification + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "filled")
        • +
      • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "filled")
        • +
      • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Filled - Transportation + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (filled) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "filled")
        • +
      • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "filled")
        • +
      • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "filled")
        • +
      • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "filled")
        • +
      • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "filled")
        • +
      • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "filled")
        • +
      • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "filled")
        • +
      • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "filled")
        • +
      • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "filled")
        • +
      • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "filled")
        • +
      • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "filled")
        • +
      • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "filled")
        • +
      • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "filled")
        • +
      • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "filled")
        • +
      • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "filled")
        • +
      • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "filled")
        • +
      • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "filled")
        • +
      • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "filled")
        • +
      • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "filled")
        • +
      • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "filled")
        • +
      • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "filled")
        • +
      • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "filled")
        • +
      • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "filled")
        • +
      • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "filled")
        • +
      • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "filled")
        • +
      • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Action + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(account)) or @include icon(glyph(account), 24, "outline")
        • +
      • HTML: data-icon="account" or data-icon="account" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add)) or @include icon(glyph(add), 24, "outline")
        • +
      • HTML: data-icon="add" or data-icon="add" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-circle)) or @include icon(glyph(add-circle), 24, "outline")
        • +
      • HTML: data-icon="add-circle" or data-icon="add-circle" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-link)) or @include icon(glyph(add-link), 24, "outline")
        • +
      • HTML: data-icon="add-link" or data-icon="add-link" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alarm)) or @include icon(glyph(alarm), 24, "outline")
        • +
      • HTML: data-icon="alarm" or data-icon="alarm" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alarm-add)) or @include icon(glyph(alarm-add), 24, "outline")
        • +
      • HTML: data-icon="alarm-add" or data-icon="alarm-add" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert)) or @include icon(glyph(alert), 24, "outline")
        • +
      • HTML: data-icon="alert" or data-icon="alert" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert-off)) or @include icon(glyph(alert-off), 24, "outline")
        • +
      • HTML: data-icon="alert-off" or data-icon="alert-off" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(attachment)) or @include icon(glyph(attachment), 24, "outline")
        • +
      • HTML: data-icon="attachment" or data-icon="attachment" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(augmented-reality)) or @include icon(glyph(augmented-reality), 24, "outline")
        • +
      • HTML: data-icon="augmented-reality" or data-icon="augmented-reality" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(block)) or @include icon(glyph(block), 24, "outline")
        • +
      • HTML: data-icon="block" or data-icon="block" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bookmark)) or @include icon(glyph(bookmark), 24, "outline")
        • +
      • HTML: data-icon="bookmark" or data-icon="bookmark" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bug)) or @include icon(glyph(bug), 24, "outline")
        • +
      • HTML: data-icon="bug" or data-icon="bug" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(build)) or @include icon(glyph(build), 24, "outline")
        • +
      • HTML: data-icon="build" or data-icon="build" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(calendar)) or @include icon(glyph(calendar), 24, "outline")
        • +
      • HTML: data-icon="calendar" or data-icon="calendar" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(camera)) or @include icon(glyph(camera), 24, "outline")
        • +
      • HTML: data-icon="camera" or data-icon="camera" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cash)) or @include icon(glyph(cash), 24, "outline")
        • +
      • HTML: data-icon="cash" or data-icon="cash" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(check-circle)) or @include icon(glyph(check-circle), 24, "outline")
        • +
      • HTML: data-icon="check-circle" or data-icon="check-circle" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud)) or @include icon(glyph(cloud), 24, "outline")
        • +
      • HTML: data-icon="cloud" or data-icon="cloud" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud-download)) or @include icon(glyph(cloud-download), 24, "outline")
        • +
      • HTML: data-icon="cloud-download" or data-icon="cloud-download" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud-upload)) or @include icon(glyph(cloud-upload), 24, "outline")
        • +
      • HTML: data-icon="cloud-upload" or data-icon="cloud-upload" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(compass)) or @include icon(glyph(compass), 24, "outline")
        • +
      • HTML: data-icon="compass" or data-icon="compass" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(copy)) or @include icon(glyph(copy), 24, "outline")
        • +
      • HTML: data-icon="copy" or data-icon="copy" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(credit-card)) or @include icon(glyph(credit-card), 24, "outline")
        • +
      • HTML: data-icon="credit-card" or data-icon="credit-card" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dashboard)) or @include icon(glyph(dashboard), 24, "outline")
        • +
      • HTML: data-icon="dashboard" or data-icon="dashboard" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(delete)) or @include icon(glyph(delete), 24, "outline")
        • +
      • HTML: data-icon="delete" or data-icon="delete" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(discount)) or @include icon(glyph(discount), 24, "outline")
        • +
      • HTML: data-icon="discount" or data-icon="discount" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(document)) or @include icon(glyph(document), 24, "outline")
        • +
      • HTML: data-icon="document" or data-icon="document" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(document-check)) or @include icon(glyph(document-check), 24, "outline")
        • +
      • HTML: data-icon="document-check" or data-icon="document-check" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(done)) or @include icon(glyph(done), 24, "outline")
        • +
      • HTML: data-icon="done" or data-icon="done" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(download)) or @include icon(glyph(download), 24, "outline")
        • +
      • HTML: data-icon="download" or data-icon="download" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(drag-and-drop)) or @include icon(glyph(drag-and-drop), 24, "outline")
        • +
      • HTML: data-icon="drag-and-drop" or data-icon="drag-and-drop" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(edit)) or @include icon(glyph(edit), 24, "outline")
        • +
      • HTML: data-icon="edit" or data-icon="edit" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-delighted)) or @include icon(glyph(face-delighted), 24, "outline")
        • +
      • HTML: data-icon="face-delighted" or data-icon="face-delighted" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-disappointed)) or @include icon(glyph(face-disappointed), 24, "outline")
        • +
      • HTML: data-icon="face-disappointed" or data-icon="face-disappointed" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-neutral)) or @include icon(glyph(face-neutral), 24, "outline")
        • +
      • HTML: data-icon="face-neutral" or data-icon="face-neutral" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-sad)) or @include icon(glyph(face-sad), 24, "outline")
        • +
      • HTML: data-icon="face-sad" or data-icon="face-sad" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-smiling)) or @include icon(glyph(face-smiling), 24, "outline")
        • +
      • HTML: data-icon="face-smiling" or data-icon="face-smiling" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(filter)) or @include icon(glyph(filter), 24, "outline")
        • +
      • HTML: data-icon="filter" or data-icon="filter" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fingerprint)) or @include icon(glyph(fingerprint), 24, "outline")
        • +
      • HTML: data-icon="fingerprint" or data-icon="fingerprint" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder)) or @include icon(glyph(folder), 24, "outline")
        • +
      • HTML: data-icon="folder" or data-icon="folder" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder-open)) or @include icon(glyph(folder-open), 24, "outline")
        • +
      • HTML: data-icon="folder-open" or data-icon="folder-open" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(generic-card)) or @include icon(glyph(generic-card), 24, "outline")
        • +
      • HTML: data-icon="generic-card" or data-icon="generic-card" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(giftcard)) or @include icon(glyph(giftcard), 24, "outline")
        • +
      • HTML: data-icon="giftcard" or data-icon="giftcard" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hearing)) or @include icon(glyph(hearing), 24, "outline")
        • +
      • HTML: data-icon="hearing" or data-icon="hearing" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hearing-disabled)) or @include icon(glyph(hearing-disabled), 24, "outline")
        • +
      • HTML: data-icon="hearing-disabled" or data-icon="hearing-disabled" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(heart)) or @include icon(glyph(heart), 24, "outline")
        • +
      • HTML: data-icon="heart" or data-icon="heart" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help)) or @include icon(glyph(help), 24, "outline")
        • +
      • HTML: data-icon="help" or data-icon="help" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(image)) or @include icon(glyph(image), 24, "outline")
        • +
      • HTML: data-icon="image" or data-icon="image" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info)) or @include icon(glyph(info), 24, "outline")
        • +
      • HTML: data-icon="info" or data-icon="info" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(key)) or @include icon(glyph(key), 24, "outline")
        • +
      • HTML: data-icon="key" or data-icon="key" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(legal)) or @include icon(glyph(legal), 24, "outline")
        • +
      • HTML: data-icon="legal" or data-icon="legal" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lightbulb)) or @include icon(glyph(lightbulb), 24, "outline")
        • +
      • HTML: data-icon="lightbulb" or data-icon="lightbulb" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-close)) or @include icon(glyph(lock-close), 24, "outline")
        • +
      • HTML: data-icon="lock-close" or data-icon="lock-close" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-open)) or @include icon(glyph(lock-open), 24, "outline")
        • +
      • HTML: data-icon="lock-open" or data-icon="lock-open" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(log-out)) or @include icon(glyph(log-out), 24, "outline")
        • +
      • HTML: data-icon="log-out" or data-icon="log-out" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(logbook)) or @include icon(glyph(logbook), 24, "outline")
        • +
      • HTML: data-icon="logbook" or data-icon="logbook" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(minus)) or @include icon(glyph(minus), 24, "outline")
        • +
      • HTML: data-icon="minus" or data-icon="minus" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(piggybank)) or @include icon(glyph(piggybank), 24, "outline")
        • +
      • HTML: data-icon="piggybank" or data-icon="piggybank" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pin)) or @include icon(glyph(pin), 24, "outline")
        • +
      • HTML: data-icon="pin" or data-icon="pin" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(print)) or @include icon(glyph(print), 24, "outline")
        • +
      • HTML: data-icon="print" or data-icon="print" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(push-button)) or @include icon(glyph(push-button), 24, "outline")
        • +
      • HTML: data-icon="push-button" or data-icon="push-button" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(remove)) or @include icon(glyph(remove), 24, "outline")
        • +
      • HTML: data-icon="remove" or data-icon="remove" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize)) or @include icon(glyph(resize), 24, "outline")
        • +
      • HTML: data-icon="resize" or data-icon="resize" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize-handle-corner)) or @include icon(glyph(resize-handle-corner), 24, "outline")
        • +
      • HTML: data-icon="resize-handle-corner" or data-icon="resize-handle-corner" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(save)) or @include icon(glyph(save), 24, "outline")
        • +
      • HTML: data-icon="save" or data-icon="save" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(schedule)) or @include icon(glyph(schedule), 24, "outline")
        • +
      • HTML: data-icon="schedule" or data-icon="schedule" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(search)) or @include icon(glyph(search), 24, "outline")
        • +
      • HTML: data-icon="search" or data-icon="search" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(send)) or @include icon(glyph(send), 24, "outline")
        • +
      • HTML: data-icon="send" or data-icon="send" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sepa)) or @include icon(glyph(sepa), 24, "outline")
        • +
      • HTML: data-icon="sepa" or data-icon="sepa" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(settings)) or @include icon(glyph(settings), 24, "outline")
        • +
      • HTML: data-icon="settings" or data-icon="settings" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share)) or @include icon(glyph(share), 24, "outline")
        • +
      • HTML: data-icon="share" or data-icon="share" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-bag)) or @include icon(glyph(shopping-bag), 24, "outline")
        • +
      • HTML: data-icon="shopping-bag" or data-icon="shopping-bag" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket)) or @include icon(glyph(shopping-basket), 24, "outline")
        • +
      • HTML: data-icon="shopping-basket" or data-icon="shopping-basket" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket-disabled)) or @include icon(glyph(shopping-basket-disabled), 24, "outline")
        • +
      • HTML: data-icon="shopping-basket-disabled" or data-icon="shopping-basket-disabled" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-cart)) or @include icon(glyph(shopping-cart), 24, "outline")
        • +
      • HTML: data-icon="shopping-cart" or data-icon="shopping-cart" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-cart-disabled)) or @include icon(glyph(shopping-cart-disabled), 24, "outline")
        • +
      • HTML: data-icon="shopping-cart-disabled" or data-icon="shopping-cart-disabled" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sort-down)) or @include icon(glyph(sort-down), 24, "outline")
        • +
      • HTML: data-icon="sort-down" or data-icon="sort-down" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sort-up)) or @include icon(glyph(sort-up), 24, "outline")
        • +
      • HTML: data-icon="sort-up" or data-icon="sort-up" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(star)) or @include icon(glyph(star), 24, "outline")
        • +
      • HTML: data-icon="star" or data-icon="star" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(swap-horizontal)) or @include icon(glyph(swap-horizontal), 24, "outline")
        • +
      • HTML: data-icon="swap-horizontal" or data-icon="swap-horizontal" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(swap-vertical)) or @include icon(glyph(swap-vertical), 24, "outline")
        • +
      • HTML: data-icon="swap-vertical" or data-icon="swap-vertical" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(thumb-up)) or @include icon(glyph(thumb-up), 24, "outline")
        • +
      • HTML: data-icon="thumb-up" or data-icon="thumb-up" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(thumb-up-down)) or @include icon(glyph(thumb-up-down), 24, "outline")
        • +
      • HTML: data-icon="thumb-up-down" or data-icon="thumb-up-down" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(translation)) or @include icon(glyph(translation), 24, "outline")
        • +
      • HTML: data-icon="translation" or data-icon="translation" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(undo)) or @include icon(glyph(undo), 24, "outline")
        • +
      • HTML: data-icon="undo" or data-icon="undo" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(upload)) or @include icon(glyph(upload), 24, "outline")
        • +
      • HTML: data-icon="upload" or data-icon="upload" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(visibility)) or @include icon(glyph(visibility), 24, "outline")
        • +
      • HTML: data-icon="visibility" or data-icon="visibility" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(visibility-off)) or @include icon(glyph(visibility-off), 24, "outline")
        • +
      • HTML: data-icon="visibility-off" or data-icon="visibility-off" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(voucher)) or @include icon(glyph(voucher), 24, "outline")
        • +
      • HTML: data-icon="voucher" or data-icon="voucher" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(website)) or @include icon(glyph(website), 24, "outline")
        • +
      • HTML: data-icon="website" or data-icon="website" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(zoom-in)) or @include icon(glyph(zoom-in), 24, "outline")
        • +
      • HTML: data-icon="zoom-in" or data-icon="zoom-in" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(zoom-out)) or @include icon(glyph(zoom-out), 24, "outline")
        • +
      • HTML: data-icon="zoom-out" or data-icon="zoom-out" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - AV + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward)) or @include icon(glyph(fast-backward), 24, "outline")
        • +
      • HTML: data-icon="fast-backward" or data-icon="fast-backward" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-10)) or @include icon(glyph(fast-backward-10), 24, "outline")
        • +
      • HTML: data-icon="fast-backward-10" or data-icon="fast-backward-10" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-30)) or @include icon(glyph(fast-backward-30), 24, "outline")
        • +
      • HTML: data-icon="fast-backward-30" or data-icon="fast-backward-30" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-empty)) or @include icon(glyph(fast-backward-empty), 24, "outline")
        • +
      • HTML: data-icon="fast-backward-empty" or data-icon="fast-backward-empty" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward)) or @include icon(glyph(fast-forward), 24, "outline")
        • +
      • HTML: data-icon="fast-forward" or data-icon="fast-forward" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-10)) or @include icon(glyph(fast-forward-10), 24, "outline")
        • +
      • HTML: data-icon="fast-forward-10" or data-icon="fast-forward-10" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-30)) or @include icon(glyph(fast-forward-30), 24, "outline")
        • +
      • HTML: data-icon="fast-forward-30" or data-icon="fast-forward-30" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-empty)) or @include icon(glyph(fast-forward-empty), 24, "outline")
        • +
      • HTML: data-icon="fast-forward-empty" or data-icon="fast-forward-empty" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(microphone)) or @include icon(glyph(microphone), 24, "outline")
        • +
      • HTML: data-icon="microphone" or data-icon="microphone" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pause)) or @include icon(glyph(pause), 24, "outline")
        • +
      • HTML: data-icon="pause" or data-icon="pause" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play)) or @include icon(glyph(play), 24, "outline")
        • +
      • HTML: data-icon="play" or data-icon="play" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward)) or @include icon(glyph(skip-backward), 24, "outline")
        • +
      • HTML: data-icon="skip-backward" or data-icon="skip-backward" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward)) or @include icon(glyph(skip-forward), 24, "outline")
        • +
      • HTML: data-icon="skip-forward" or data-icon="skip-forward" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop)) or @include icon(glyph(stop), 24, "outline")
        • +
      • HTML: data-icon="stop" or data-icon="stop" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subtitles)) or @include icon(glyph(subtitles), 24, "outline")
        • +
      • HTML: data-icon="subtitles" or data-icon="subtitles" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-down)) or @include icon(glyph(volume-down), 24, "outline")
        • +
      • HTML: data-icon="volume-down" or data-icon="volume-down" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-mute)) or @include icon(glyph(volume-mute), 24, "outline")
        • +
      • HTML: data-icon="volume-mute" or data-icon="volume-mute" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-off)) or @include icon(glyph(volume-off), 24, "outline")
        • +
      • HTML: data-icon="volume-off" or data-icon="volume-off" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-up)) or @include icon(glyph(volume-up), 24, "outline")
        • +
      • HTML: data-icon="volume-up" or data-icon="volume-up" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Brand + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(logo)) or @include icon(glyph(logo), 24, "outline")
        • +
      • HTML: data-icon="logo" or data-icon="logo" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Communication + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(call)) or @include icon(glyph(call), 24, "outline")
        • +
      • HTML: data-icon="call" or data-icon="call" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chat)) or @include icon(glyph(chat), 24, "outline")
        • +
      • HTML: data-icon="chat" or data-icon="chat" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(conversation)) or @include icon(glyph(conversation), 24, "outline")
        • +
      • HTML: data-icon="conversation" or data-icon="conversation" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fax)) or @include icon(glyph(fax), 24, "outline")
        • +
      • HTML: data-icon="fax" or data-icon="fax" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(feedback)) or @include icon(glyph(feedback), 24, "outline")
        • +
      • HTML: data-icon="feedback" or data-icon="feedback" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mail)) or @include icon(glyph(mail), 24, "outline")
        • +
      • HTML: data-icon="mail" or data-icon="mail" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mobile-phone)) or @include icon(glyph(mobile-phone), 24, "outline")
        • +
      • HTML: data-icon="mobile-phone" or data-icon="mobile-phone" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mobile-off)) or @include icon(glyph(mobile-off), 24, "outline")
        • +
      • HTML: data-icon="mobile-off" or data-icon="mobile-off" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(question)) or @include icon(glyph(question), 24, "outline")
        • +
      • HTML: data-icon="question" or data-icon="question" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(receive-item)) or @include icon(glyph(receive-item), 24, "outline")
        • +
      • HTML: data-icon="receive-item" or data-icon="receive-item" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share-item)) or @include icon(glyph(share-item), 24, "outline")
        • +
      • HTML: data-icon="share-item" or data-icon="share-item" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wifi)) or @include icon(glyph(wifi), 24, "outline")
        • +
      • HTML: data-icon="wifi" or data-icon="wifi" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wifi-off)) or @include icon(glyph(wifi-off), 24, "outline")
        • +
      • HTML: data-icon="wifi-off" or data-icon="wifi-off" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Covid 19 + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(mask)) or @include icon(glyph(mask), 24, "outline")
        • +
      • HTML: data-icon="mask" or data-icon="mask" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Facilities + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(playground)) or @include icon(glyph(playground), 24, "outline")
        • +
      • HTML: data-icon="playground" or data-icon="playground" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(restricted-mobility-toilet)) or @include icon(glyph(restricted-mobility-toilet), 24, "outline")
        • +
      • HTML: data-icon="restricted-mobility-toilet" or data-icon="restricted-mobility-toilet" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower)) or @include icon(glyph(shower), 24, "outline")
        • +
      • HTML: data-icon="shower" or data-icon="shower" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower-men)) or @include icon(glyph(shower-men), 24, "outline")
        • +
      • HTML: data-icon="shower-men" or data-icon="shower-men" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower-women)) or @include icon(glyph(shower-women), 24, "outline")
        • +
      • HTML: data-icon="shower-women" or data-icon="shower-women" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sink)) or @include icon(glyph(sink), 24, "outline")
        • +
      • HTML: data-icon="sink" or data-icon="sink" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc)) or @include icon(glyph(wc), 24, "outline")
        • +
      • HTML: data-icon="wc" or data-icon="wc" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-men)) or @include icon(glyph(wc-men), 24, "outline")
        • +
      • HTML: data-icon="wc-men" or data-icon="wc-men" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-sign)) or @include icon(glyph(wc-sign), 24, "outline")
        • +
      • HTML: data-icon="wc-sign" or data-icon="wc-sign" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-woman)) or @include icon(glyph(wc-woman), 24, "outline")
        • +
      • HTML: data-icon="wc-woman" or data-icon="wc-woman" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Feature + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(air-condition)) or @include icon(glyph(air-condition), 24, "outline")
        • +
      • HTML: data-icon="air-condition" or data-icon="air-condition" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(buggy)) or @include icon(glyph(buggy), 24, "outline")
        • +
      • HTML: data-icon="buggy" or data-icon="buggy" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(clothing-hanger)) or @include icon(glyph(clothing-hanger), 24, "outline")
        • +
      • HTML: data-icon="clothing-hanger" or data-icon="clothing-hanger" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(day)) or @include icon(glyph(day), 24, "outline")
        • +
      • HTML: data-icon="day" or data-icon="day" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dog)) or @include icon(glyph(dog), 24, "outline")
        • +
      • HTML: data-icon="dog" or data-icon="dog" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(entry-aid)) or @include icon(glyph(entry-aid), 24, "outline")
        • +
      • HTML: data-icon="entry-aid" or data-icon="entry-aid" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(environmental-mobility-check)) or @include icon(glyph(environmental-mobility-check), 24, "outline")
        • +
      • HTML: data-icon="environmental-mobility-check" or data-icon="environmental-mobility-check" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hydrogen)) or @include icon(glyph(hydrogen), 24, "outline")
        • +
      • HTML: data-icon="hydrogen" or data-icon="hydrogen" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(luggage-compartment)) or @include icon(glyph(luggage-compartment), 24, "outline")
        • +
      • HTML: data-icon="luggage-compartment" or data-icon="luggage-compartment" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(luggage-rack)) or @include icon(glyph(luggage-rack), 24, "outline")
        • +
      • HTML: data-icon="luggage-rack" or data-icon="luggage-rack" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(marketplace)) or @include icon(glyph(marketplace), 24, "outline")
        • +
      • HTML: data-icon="marketplace" or data-icon="marketplace" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(medical)) or @include icon(glyph(medical), 24, "outline")
        • +
      • HTML: data-icon="medical" or data-icon="medical" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(night)) or @include icon(glyph(night), 24, "outline")
        • +
      • HTML: data-icon="night" or data-icon="night" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(no-smoking)) or @include icon(glyph(no-smoking), 24, "outline")
        • +
      • HTML: data-icon="no-smoking" or data-icon="no-smoking" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(person-with-cane)) or @include icon(glyph(person-with-cane), 24, "outline")
        • +
      • HTML: data-icon="person-with-cane" or data-icon="person-with-cane" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(person-with-rollator)) or @include icon(glyph(person-with-rollator), 24, "outline")
        • +
      • HTML: data-icon="person-with-rollator" or data-icon="person-with-rollator" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(platform)) or @include icon(glyph(platform), 24, "outline")
        • +
      • HTML: data-icon="platform" or data-icon="platform" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(power-outlet)) or @include icon(glyph(power-outlet), 24, "outline")
        • +
      • HTML: data-icon="power-outlet" or data-icon="power-outlet" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(reservation)) or @include icon(glyph(reservation), 24, "outline")
        • +
      • HTML: data-icon="reservation" or data-icon="reservation" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(standing-room)) or @include icon(glyph(standing-room), 24, "outline")
        • +
      • HTML: data-icon="standing-room" or data-icon="standing-room" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(steppless-entry)) or @include icon(glyph(steppless-entry), 24, "outline")
        • +
      • HTML: data-icon="steppless-entry" or data-icon="steppless-entry" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(support-dog)) or @include icon(glyph(support-dog), 24, "outline")
        • +
      • HTML: data-icon="support-dog" or data-icon="support-dog" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Food + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(breakfast)) or @include icon(glyph(breakfast), 24, "outline")
        • +
      • HTML: data-icon="breakfast" or data-icon="breakfast" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(coffee-cup)) or @include icon(glyph(coffee-cup), 24, "outline")
        • +
      • HTML: data-icon="coffee-cup" or data-icon="coffee-cup" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(drink)) or @include icon(glyph(drink), 24, "outline")
        • +
      • HTML: data-icon="drink" or data-icon="drink" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(restaurant)) or @include icon(glyph(restaurant), 24, "outline")
        • +
      • HTML: data-icon="restaurant" or data-icon="restaurant" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - IT + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(database), 24, "outline")
        • +
      • HTML: data-icon="database" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Journey + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(1st-class)) or @include icon(glyph(1st-class), 24, "outline")
        • +
      • HTML: data-icon="1st-class" or data-icon="1st-class" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(2nd-class)) or @include icon(glyph(2nd-class), 24, "outline")
        • +
      • HTML: data-icon="2nd-class" or data-icon="2nd-class" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alternative-connection)) or @include icon(glyph(alternative-connection), 24, "outline")
        • +
      • HTML: data-icon="alternative-connection" or data-icon="alternative-connection" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(booking)) or @include icon(glyph(booking), 24, "outline")
        • +
      • HTML: data-icon="booking" or data-icon="booking" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator)) or @include icon(glyph(capacity-indicator), 24, "outline")
        • +
      • HTML: data-icon="capacity-indicator" or data-icon="capacity-indicator" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-fully-booked)) or @include icon(glyph(capacity-indicator-fully-booked), 24, "outline")
        • +
      • HTML: data-icon="capacity-indicator-fully-booked" or data-icon="capacity-indicator-fully-booked" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-high)) or @include icon(glyph(capacity-indicator-high), 24, "outline")
        • +
      • HTML: data-icon="capacity-indicator-high" or data-icon="capacity-indicator-high" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-low)) or @include icon(glyph(capacity-indicator-low), 24, "outline")
        • +
      • HTML: data-icon="capacity-indicator-low" or data-icon="capacity-indicator-low" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(destination)) or @include icon(glyph(destination), 24, "outline")
        • +
      • HTML: data-icon="destination" or data-icon="destination" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intermediary-stop)) or @include icon(glyph(intermediary-stop), 24, "outline")
        • +
      • HTML: data-icon="intermediary-stop" or data-icon="intermediary-stop" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mixed-class)) or @include icon(glyph(mixed-class), 24, "outline")
        • +
      • HTML: data-icon="mixed-class" or data-icon="mixed-class" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(round-trip)) or @include icon(glyph(round-trip), 24, "outline")
        • +
      • HTML: data-icon="round-trip" or data-icon="round-trip" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(single-trip)) or @include icon(glyph(single-trip), 24, "outline")
        • +
      • HTML: data-icon="single-trip" or data-icon="single-trip" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(start)) or @include icon(glyph(start), 24, "outline")
        • +
      • HTML: data-icon="start" or data-icon="start" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Maps + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(gps)) or @include icon(glyph(gps), 24, "outline")
        • +
      • HTML: data-icon="gps" or data-icon="gps" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(gps-north)) or @include icon(glyph(gps-north), 24, "outline")
        • +
      • HTML: data-icon="gps-north" or data-icon="gps-north" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(home)) or @include icon(glyph(home), 24, "outline")
        • +
      • HTML: data-icon="home" or data-icon="home" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(map)) or @include icon(glyph(map), 24, "outline")
        • +
      • HTML: data-icon="map" or data-icon="map" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-straight)) or @include icon(glyph(navigation-straight), 24, "outline")
        • +
      • HTML: data-icon="navigation-straight" or data-icon="navigation-straight" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-to-left)) or @include icon(glyph(navigation-to-left), 24, "outline")
        • +
      • HTML: data-icon="navigation-to-left" or data-icon="navigation-to-left" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-to-right)) or @include icon(glyph(navigation-to-right), 24, "outline")
        • +
      • HTML: data-icon="navigation-to-right" or data-icon="navigation-to-right" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-u-turn)) or @include icon(glyph(navigation-u-turn), 24, "outline")
        • +
      • HTML: data-icon="navigation-u-turn" or data-icon="navigation-u-turn" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop-sign)) or @include icon(glyph(stop-sign), 24, "outline")
        • +
      • HTML: data-icon="stop-sign" or data-icon="stop-sign" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parking)) or @include icon(glyph(parking), 24, "outline")
        • +
      • HTML: data-icon="parking" or data-icon="parking" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(place)) or @include icon(glyph(place), 24, "outline")
        • +
      • HTML: data-icon="place" or data-icon="place" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(set-position)) or @include icon(glyph(set-position), 24, "outline")
        • +
      • HTML: data-icon="set-position" or data-icon="set-position" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(station)) or @include icon(glyph(station), 24, "outline")
        • +
      • HTML: data-icon="station" or data-icon="station" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-station)) or @include icon(glyph(train-station), 24, "outline")
        • +
      • HTML: data-icon="train-station" or data-icon="train-station" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(arrow-back)) or @include icon(glyph(arrow-back), 24, "outline")
        • +
      • HTML: data-icon="arrow-back" or data-icon="arrow-back" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-down)) or @include icon(glyph(arrow-down), 24, "outline")
        • +
      • HTML: data-icon="arrow-down" or data-icon="arrow-down" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-forward)) or @include icon(glyph(arrow-forward), 24, "outline")
        • +
      • HTML: data-icon="arrow-forward" or data-icon="arrow-forward" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-up)) or @include icon(glyph(arrow-up), 24, "outline")
        • +
      • HTML: data-icon="arrow-up" or data-icon="arrow-up" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cancel)) or @include icon(glyph(cancel), 24, "outline")
        • +
      • HTML: data-icon="cancel" or data-icon="cancel" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-left)) or @include icon(glyph(chevron-left), 24, "outline")
        • +
      • HTML: data-icon="chevron-left" or data-icon="chevron-left" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-right)) or @include icon(glyph(chevron-right), 24, "outline")
        • +
      • HTML: data-icon="chevron-right" or data-icon="chevron-right" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(close)) or @include icon(glyph(close), 24, "outline")
        • +
      • HTML: data-icon="close" or data-icon="close" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-less)) or @include icon(glyph(expand-less), 24, "outline")
        • +
      • HTML: data-icon="expand-less" or data-icon="expand-less" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-more)) or @include icon(glyph(expand-more), 24, "outline")
        • +
      • HTML: data-icon="expand-more" or data-icon="expand-more" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fullscreen)) or @include icon(glyph(fullscreen), 24, "outline")
        • +
      • HTML: data-icon="fullscreen" or data-icon="fullscreen" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fullscreen-exit)) or @include icon(glyph(fullscreen-exit), 24, "outline")
        • +
      • HTML: data-icon="fullscreen-exit" or data-icon="fullscreen-exit" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(grid-view)) or @include icon(glyph(grid-view), 24, "outline")
        • +
      • HTML: data-icon="grid-view" or data-icon="grid-view" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(link)) or @include icon(glyph(link), 24, "outline")
        • +
      • HTML: data-icon="link" or data-icon="link" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(link-external)) or @include icon(glyph(link-external), 24, "outline")
        • +
      • HTML: data-icon="link-external" or data-icon="link-external" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(list)) or @include icon(glyph(list), 24, "outline")
        • +
      • HTML: data-icon="list" or data-icon="list" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(menu)) or @include icon(glyph(menu), 24, "outline")
        • +
      • HTML: data-icon="menu" or data-icon="menu" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(more-horizontal)) or @include icon(glyph(more-horizontal), 24, "outline")
        • +
      • HTML: data-icon="more-horizontal" or data-icon="more-horizontal" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(more-vertical)) or @include icon(glyph(more-vertical), 24, "outline")
        • +
      • HTML: data-icon="more-vertical" or data-icon="more-vertical" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(refresh)) or @include icon(glyph(refresh), 24, "outline")
        • +
      • HTML: data-icon="refresh" or data-icon="refresh" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Notification + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(error)) or @include icon(glyph(error), 24, "outline")
        • +
      • HTML: data-icon="error" or data-icon="error" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(notify)) or @include icon(glyph(notify), 24, "outline")
        • +
      • HTML: data-icon="notify" or data-icon="notify" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(notify-cutoff)) or @include icon(glyph(notify-cutoff), 24, "outline")
        • +
      • HTML: data-icon="notify-cutoff" or data-icon="notify-cutoff" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning)) or @include icon(glyph(warning), 24, "outline")
        • +
      • HTML: data-icon="warning" or data-icon="warning" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Seat + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(aisle)) or @include icon(glyph(aisle), 24, "outline")
        • +
      • HTML: data-icon="aisle" or data-icon="aisle" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(aisle-not-available)) or @include icon(glyph(aisle-not-available), 24, "outline")
        • +
      • HTML: data-icon="aisle-not-available" or data-icon="aisle-not-available" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bed)) or @include icon(glyph(bed), 24, "outline")
        • +
      • HTML: data-icon="bed" or data-icon="bed" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(childrens-compartment)) or @include icon(glyph(childrens-compartment), 24, "outline")
        • +
      • HTML: data-icon="childrens-compartment" or data-icon="childrens-compartment" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(elderly)) or @include icon(glyph(elderly), 24, "outline")
        • +
      • HTML: data-icon="elderly" or data-icon="elderly" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handicapped)) or @include icon(glyph(handicapped), 24, "outline")
        • +
      • HTML: data-icon="handicapped" or data-icon="handicapped" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parent-child-compartment)) or @include icon(glyph(parent-child-compartment), 24, "outline")
        • +
      • HTML: data-icon="parent-child-compartment" or data-icon="parent-child-compartment" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(priority)) or @include icon(glyph(priority), 24, "outline")
        • +
      • HTML: data-icon="priority" or data-icon="priority" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(quiet-zone)) or @include icon(glyph(quiet-zone), 24, "outline")
        • +
      • HTML: data-icon="quiet-zone" or data-icon="quiet-zone" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(table)) or @include icon(glyph(table), 24, "outline")
        • +
      • HTML: data-icon="table" or data-icon="table" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(window)) or @include icon(glyph(window), 24, "outline")
        • +
      • HTML: data-icon="window" or data-icon="window" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Ticket + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus)) or @include icon(glyph(bahnbonus), 24, "outline")
        • +
      • HTML: data-icon="bahnbonus" or data-icon="bahnbonus" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus-card)) or @include icon(glyph(bahnbonus-card), 24, "outline")
        • +
      • HTML: data-icon="bahnbonus-card" or data-icon="bahnbonus-card" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahncard)) or @include icon(glyph(bahncard), 24, "outline")
        • +
      • HTML: data-icon="bahncard" or data-icon="bahncard" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(best-price)) or @include icon(glyph(best-price), 24, "outline")
        • +
      • HTML: data-icon="best-price" or data-icon="best-price" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(commuter-ticket)) or @include icon(glyph(commuter-ticket), 24, "outline")
        • +
      • HTML: data-icon="commuter-ticket" or data-icon="commuter-ticket" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in)) or @include icon(glyph(komfort-check-in), 24, "outline")
        • +
      • HTML: data-icon="komfort-check-in" or data-icon="komfort-check-in" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in-check)) or @include icon(glyph(komfort-check-in-check), 24, "outline")
        • +
      • HTML: data-icon="komfort-check-in-check" or data-icon="komfort-check-in-check" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in-circle)) or @include icon(glyph(komfort-check-in-circle), 24, "outline")
        • +
      • HTML: data-icon="komfort-check-in-circle" or data-icon="komfort-check-in-circle" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-cards)) or @include icon(glyph(multiple-cards), 24, "outline")
        • +
      • HTML: data-icon="multiple-cards" or data-icon="multiple-cards" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-passenger)) or @include icon(glyph(multiple-passenger), 24, "outline")
        • +
      • HTML: data-icon="multiple-passenger" or data-icon="multiple-passenger" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(my-travel)) or @include icon(glyph(my-travel), 24, "outline")
        • +
      • HTML: data-icon="my-travel" or data-icon="my-travel" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(outward-journey)) or @include icon(glyph(outward-journey), 24, "outline")
        • +
      • HTML: data-icon="outward-journey" or data-icon="outward-journey" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(qr-code)) or @include icon(glyph(qr-code), 24, "outline")
        • +
      • HTML: data-icon="qr-code" or data-icon="qr-code" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(qr-code-scan)) or @include icon(glyph(qr-code-scan), 24, "outline")
        • +
      • HTML: data-icon="qr-code-scan" or data-icon="qr-code-scan" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(return-journey)) or @include icon(glyph(return-journey), 24, "outline")
        • +
      • HTML: data-icon="return-journey" or data-icon="return-journey" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket)) or @include icon(glyph(ticket), 24, "outline")
        • +
      • HTML: data-icon="ticket" or data-icon="ticket" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-discount)) or @include icon(glyph(ticket-discount), 24, "outline")
        • +
      • HTML: data-icon="ticket-discount" or data-icon="ticket-discount" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-multiple)) or @include icon(glyph(ticket-multiple), 24, "outline")
        • +
      • HTML: data-icon="ticket-multiple" or data-icon="ticket-multiple" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-subscription)) or @include icon(glyph(ticket-subscription), 24, "outline")
        • +
      • HTML: data-icon="ticket-subscription" or data-icon="ticket-subscription" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(time-outward-journey)) or @include icon(glyph(time-outward-journey), 24, "outline")
        • +
      • HTML: data-icon="time-outward-journey" or data-icon="time-outward-journey" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(time-return-journey)) or @include icon(glyph(time-return-journey), 24, "outline")
        • +
      • HTML: data-icon="time-return-journey" or data-icon="time-return-journey" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(timetable)) or @include icon(glyph(timetable), 24, "outline")
        • +
      • HTML: data-icon="timetable" or data-icon="timetable" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(travel-insurance)) or @include icon(glyph(travel-insurance), 24, "outline")
        • +
      • HTML: data-icon="travel-insurance" or data-icon="travel-insurance" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 24x24 - Outline - Transportation + + + + + +

    + + + +
    + +
    +
    + +
    +

    Please keep in mind that it's optional to set the variant and size for the following ones, as this size (24) and style (outline) combination is defined as the default.
    In case that you'll need another default in your project, you could overwrite the defaults by modifying the $icon-size and $icon-style SCSS variables.

    +
      +
    • +
        +
      • SCSS: @include icon(glyph(airplane)) or @include icon(glyph(airplane), 24, "outline")
        • +
      • HTML: data-icon="airplane" or data-icon="airplane" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle)) or @include icon(glyph(bicycle), 24, "outline")
        • +
      • HTML: data-icon="bicycle" or data-icon="bicycle" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle-trailer)) or @include icon(glyph(bicycle-trailer), 24, "outline")
        • +
      • HTML: data-icon="bicycle-trailer" or data-icon="bicycle-trailer" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(call-a-bike)) or @include icon(glyph(call-a-bike), 24, "outline")
        • +
      • HTML: data-icon="call-a-bike" or data-icon="call-a-bike" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car)) or @include icon(glyph(car), 24, "outline")
        • +
      • HTML: data-icon="car" or data-icon="car" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(carsharing)) or @include icon(glyph(carsharing), 24, "outline")
        • +
      • HTML: data-icon="carsharing" or data-icon="carsharing" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car-sequence)) or @include icon(glyph(car-sequence), 24, "outline")
        • +
      • HTML: data-icon="car-sequence" or data-icon="car-sequence" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-locomotive)) or @include icon(glyph(electric-locomotive), 24, "outline")
        • +
      • HTML: data-icon="electric-locomotive" or data-icon="electric-locomotive" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-scooter)) or @include icon(glyph(electric-scooter), 24, "outline")
        • +
      • HTML: data-icon="electric-scooter" or data-icon="electric-scooter" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-car)) or @include icon(glyph(ev-car), 24, "outline")
        • +
      • HTML: data-icon="ev-car" or data-icon="ev-car" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ferry)) or @include icon(glyph(ferry), 24, "outline")
        • +
      • HTML: data-icon="ferry" or data-icon="ferry" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handcart)) or @include icon(glyph(handcart), 24, "outline")
        • +
      • HTML: data-icon="handcart" or data-icon="handcart" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice)) or @include icon(glyph(ice), 24, "outline")
        • +
      • HTML: data-icon="ice" or data-icon="ice" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intercity-train)) or @include icon(glyph(intercity-train), 24, "outline")
        • +
      • HTML: data-icon="intercity-train" or data-icon="intercity-train" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice-side-view)) or @include icon(glyph(ice-side-view), 24, "outline")
        • +
      • HTML: data-icon="ice-side-view" or data-icon="ice-side-view" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-bus)) or @include icon(glyph(local-bus), 24, "outline")
        • +
      • HTML: data-icon="local-bus" or data-icon="local-bus" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(long-distance-bus)) or @include icon(glyph(long-distance-bus), 24, "outline")
        • +
      • HTML: data-icon="long-distance-bus" or data-icon="long-distance-bus" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-train)) or @include icon(glyph(local-train), 24, "outline")
        • +
      • HTML: data-icon="local-train" or data-icon="local-train" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(rail-and-fly)) or @include icon(glyph(rail-and-fly), 24, "outline")
        • +
      • HTML: data-icon="rail-and-fly" or data-icon="rail-and-fly" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(railroad-car)) or @include icon(glyph(railroad-car), 24, "outline")
        • +
      • HTML: data-icon="railroad-car" or data-icon="railroad-car" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(s-bahn)) or @include icon(glyph(s-bahn), 24, "outline")
        • +
      • HTML: data-icon="s-bahn" or data-icon="s-bahn" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(scooter)) or @include icon(glyph(scooter), 24, "outline")
        • +
      • HTML: data-icon="scooter" or data-icon="scooter" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sev)) or @include icon(glyph(sev), 24, "outline")
        • +
      • HTML: data-icon="sev" or data-icon="sev" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(speedboat)) or @include icon(glyph(speedboat), 24, "outline")
        • +
      • HTML: data-icon="speedboat" or data-icon="speedboat" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sprinter)) or @include icon(glyph(sprinter), 24, "outline")
        • +
      • HTML: data-icon="sprinter" or data-icon="sprinter" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subway)) or @include icon(glyph(subway), 24, "outline")
        • +
      • HTML: data-icon="subway" or data-icon="subway" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(taxi)) or @include icon(glyph(taxi), 24, "outline")
        • +
      • HTML: data-icon="taxi" or data-icon="taxi" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-and-car)) or @include icon(glyph(train-and-car), 24, "outline")
        • +
      • HTML: data-icon="train-and-car" or data-icon="train-and-car" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(tram)) or @include icon(glyph(tram), 24, "outline")
        • +
      • HTML: data-icon="tram" or data-icon="tram" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking)) or @include icon(glyph(walking), 24, "outline")
        • +
      • HTML: data-icon="walking" or data-icon="walking" data-icon-variant="24-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking-fast)) or @include icon(glyph(walking-fast), 24, "outline")
        • +
      • HTML: data-icon="walking-fast" or data-icon="walking-fast" data-icon-variant="24-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Filled - Action + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(add-circle), 32, "filled")
        • +
      • HTML: data-icon="add-circle" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert), 32, "filled")
        • +
      • HTML: data-icon="alert" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bookmark), 32, "filled")
        • +
      • HTML: data-icon="bookmark" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(camera), 32, "filled")
        • +
      • HTML: data-icon="camera" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(check-circle), 32, "filled")
        • +
      • HTML: data-icon="check-circle" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud), 32, "filled")
        • +
      • HTML: data-icon="cloud" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(heart), 32, "filled")
        • +
      • HTML: data-icon="heart" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help), 32, "filled")
        • +
      • HTML: data-icon="help" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info), 32, "filled")
        • +
      • HTML: data-icon="info" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pin), 32, "filled")
        • +
      • HTML: data-icon="pin" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(remove), 32, "filled")
        • +
      • HTML: data-icon="remove" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(star), 32, "filled")
        • +
      • HTML: data-icon="star" data-icon-variant="32-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Filled - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 32, "filled")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 32, "filled")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(microphone), 32, "filled")
        • +
      • HTML: data-icon="microphone" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 32, "filled")
        • +
      • HTML: data-icon="play" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 32, "filled")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 32, "filled")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 32, "filled")
        • +
      • HTML: data-icon="stop" data-icon-variant="32-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Filled - Maps + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(gps), 32, "filled")
        • +
      • HTML: data-icon="gps" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(gps-north), 32, "filled")
        • +
      • HTML: data-icon="gps-north" data-icon-variant="32-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Filled - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(cancel), 32, "filled")
        • +
      • HTML: data-icon="cancel" data-icon-variant="32-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Filled - Notification + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(error), 32, "filled")
        • +
      • HTML: data-icon="error" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning), 32, "filled")
        • +
      • HTML: data-icon="warning" data-icon-variant="32-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Filled - Transportation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(airplane), 32, "filled")
        • +
      • HTML: data-icon="airplane" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle), 32, "filled")
        • +
      • HTML: data-icon="bicycle" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle-trailer), 32, "filled")
        • +
      • HTML: data-icon="bicycle-trailer" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(call-a-bike), 32, "filled")
        • +
      • HTML: data-icon="call-a-bike" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car), 32, "filled")
        • +
      • HTML: data-icon="car" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(carsharing), 32, "filled")
        • +
      • HTML: data-icon="carsharing" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-locomotive), 32, "filled")
        • +
      • HTML: data-icon="electric-locomotive" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-scooter), 32, "filled")
        • +
      • HTML: data-icon="electric-scooter" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-car), 32, "filled")
        • +
      • HTML: data-icon="ev-car" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ferry), 32, "filled")
        • +
      • HTML: data-icon="ferry" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handcart), 32, "filled")
        • +
      • HTML: data-icon="handcart" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice), 32, "filled")
        • +
      • HTML: data-icon="ice" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intercity-train), 32, "filled")
        • +
      • HTML: data-icon="intercity-train" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-bus), 32, "filled")
        • +
      • HTML: data-icon="local-bus" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(long-distance-bus), 32, "filled")
        • +
      • HTML: data-icon="long-distance-bus" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-train), 32, "filled")
        • +
      • HTML: data-icon="local-train" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(s-bahn), 32, "filled")
        • +
      • HTML: data-icon="s-bahn" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(scooter), 32, "filled")
        • +
      • HTML: data-icon="scooter" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(speedboat), 32, "filled")
        • +
      • HTML: data-icon="speedboat" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subway), 32, "filled")
        • +
      • HTML: data-icon="subway" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(taxi), 32, "filled")
        • +
      • HTML: data-icon="taxi" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-and-car), 32, "filled")
        • +
      • HTML: data-icon="train-and-car" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(tram), 32, "filled")
        • +
      • HTML: data-icon="tram" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking), 32, "filled")
        • +
      • HTML: data-icon="walking" data-icon-variant="32-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking-fast), 32, "filled")
        • +
      • HTML: data-icon="walking-fast" data-icon-variant="32-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Action + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(account), 32, "outline")
        • +
      • HTML: data-icon="account" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add), 32, "outline")
        • +
      • HTML: data-icon="add" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-circle), 32, "outline")
        • +
      • HTML: data-icon="add-circle" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(add-link), 32, "outline")
        • +
      • HTML: data-icon="add-link" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alarm), 32, "outline")
        • +
      • HTML: data-icon="alarm" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alarm-add), 32, "outline")
        • +
      • HTML: data-icon="alarm-add" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert), 32, "outline")
        • +
      • HTML: data-icon="alert" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alert-off), 32, "outline")
        • +
      • HTML: data-icon="alert-off" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(attachment), 32, "outline")
        • +
      • HTML: data-icon="attachment" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(augmented-reality), 32, "outline")
        • +
      • HTML: data-icon="augmented-reality" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(block), 32, "outline")
        • +
      • HTML: data-icon="block" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bookmark), 32, "outline")
        • +
      • HTML: data-icon="bookmark" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bug), 32, "outline")
        • +
      • HTML: data-icon="bug" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(build), 32, "outline")
        • +
      • HTML: data-icon="build" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(calendar), 32, "outline")
        • +
      • HTML: data-icon="calendar" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(camera), 32, "outline")
        • +
      • HTML: data-icon="camera" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cash), 32, "outline")
        • +
      • HTML: data-icon="cash" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(check-circle), 32, "outline")
        • +
      • HTML: data-icon="check-circle" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud), 32, "outline")
        • +
      • HTML: data-icon="cloud" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud-download), 32, "outline")
        • +
      • HTML: data-icon="cloud-download" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cloud-upload), 32, "outline")
        • +
      • HTML: data-icon="cloud-upload" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(compass), 32, "outline")
        • +
      • HTML: data-icon="compass" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(copy), 32, "outline")
        • +
      • HTML: data-icon="copy" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(credit-card), 32, "outline")
        • +
      • HTML: data-icon="credit-card" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dashboard), 32, "outline")
        • +
      • HTML: data-icon="dashboard" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(delete), 32, "outline")
        • +
      • HTML: data-icon="delete" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(discount), 32, "outline")
        • +
      • HTML: data-icon="discount" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(document), 32, "outline")
        • +
      • HTML: data-icon="document" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(document-check), 32, "outline")
        • +
      • HTML: data-icon="document-check" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(done), 32, "outline")
        • +
      • HTML: data-icon="done" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(download), 32, "outline")
        • +
      • HTML: data-icon="download" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(drag-and-drop), 32, "outline")
        • +
      • HTML: data-icon="drag-and-drop" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(edit), 32, "outline")
        • +
      • HTML: data-icon="edit" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-delighted), 32, "outline")
        • +
      • HTML: data-icon="face-delighted" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-disappointed), 32, "outline")
        • +
      • HTML: data-icon="face-disappointed" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-neutral), 32, "outline")
        • +
      • HTML: data-icon="face-neutral" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-sad), 32, "outline")
        • +
      • HTML: data-icon="face-sad" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(face-smiling), 32, "outline")
        • +
      • HTML: data-icon="face-smiling" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(filter), 32, "outline")
        • +
      • HTML: data-icon="filter" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fingerprint), 32, "outline")
        • +
      • HTML: data-icon="fingerprint" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder), 32, "outline")
        • +
      • HTML: data-icon="folder" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(folder-open), 32, "outline")
        • +
      • HTML: data-icon="folder-open" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(generic-card), 32, "outline")
        • +
      • HTML: data-icon="generic-card" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(giftcard), 32, "outline")
        • +
      • HTML: data-icon="giftcard" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hearing), 32, "outline")
        • +
      • HTML: data-icon="hearing" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hearing-disabled), 32, "outline")
        • +
      • HTML: data-icon="hearing-disabled" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(heart), 32, "outline")
        • +
      • HTML: data-icon="heart" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(help), 32, "outline")
        • +
      • HTML: data-icon="help" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(image), 32, "outline")
        • +
      • HTML: data-icon="image" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(info), 32, "outline")
        • +
      • HTML: data-icon="info" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(key), 32, "outline")
        • +
      • HTML: data-icon="key" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(legal), 32, "outline")
        • +
      • HTML: data-icon="legal" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lightbulb), 32, "outline")
        • +
      • HTML: data-icon="lightbulb" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-close), 32, "outline")
        • +
      • HTML: data-icon="lock-close" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(lock-open), 32, "outline")
        • +
      • HTML: data-icon="lock-open" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(log-out), 32, "outline")
        • +
      • HTML: data-icon="log-out" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(logbook), 32, "outline")
        • +
      • HTML: data-icon="logbook" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(minus), 32, "outline")
        • +
      • HTML: data-icon="minus" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(piggybank), 32, "outline")
        • +
      • HTML: data-icon="piggybank" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pin), 32, "outline")
        • +
      • HTML: data-icon="pin" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(print), 32, "outline")
        • +
      • HTML: data-icon="print" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(push-button), 32, "outline")
        • +
      • HTML: data-icon="push-button" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(remove), 32, "outline")
        • +
      • HTML: data-icon="remove" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize), 32, "outline")
        • +
      • HTML: data-icon="resize" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(resize-handle-corner), 32, "outline")
        • +
      • HTML: data-icon="resize-handle-corner" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(save), 32, "outline")
        • +
      • HTML: data-icon="save" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(schedule), 32, "outline")
        • +
      • HTML: data-icon="schedule" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(search), 32, "outline")
        • +
      • HTML: data-icon="search" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(send), 32, "outline")
        • +
      • HTML: data-icon="send" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sepa), 32, "outline")
        • +
      • HTML: data-icon="sepa" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(settings), 32, "outline")
        • +
      • HTML: data-icon="settings" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share), 32, "outline")
        • +
      • HTML: data-icon="share" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-bag), 32, "outline")
        • +
      • HTML: data-icon="shopping-bag" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket), 32, "outline")
        • +
      • HTML: data-icon="shopping-basket" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-basket-disabled), 32, "outline")
        • +
      • HTML: data-icon="shopping-basket-disabled" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-cart), 32, "outline")
        • +
      • HTML: data-icon="shopping-cart" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shopping-cart-disabled), 32, "outline")
        • +
      • HTML: data-icon="shopping-cart-disabled" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sort-down), 32, "outline")
        • +
      • HTML: data-icon="sort-down" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sort-up), 32, "outline")
        • +
      • HTML: data-icon="sort-up" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(star), 32, "outline")
        • +
      • HTML: data-icon="star" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(swap-horizontal), 32, "outline")
        • +
      • HTML: data-icon="swap-horizontal" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(swap-vertical), 32, "outline")
        • +
      • HTML: data-icon="swap-vertical" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(thumb-up), 32, "outline")
        • +
      • HTML: data-icon="thumb-up" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(thumb-up-down), 32, "outline")
        • +
      • HTML: data-icon="thumb-up-down" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(translation), 32, "outline")
        • +
      • HTML: data-icon="translation" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(undo), 32, "outline")
        • +
      • HTML: data-icon="undo" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(upload), 32, "outline")
        • +
      • HTML: data-icon="upload" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(visibility), 32, "outline")
        • +
      • HTML: data-icon="visibility" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(visibility-off), 32, "outline")
        • +
      • HTML: data-icon="visibility-off" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(voucher), 32, "outline")
        • +
      • HTML: data-icon="voucher" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(website), 32, "outline")
        • +
      • HTML: data-icon="website" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(zoom-in), 32, "outline")
        • +
      • HTML: data-icon="zoom-in" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(zoom-out), 32, "outline")
        • +
      • HTML: data-icon="zoom-out" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 32, "outline")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-10), 32, "outline")
        • +
      • HTML: data-icon="fast-backward-10" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-30), 32, "outline")
        • +
      • HTML: data-icon="fast-backward-30" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward-empty), 32, "outline")
        • +
      • HTML: data-icon="fast-backward-empty" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 32, "outline")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-10), 32, "outline")
        • +
      • HTML: data-icon="fast-forward-10" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-30), 32, "outline")
        • +
      • HTML: data-icon="fast-forward-30" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward-empty), 32, "outline")
        • +
      • HTML: data-icon="fast-forward-empty" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(microphone), 32, "outline")
        • +
      • HTML: data-icon="microphone" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pause), 32, "outline")
        • +
      • HTML: data-icon="pause" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 32, "outline")
        • +
      • HTML: data-icon="play" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 32, "outline")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 32, "outline")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 32, "outline")
        • +
      • HTML: data-icon="stop" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subtitles), 32, "outline")
        • +
      • HTML: data-icon="subtitles" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-down), 32, "outline")
        • +
      • HTML: data-icon="volume-down" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-mute), 32, "outline")
        • +
      • HTML: data-icon="volume-mute" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-off), 32, "outline")
        • +
      • HTML: data-icon="volume-off" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(volume-up), 32, "outline")
        • +
      • HTML: data-icon="volume-up" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Brand + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(logo), 32, "outline")
        • +
      • HTML: data-icon="logo" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Communication + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(call), 32, "outline")
        • +
      • HTML: data-icon="call" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chat), 32, "outline")
        • +
      • HTML: data-icon="chat" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(conversation), 32, "outline")
        • +
      • HTML: data-icon="conversation" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fax), 32, "outline")
        • +
      • HTML: data-icon="fax" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(feedback), 32, "outline")
        • +
      • HTML: data-icon="feedback" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mail), 32, "outline")
        • +
      • HTML: data-icon="mail" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mobile-phone), 32, "outline")
        • +
      • HTML: data-icon="mobile-phone" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mobile-off), 32, "outline")
        • +
      • HTML: data-icon="mobile-off" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(question), 32, "outline")
        • +
      • HTML: data-icon="question" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(receive-item), 32, "outline")
        • +
      • HTML: data-icon="receive-item" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(share-item), 32, "outline")
        • +
      • HTML: data-icon="share-item" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wifi), 32, "outline")
        • +
      • HTML: data-icon="wifi" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wifi-off), 32, "outline")
        • +
      • HTML: data-icon="wifi-off" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Covid 19 + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(mask), 32, "outline")
        • +
      • HTML: data-icon="mask" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Facilities + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(playground), 32, "outline")
        • +
      • HTML: data-icon="playground" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(restricted-mobility-toilet), 32, "outline")
        • +
      • HTML: data-icon="restricted-mobility-toilet" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower), 32, "outline")
        • +
      • HTML: data-icon="shower" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower-men), 32, "outline")
        • +
      • HTML: data-icon="shower-men" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(shower-women), 32, "outline")
        • +
      • HTML: data-icon="shower-women" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sink), 32, "outline")
        • +
      • HTML: data-icon="sink" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc), 32, "outline")
        • +
      • HTML: data-icon="wc" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-men), 32, "outline")
        • +
      • HTML: data-icon="wc-men" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-sign), 32, "outline")
        • +
      • HTML: data-icon="wc-sign" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(wc-woman), 32, "outline")
        • +
      • HTML: data-icon="wc-woman" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Feature + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(air-condition), 32, "outline")
        • +
      • HTML: data-icon="air-condition" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(buggy), 32, "outline")
        • +
      • HTML: data-icon="buggy" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(clothing-hanger), 32, "outline")
        • +
      • HTML: data-icon="clothing-hanger" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(day), 32, "outline")
        • +
      • HTML: data-icon="day" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(dog), 32, "outline")
        • +
      • HTML: data-icon="dog" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(entry-aid), 32, "outline")
        • +
      • HTML: data-icon="entry-aid" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(environmental-mobility-check), 32, "outline")
        • +
      • HTML: data-icon="environmental-mobility-check" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(hydrogen), 32, "outline")
        • +
      • HTML: data-icon="hydrogen" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(luggage-compartment), 32, "outline")
        • +
      • HTML: data-icon="luggage-compartment" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(luggage-rack), 32, "outline")
        • +
      • HTML: data-icon="luggage-rack" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(marketplace), 32, "outline")
        • +
      • HTML: data-icon="marketplace" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(medical), 32, "outline")
        • +
      • HTML: data-icon="medical" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(night), 32, "outline")
        • +
      • HTML: data-icon="night" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(no-smoking), 32, "outline")
        • +
      • HTML: data-icon="no-smoking" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(person-with-cane), 32, "outline")
        • +
      • HTML: data-icon="person-with-cane" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(person-with-rollator), 32, "outline")
        • +
      • HTML: data-icon="person-with-rollator" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(platform), 32, "outline")
        • +
      • HTML: data-icon="platform" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(power-outlet), 32, "outline")
        • +
      • HTML: data-icon="power-outlet" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(reservation), 32, "outline")
        • +
      • HTML: data-icon="reservation" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(standing-room), 32, "outline")
        • +
      • HTML: data-icon="standing-room" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(steppless-entry), 32, "outline")
        • +
      • HTML: data-icon="steppless-entry" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(support-dog), 32, "outline")
        • +
      • HTML: data-icon="support-dog" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Food + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(breakfast), 32, "outline")
        • +
      • HTML: data-icon="breakfast" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(coffee-cup), 32, "outline")
        • +
      • HTML: data-icon="coffee-cup" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(drink), 32, "outline")
        • +
      • HTML: data-icon="drink" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(restaurant), 32, "outline")
        • +
      • HTML: data-icon="restaurant" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - IT + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(database), 32, "outline")
        • +
      • HTML: data-icon="database" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Journey + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(1st-class), 32, "outline")
        • +
      • HTML: data-icon="1st-class" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(2nd-class), 32, "outline")
        • +
      • HTML: data-icon="2nd-class" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(alternative-connection), 32, "outline")
        • +
      • HTML: data-icon="alternative-connection" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(booking), 32, "outline")
        • +
      • HTML: data-icon="booking" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator), 32, "outline")
        • +
      • HTML: data-icon="capacity-indicator" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-fully-booked), 32, "outline")
        • +
      • HTML: data-icon="capacity-indicator-fully-booked" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-high), 32, "outline")
        • +
      • HTML: data-icon="capacity-indicator-high" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(capacity-indicator-low), 32, "outline")
        • +
      • HTML: data-icon="capacity-indicator-low" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(destination), 32, "outline")
        • +
      • HTML: data-icon="destination" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intermediary-stop), 32, "outline")
        • +
      • HTML: data-icon="intermediary-stop" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(mixed-class), 32, "outline")
        • +
      • HTML: data-icon="mixed-class" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(round-trip), 32, "outline")
        • +
      • HTML: data-icon="round-trip" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(single-trip), 32, "outline")
        • +
      • HTML: data-icon="single-trip" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(start), 32, "outline")
        • +
      • HTML: data-icon="start" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Maps + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(gps), 32, "outline")
        • +
      • HTML: data-icon="gps" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(gps-north), 32, "outline")
        • +
      • HTML: data-icon="gps-north" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(home), 32, "outline")
        • +
      • HTML: data-icon="home" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(map), 32, "outline")
        • +
      • HTML: data-icon="map" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-straight), 32, "outline")
        • +
      • HTML: data-icon="navigation-straight" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-to-left), 32, "outline")
        • +
      • HTML: data-icon="navigation-to-left" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-to-right), 32, "outline")
        • +
      • HTML: data-icon="navigation-to-right" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(navigation-u-turn), 32, "outline")
        • +
      • HTML: data-icon="navigation-u-turn" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parking), 32, "outline")
        • +
      • HTML: data-icon="parking" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(place), 32, "outline")
        • +
      • HTML: data-icon="place" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(set-position), 32, "outline")
        • +
      • HTML: data-icon="set-position" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(station), 32, "outline")
        • +
      • HTML: data-icon="station" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop-sign), 32, "outline")
        • +
      • HTML: data-icon="stop-sign" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-station), 32, "outline")
        • +
      • HTML: data-icon="train-station" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(arrow-back), 32, "outline")
        • +
      • HTML: data-icon="arrow-back" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-down), 32, "outline")
        • +
      • HTML: data-icon="arrow-down" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-forward), 32, "outline")
        • +
      • HTML: data-icon="arrow-forward" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(arrow-up), 32, "outline")
        • +
      • HTML: data-icon="arrow-up" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(cancel), 32, "outline")
        • +
      • HTML: data-icon="cancel" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-left), 32, "outline")
        • +
      • HTML: data-icon="chevron-left" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(chevron-right), 32, "outline")
        • +
      • HTML: data-icon="chevron-right" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(close), 32, "outline")
        • +
      • HTML: data-icon="close" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-less), 32, "outline")
        • +
      • HTML: data-icon="expand-less" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(expand-more), 32, "outline")
        • +
      • HTML: data-icon="expand-more" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fullscreen), 32, "outline")
        • +
      • HTML: data-icon="fullscreen" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fullscreen-exit), 32, "outline")
        • +
      • HTML: data-icon="fullscreen-exit" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(grid-view), 32, "outline")
        • +
      • HTML: data-icon="grid-view" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(link), 32, "outline")
        • +
      • HTML: data-icon="link" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(link-external), 32, "outline")
        • +
      • HTML: data-icon="link-external" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(list), 32, "outline")
        • +
      • HTML: data-icon="list" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(menu), 32, "outline")
        • +
      • HTML: data-icon="menu" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(more-horizontal), 32, "outline")
        • +
      • HTML: data-icon="more-horizontal" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(more-vertical), 32, "outline")
        • +
      • HTML: data-icon="more-vertical" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(refresh), 32, "outline")
        • +
      • HTML: data-icon="refresh" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Notification + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(error), 32, "outline")
        • +
      • HTML: data-icon="error" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(notify), 32, "outline")
        • +
      • HTML: data-icon="notify" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(notify-cutoff), 32, "outline")
        • +
      • HTML: data-icon="notify-cutoff" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(warning), 32, "outline")
        • +
      • HTML: data-icon="warning" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Seat + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(aisle), 32, "outline")
        • +
      • HTML: data-icon="aisle" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(aisle-not-available), 32, "outline")
        • +
      • HTML: data-icon="aisle-not-available" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bed), 32, "outline")
        • +
      • HTML: data-icon="bed" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(childrens-compartment), 32, "outline")
        • +
      • HTML: data-icon="childrens-compartment" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(elderly), 32, "outline")
        • +
      • HTML: data-icon="elderly" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handicapped), 32, "outline")
        • +
      • HTML: data-icon="handicapped" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(parent-child-compartment), 32, "outline")
        • +
      • HTML: data-icon="parent-child-compartment" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(priority), 32, "outline")
        • +
      • HTML: data-icon="priority" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(quiet-zone), 32, "outline")
        • +
      • HTML: data-icon="quiet-zone" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(table), 32, "outline")
        • +
      • HTML: data-icon="table" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(window), 32, "outline")
        • +
      • HTML: data-icon="window" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Ticket + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus-card), 32, "outline")
        • +
      • HTML: data-icon="bahnbonus-card" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahnbonus), 32, "outline")
        • +
      • HTML: data-icon="bahnbonus" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bahncard), 32, "outline")
        • +
      • HTML: data-icon="bahncard" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(best-price), 32, "outline")
        • +
      • HTML: data-icon="best-price" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(commuter-ticket), 32, "outline")
        • +
      • HTML: data-icon="commuter-ticket" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in-check), 32, "outline")
        • +
      • HTML: data-icon="komfort-check-in-check" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in-circle), 32, "outline")
        • +
      • HTML: data-icon="komfort-check-in-circle" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(komfort-check-in), 32, "outline")
        • +
      • HTML: data-icon="komfort-check-in" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-cards), 32, "outline")
        • +
      • HTML: data-icon="multiple-cards" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(multiple-passenger), 32, "outline")
        • +
      • HTML: data-icon="multiple-passenger" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(my-travel), 32, "outline")
        • +
      • HTML: data-icon="my-travel" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(outward-journey), 32, "outline")
        • +
      • HTML: data-icon="outward-journey" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(qr-code), 32, "outline")
        • +
      • HTML: data-icon="qr-code" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(qr-code-scan), 32, "outline")
        • +
      • HTML: data-icon="qr-code-scan" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(return-journey), 32, "outline")
        • +
      • HTML: data-icon="return-journey" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket), 32, "outline")
        • +
      • HTML: data-icon="ticket" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-discount), 32, "outline")
        • +
      • HTML: data-icon="ticket-discount" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-multiple), 32, "outline")
        • +
      • HTML: data-icon="ticket-multiple" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ticket-subscription), 32, "outline")
        • +
      • HTML: data-icon="ticket-subscription" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(time-outward-journey), 32, "outline")
        • +
      • HTML: data-icon="time-outward-journey" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(time-return-journey), 32, "outline")
        • +
      • HTML: data-icon="time-return-journey" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(timetable), 32, "outline")
        • +
      • HTML: data-icon="timetable" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(travel-insurance), 32, "outline")
        • +
      • HTML: data-icon="travel-insurance" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 32x32 - Outline - Transportation + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(airplane), 32, "outline")
        • +
      • HTML: data-icon="airplane" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle), 32, "outline")
        • +
      • HTML: data-icon="bicycle" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(bicycle-trailer), 32, "outline")
        • +
      • HTML: data-icon="bicycle-trailer" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(call-a-bike), 32, "outline")
        • +
      • HTML: data-icon="call-a-bike" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car), 32, "outline")
        • +
      • HTML: data-icon="car" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(carsharing), 32, "outline")
        • +
      • HTML: data-icon="carsharing" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(car-sequence), 32, "outline")
        • +
      • HTML: data-icon="car-sequence" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-locomotive), 32, "outline")
        • +
      • HTML: data-icon="electric-locomotive" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(electric-scooter), 32, "outline")
        • +
      • HTML: data-icon="electric-scooter" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ev-car), 32, "outline")
        • +
      • HTML: data-icon="ev-car" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ferry), 32, "outline")
        • +
      • HTML: data-icon="ferry" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(handcart), 32, "outline")
        • +
      • HTML: data-icon="handcart" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice), 32, "outline")
        • +
      • HTML: data-icon="ice" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(intercity-train), 32, "outline")
        • +
      • HTML: data-icon="intercity-train" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(ice-side-view), 32, "outline")
        • +
      • HTML: data-icon="ice-side-view" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-bus), 32, "outline")
        • +
      • HTML: data-icon="local-bus" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(long-distance-bus), 32, "outline")
        • +
      • HTML: data-icon="long-distance-bus" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(local-train), 32, "outline")
        • +
      • HTML: data-icon="local-train" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(rail-and-fly), 32, "outline")
        • +
      • HTML: data-icon="rail-and-fly" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(railroad-car), 32, "outline")
        • +
      • HTML: data-icon="railroad-car" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(s-bahn), 32, "outline")
        • +
      • HTML: data-icon="s-bahn" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(scooter), 32, "outline")
        • +
      • HTML: data-icon="scooter" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sev), 32, "outline")
        • +
      • HTML: data-icon="sev" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(speedboat), 32, "outline")
        • +
      • HTML: data-icon="speedboat" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(sprinter), 32, "outline")
        • +
      • HTML: data-icon="sprinter" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(subway), 32, "outline")
        • +
      • HTML: data-icon="subway" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(taxi), 32, "outline")
        • +
      • HTML: data-icon="taxi" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(train-and-car), 32, "outline")
        • +
      • HTML: data-icon="train-and-car" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(tram), 32, "outline")
        • +
      • HTML: data-icon="tram" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking), 32, "outline")
        • +
      • HTML: data-icon="walking" data-icon-variant="32-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(walking-fast), 32, "outline")
        • +
      • HTML: data-icon="walking-fast" data-icon-variant="32-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 48x48 - Filled - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 48, "filled")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="48-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 48, "filled")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="48-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 48, "filled")
        • +
      • HTML: data-icon="play" data-icon-variant="48-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 48, "filled")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="48-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 48, "filled")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="48-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 48, "filled")
        • +
      • HTML: data-icon="stop" data-icon-variant="48-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 48x48 - Outline - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 48, "outline")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="48-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 48, "outline")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="48-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pause), 48, "outline")
        • +
      • HTML: data-icon="pause" data-icon-variant="48-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 48, "outline")
        • +
      • HTML: data-icon="play" data-icon-variant="48-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 48, "outline")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="48-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 48, "outline")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="48-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 48, "outline")
        • +
      • HTML: data-icon="stop" data-icon-variant="48-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 48x48 - Outline - Brand + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(logo), 48, "outline")
        • +
      • HTML: data-icon="logo" data-icon-variant="48-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 64x64 - Filled - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 64, "filled")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="64-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 64, "filled")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="64-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 64, "filled")
        • +
      • HTML: data-icon="play" data-icon-variant="64-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 64, "filled")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="64-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 64, "filled")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="64-filled"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 64, "filled")
        • +
      • HTML: data-icon="stop" data-icon-variant="64-filled"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 64x64 - Outline - AV + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(fast-backward), 64, "outline")
        • +
      • HTML: data-icon="fast-backward" data-icon-variant="64-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(fast-forward), 64, "outline")
        • +
      • HTML: data-icon="fast-forward" data-icon-variant="64-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(pause), 64, "outline")
        • +
      • HTML: data-icon="pause" data-icon-variant="64-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(play), 64, "outline")
        • +
      • HTML: data-icon="play" data-icon-variant="64-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-backward), 64, "outline")
        • +
      • HTML: data-icon="skip-backward" data-icon-variant="64-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(skip-forward), 64, "outline")
        • +
      • HTML: data-icon="skip-forward" data-icon-variant="64-outline"
        • +
      +
      • +
    • +
        +
      • SCSS: @include icon(glyph(stop), 64, "outline")
        • +
      • HTML: data-icon="stop" data-icon-variant="64-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + DB Icons 64x64 - Outline - Brand + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • +
        +
      • SCSS: @include icon(glyph(logo), 64, "outline")
        • +
      • HTML: data-icon="logo" data-icon-variant="64-outline"
        • +
      +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Illustration Icons + + + + +

    + + + +
    + +
    +
    + +
    + +
    Action
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Communication
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Covid 19
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Devices
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Entertainment
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Feature
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Food /db_ic_il_ Drink
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Maps
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    News
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Station
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Ticket
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Transportation
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Travel
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    Weather
    +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
    • +
        +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      • + +
        • +
      +
      • +
    + +
    + + + +
    +
    + +

    + Type +

    + +
    +

    We're delivering general font declarations and the web fonts for our generally used DB Screen Sans font.

    +

    In case that you need to use font sizes smaller than 16pt please switch to our font-family DB Screen Sans Digital Regular for better readability / accessibility.

    +

    Please find this rule and a lot of further information regarding and more information on typography: https://marketingportal.extranet.deutschebahn.com/marketingportal/Marke-und-Design/Basiselemente/Typografie/Fuer-digitale-Anwendungen

    + +
    + +
    +
    + +
    + +

    + + + Fonts + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +

    Headline 1

    + +

    Headline 2

    + +

    Headline 3

    + +

    Headline 4

    +

    Primary font: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

    +

    Primary font italic: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

    +

    Primary font bold: "DB Screen Sans", "Helvetica", "Arial", sans-serif;

    + +
    + +
    + + + +
    +
    + +
    + +

    + + + Highlight Colors 1st Priority + + + + +

    + + + +
    + +
    +
    + +
    +
    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Highlight Colors 2nd Priority + + + + +

    + + + +
    + +
    +
    + +
    +
    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Highlight Colors Neutral + + + + +

    + + + +
    + +
    +
    + +
    +
    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Highlight Colors Positive + + + + +

    + + + +
    + +
    +
    + +
    +
    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +

    Body: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

    +
    + +
    + + + +
    +
    + +

    + Elements +

    + +
    + +
    + +
    +
    + +

    + Buttons +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    SCSS (recommended)

    +

    Extend one of the variant placeholders: %variant-primary, %variant-secondary or %variant-tertiary

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute.

    +

    Size

    +

    SCSS (recommended)

    +

    Extend one of the size SCSS placeholders in case that you don't want the default (regular): %size-Small or %size-Large

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    +

    Usability

    +
    +

    Buttons should be used in situations where users might need to:

    +
      +
    • submit a form
      • +
    • begin a new task
      • +
    • trigger a new UI element to appear on the page
      • +
    • specify a new or next step in a process
      • +
    +
    +

    Button vs. Link

    +
    +

    The HTML elements for buttons and links describe a very specific type of action that is going to be taken when they are used. It is important you know when to use which, as the distinction matters:

    +
      +
    • Use a link when you’re navigating to another place, such as: a "view all" page, "Jane Chen" profile, a page "skip link" etc.
      • +
    • Use buttons when you are performing an action, such as: "submit," "merge," "create new," "upload," etc.
      • +
    • An action is almost always on the same page
      • +
    +
    +

    Source: https://www.lightningdesignsystem.com/components/buttons/#About-Buttons

    +

    Further argumentations:

    + +

    "Hand" cursor / pointer

    +

    We don't use the "hand" cursor / pointer for our buttons, as this is reserved for links even only; for more information have a look at articles like https://medium.com/simple-human/buttons-shouldnt-have-a-hand-cursor-b11e99ca374b and https://hiddedevries.nl/en/blog/2016-08-06-some-pointers-on-default-cursors or people who thought this through like https://ux.stackexchange.com/questions/105024/why-dont-button-html-elements-have-a-css-cursor-pointer-by-default#105027 or https://github.com/necolas/normalize.css/issues/371#issuecomment-60072171 and the UI guidelines from Apple, Microsoft, Google, etc.

    +

    Microsoft’s design guides talk about weak affordance:

    +
    +

    Text and graphics links use a hand […] pointer […] because of their weak affordance. While links may have other visual clues to indicate that they are links (such as underlines and special placement), displaying the hand pointer on hover is the definitive indication of a link. To avoid confusion, it is imperative not to use the hand pointer for other purposes. For example, command buttons already have a strong affordance, so they don’t need a hand pointer. The hand pointer must mean “this target is a link” and nothing else.

    +
    +

    Apple’s Human Interface Guidelines states that the hand cursor should be used when “the content is a URL link”.

    +

    W3C User Interface guidelines says the same thing again with “The cursor is a pointer that indicates a link”.

    +

    Disabled button state

    +

    The disabled state of the button is defined by a change in opacity for good reasons:

    +
    +

    A transparent button blends into the background more, while a gray one remains in the foreground (unless the background is gray). Foreground elements are more noticeable to users. They tend to view them as interactive, which means they’re more likely to interact with a grayed out disabled button.

    +
    +

    For much more information visit https://uxmovement.com/buttons/why-you-shouldnt-gray-out-disabled-buttons/.

    +

    In general disabling buttons is a controversial topic in UX Design, and should get only used well-considered; compare to these articles on how to use disabled buttons only selectively: https://stories.justinewin.com/disabled-buttons-dont-have-to-suck-10da0bb6d37e, https://axesslab.com/disabled-buttons-suck/ and https://www.smashingmagazine.com/2021/08/frustrating-design-patterns-disabled-buttons/

    +

    Ambiguous labels

    +

    Please keep in mind to use unambiguous labels: https://ebay.gitbook.io/mindpatterns/antipatterns/ambiguous-label

    + +
    + +
    +
    + +
    + +

    + + + Button + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +
    + +

    + + + Button Brand Primary + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Primary + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Secondary Outline + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Secondary Solid + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Tertiary Plain + + + + +

    + + + +
    + +
    +
    + +
    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Button Sizes + + + + +

    + + + +
    + +
    +
    + +
    + +

    Small

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Regular (default, data-size attribute is optional)

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +

    Large

    +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    + +
    + + + +
    +
    + +

    + Checkbox +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Checkbox + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - indeterminate + + + + + +

    + + + +
    + +
    +
    + +
    + + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox On Dark Background Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Checkbox - indeterminate on dark background + + + + + +

    + + + +
    + +
    +
    + +
    + + + + +
    + + + +
    +
    + +

    + Chips +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute. These could be either one of the four feedback values, or the "point of interest" stylings.

    + +
    + +
    +
    + +
    + +

    + + + Filter chips + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Selection chips + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Chips with icon + + + + +

    + + + +
    + +
    +
    + +
    +

    + + + +

    +

    + + + +

    +

    + + + +

    + +
    + + + +
    +
    + +
    + +

    + + + Chips – disabled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    POIs

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    +
    + +

    + Headline +

    + +
    +

    Pulse

    +

    You could add the DB Pulse to the headline element by adding the data-pulse attribute – we're taking care of sizing it accordingly to the DB logo if this one is also present on the same page, as defined by the rules on the Marketingportal regarding the logo and the pulse.

    + +
    + +
    +
    + +
    + +

    + + + Headline + + + + +

    + + + +
    + +
    +
    + +
    + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +
    + +

    + + + Headline Pulse + + + + +

    + + + +
    + +
    +
    + +
    + + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +

    + Image +

    + +
    +

    Responsive images: width, height and intrinsicsize

    +

    There has been some development the latest on the new proposed intrinsicsize attribute for images, that ended with the existing and well known attributes width and height will get used to compute that intrinsicsize directly via UA-stylesheets - so the responsive images and aspect-ratio comes without any costs and leads to that it even makes more sense than ever to fill out those attributes with the basic size of your image in the first place.

    +

    For more information have a look at those articles and the standard/proposal:

    + +

    Image formats

    +

    JPEG (AVIF and WebP as progressive enhancement) for photographs etc

    +
    +

    Photographs typically fare well with lossy compression (depending on the encoder's configuration). This makes JPEG and WebP good choices for photographs, with JPEG being more compatible but WebP perhaps offering better compression. To maximize quality and minimize download time, consider providing both using a fallback with WebP as the first choice and JPEG as the second. Otherwise, JPEG is the safe choice for compatibility.

    +
    +

    Source: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#Photographs

    +

    Next to WebP you could experiment a little bit with the new image format AVIF that promises even lower file sizes than WebP and increases in browser support.

    +

    Additionally have a look at Googles product "Guetzli", that provides great JPEG compression rates as well: https://github.com/google/guetzli/

    +

    And another tool even also resulted in fine compression rates - the main difference in between the both of them is that JPEGMini isn't available for free anymore: https://www.jpegmini.com

    +

    Attention: PNG is even also often used for pictures, even though that the special capabilities of this format like partial transparency aren't being used. This leads to much huger filesizes in most cases, as the JPEG format is capable of much better compression rates than PNG in general, so you would have to check on this aspect individually and carefully.

    +

    Partialy transparent images

    +

    Regarding images that need to have some kind of full or partial transparency, you could use either GIF (full) or PNG (most likely PNG-24 for partial) transparency.

    +

    Or use SVG masks, as this beautiful concept shows: https://github.blog/2021-01-29-making-githubs-new-homepage-fast-and-performant/#serving-the-perfect-image

    +

    Diagrams, drawings, and charts

    +
    +

    For any image that can be represented using vector graphics, SVG is the best choice. Otherwise, you should use a lossless format like PNG. If you do choose a lossy format, such as JPEG or lossy WebP, carefully weigh the compression level to avoid causing text or other shapes to become fuzzy or unclear.

    +
    +

    Source: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types#Diagrams_drawings_and_charts

    +

    Further image compressions

    +

    On top of the possibilities mentioned above regarding image optimizations (Google Guetzli & JPEGMini) you could as well have a look at both ImageAlpha (for PNG) and ImageOptim (for all), both available for Mac and the first both both other GUI and command-line variants and the latter as well as a webservice. Another great online tool that works entirely in the browser and doesn't even need to process your data on their servers (due to WebAssembly and some other cool stuff) is https://squoosh.app. Nowadays they additionally provide a CLI version of their software and new cool image formats, check out their version 2: https://web.dev/squoosh-v2/

    +

    Some further information on this topic are provided on this page: https://dev.to/prototyp/optimizing-images-for-the-web-an-in-depth-guide-4j7d

    +

    Accessibility

    +

    Always provide a link text

    +
    +

    All links should have text that uniquely identifies the link target.

    +
    +

    Source: https://www.deque.com/blog/accessibility-strategies-for-your-content-team/#:~:text=Link Text

    +

    Alt text should communicate the main point

    +
    +

    The key is to describe what you want your audience to get out of the image rather than a simple description of what the image is.

    +
    +

    Source: https://www.deque.com/blog/accessibility-strategies-for-your-content-team/#:~:text=Images

    +

    Using captions

    +

    For using captions it's recommended to use the <figure> and <figcaption> HTML tags - but please be aware that you additionally need to enrich those via aria-labelledby or aria-describedby attributes to ensure that assistive technologies are recognizing the linkage of those tags on Windows. It's mainly important to decide whether the figcaption HTML tags content is meant as a description or a label to choose one of those aria-* attributes correctly.

    +
    +

    When using the down arrow, NVDA announced all the <img> elements in turn except for the ones with empty or missing alt attributes. These were just completely ignored by the screen reader. Using aria-labelledby overrode any alternate text, and using aria-describedby added the ‘description’ into the alternate text. It’s interesting to note that using aria-labelledby also brought images with missing or empty alternate text to the attention of NVDA.

    +
    +

    Source: https://www.hassellinclusion.com/blog/figure-figcaption-extended-alternate-text-screen-readers/

    + +
    + +
    +
    + +
    + +

    + + + Image + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - AVIF + + + + + +

    + + + +
    + +
    +
    + +
    + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Lazy loading + + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Responsive and pixel density + + + + + +

    + + + +
    + +
    +
    + +
    + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - Responsive mediaquery + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - WebP + + + + + +

    + + + +
    + +
    +
    + +
    + + + + DB Regio train at Munich mainstation + + + +
    + + + +
    +
    + +
    + +

    + + + Image - with caption + + + + + +

    + + + +
    + +
    +
    + +
    +
    + DB Regio train at Munich mainstation + +
    DB Regio train at Munich mainstation
    +
    + +
    + + + +
    +
    + +

    + Input +

    + +
    +

    label and input elements code structure

    +

    We're using the construct of label and input elements shown below (both their order and not nesting them, as a few other frameworks do) for two good reasons:

    +
      +
    • "Generally, explicit labels are better supported by assistive technology." - compare to the W3C spec, seems to be a WCAG criteria that for, too.
      • +
    • We could easily control the styling depending on the input elements (pseudo-)states w/o the need for JavaScript
      • +
    +

    Auto suggestions

    +

    You could easily integrate the possibility to provide auto suggestions to your input fields via the list-attribute on the input-HTML-elements as well as adding the suggestions via the datalist-HTML-element. Please follow up within the Input - Auto Suggestions section.

    +

    Autofill

    +

    For heavily supporting the user on autofilling form fields (not only, but especially on mobile browsing) with information even already available on their devices, you could use the autocomplete attribute, as described e.g. here https://cloudfour.com/thinks/autofill-what-web-devs-should-know-but-dont/

    +

    The attribute doesn't even only take boolean values, but even also a list of specific field types, as described in the specification: https://html.spec.whatwg.org/multipage/forms.html#inappropriate-for-the-control

    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    +

    Accessibility support

    +

    For our special construct (the order of the label and input HTML tags) we need to additionaly set some further attributes on those HTML tags to better support assistive tools (screenreaders like JAWS and VoiceOver); set the aria-labelledby-attribute on the input and related id on the label as well as aria-hidden="true", e.g. like this:

    +
    <input
+  type="text"
+  class="elm-input"
+  placeholder="Projekt Name"
+  name="input01"
+  id="input01"
+  aria-labelledby="input01-label"
+/>
+<label class="elm-label" for="input01" aria-hidden="true" id="input01-label"
+  >Textlabel</label
+>
+
    +

    We've conducted some tests with those assistive tools that lead to the conclusion that either the labels content hasn't been read out to the screenreader user on those form fields directly, but the labels content has been read again after the form field e.g. on VoiceOver. So those declarations are necessary for this kind of HTML construct, that is especially relevant for form validation and floating label functionality via CSS only.

    + +
    + +
    +
    + +
    + +

    + + + Input variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + + + + +
    +
    white:
    +
    + + + + +
    +
    solid:
    +
    + + + + +
    +
    outline:
    +
    + + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Input + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - Auto suggestions + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input with description + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - filled with a value + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - valid state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - invalid state (type in less than its minimum of 5 characters) + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + + +
    + + + +
    +
    + +
    + +

    + + + Input - disabled state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    + +
    + +
    + +

    + + + Input - search type - filled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    +
    + +
    + +

    + + + Input - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + +
    + + + +
    + + + +
    + +

    + Loading Indicator +

    + +
    +

    Progress spinners (loading indicators) show the user that a longer-lasting action is being carried out.
    +Progress/Loading Indicators are used when the application executes a server request or processes data in the frontend. The component is used as soon as the execution and the resulting delay are noticeable to the user. This keeps the user aware that his or her action is being executed.

    +

    Accessibility

    +

    SVGs are often conveyed inconsistently to assistive technologies. The component’s accessibility is also highly contextual. +For optimal user experience, use the aria-description prop to let assistive technology users know the purpose of the loading spinner.

    +

    aria-live and dynamic creation of html content

    +

    Using JavaScript (e.g. in context of frameworks like Angular, VueJS or React), it is possible to dynamically change parts of a page without requiring the entire page to reload — for instance, to update a list of search results on the fly, or to display a discreet alert or notification which does not require user interaction. While these changes are usually visually apparent to users who can see the page, they may not be obvious to users of assistive technologies. ARIA live regions fill this gap and provide a way to programmatically expose dynamic content changes in a way that can be announced by assistive technologies.

    +

    aria-live triggers screen readers when an element with aria-live (or text within an element with aria-live) is added or removed from the DOM. In contrast, when you unhide a hidden element, neither elements nor text are added or removed from the DOM, so the element's aria-live property doesn’t come into play.

    +

    Note that the live region needs to be present in the markup before the notification is generated or updated. If you dynamically generate both at the same time and inject them into the page, they will generally not be announced by assistive technologies.

    +

    You also need to adapt the role and aria-live level depending on the content. Further information can be found here https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions

    +

    Recommendations

    +

    Do

    +

    If the application is waiting for a process, it makes sense to display an indicator in a central location.

    +

    Don‘t

    +

    An indicator should not be used to visualize the application waiting for user input.

    + +
    + +
    +
    + +
    + +

    + + + Loading Indicator + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size S + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for s loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size XS + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for xs loading spinner + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size M + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size M + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size L + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size L + + + +
    + + + +
    +
    + +
    + +

    + + + Loading Indicator Size XL + + + + +

    + + + +
    + +
    +
    + +
    + + Example description for loading spinner size XL + + + +
    + + + +
    + + +
    + +
    + +

    + + + Logo On Backgrounds + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Logo Sizes + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +
    + +

    + + + Logo With Following Headline + + + + +

    + + + +
    + +
    +
    + +
    + + +

    Lorem ipsum dolores sint

    + +
    + + + +
    +
    + +

    + Progress +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Linear loader + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Linear spinner + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Linear spinner indeterminate + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + +
    + + + +
    +
    + +

    + Radio +

    + +
    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Radios + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Disabled Checked + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Invalid Attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radio - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Radios Required + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + +
    + + +
    + +
    + + + +
    +
    + +

    + Select +

    + +
    +

    This element doesn't fulfill the styleguides definitions especially on the option elements styling, as this isn't possible x-browser without JavaScript. +If you would like to even also match those visual requirements, you would need to choose a progressive JavaScript solution on your own.

    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Select + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Select Variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select Variations Disabled + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select Variations Optgroups + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + +
    +
    white:
    +
    + +
    +
    solid:
    +
    + +
    +
    outline:
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Select - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Select - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +

    + Tags +

    + +
    +

    Variations/configurability

    +

    Variant

    +

    HTML attribute

    +

    You could set the different button variants via the data-variant attribute. These could be either one of the four feedback values, or the "point of interest" stylings.

    +

    Size

    +

    SCSS (recommended)

    +

    Extend the size placeholder in case that you don't want the default (regular): %size-Small

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    + +
    + +
    +
    + +
    + +

    + + + Tags + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + +
    + + + +
    +
    + +
    + +

    + + + Tags Small + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + + +

    POIs

    + + Essen & Trinken + Einkaufen + Gesundheit + Kunst & Kultur + Wissenswertes + Freizeit + Zivile & reli. Einrichtungen + Dienstleistungen + DB Services & Einrichtung + Wegeleitung + +
    + + + +
    +
    + +
    + +

    + + + Tags With Icon + + + + +

    + + + +
    + +
    +
    + +
    + Default + Light + Informative + Success + Warning + Error + Gl. 10 + + +
    + + + +
    +
    + +

    + Textarea +

    + +
    +

    Form validation

    +

    Please have a look especially at the section for form validation within the overall components/forms page.

    +

    Additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute as well.

    + +
    + +
    +
    + +
    + +

    + + + Textarea variations + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    semitransparent:
    +
    + + + +
    +
    white:
    +
    + + + +
    +
    solid:
    +
    + + + +
    +
    outline:
    +
    + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Textarea + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea Disabled + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea with description + + + + +

    + + + +
    + +
    +
    + +
    + + + +

    Optionale Beschreibung
    Zeile zwei

    + +
    + + + +
    +
    + +
    + +

    + + + Textarea filled with a value + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - valid state + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - invalid state (type in less than its minimum of 5 characters) + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - Invalid state by HTML attribute + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +
    + +

    + + + Textarea - Hidden label + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + +
    + + + +
    +
    + +

    + Toggle +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Toggle + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle On + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Toggle On Disabled + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +

    + Components +

    + +
    + +
    + +
    +
    + +

    + Accordion +

    + +
    +

    Variations/configurability

    +

    Size

    +

    SCSS (recommended)

    +

    Extend one of the size SCSS placeholders in case that you don't want the default (regular): %size-Small or %size-Large

    +

    HTML attribute

    +

    You could set the different button sizes via the data-size attribute, the default is "regular" and in that case is optional.

    +

    Emphasis

    +

    The regular sized accordion could even also get enhanced to a higher emphasis.

    +

    SCSS (recommended)

    +

    Extend the related placeholder: %emphasis-High

    +

    HTML attribute

    +

    You could set the high emphasis via the data-emphasis attribute.

    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Accordion + + + + +

    + + + +
    + +
    +
    + +
    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Accordion High Emphasis + + + + +

    + + + +
    + +
    +
    + +
    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +
    + + + +
    +
    + +
    + +

    + + + Accordion Sizes + + + + +

    + + + +
    + +
    +
    + +
    + +

    Small

    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +

    Regular (default, data-size attribute is optional)

    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +

    Large

    +
    + Summary +

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    +
    + +
    + + + +
    +
    + +

    + Breadcrumb +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Breadcrumb + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +

    + Cards +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Cards Banner + + + + + +

    + + + +
    + +
    +
    + +
    +
      +
    • + +
      + +
      + +

      Angebote 01

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 02

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 03

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Angebote 04

      +

      Lorem ipsum dolores sint.

      +
      +
      + +
      • +
    + +
    + + + +
    +
    + +

    + Dialog +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Dialog + + + + + +

    + + + +
    + +
    +
    + +
    + Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + +
    + + + +
    +
    + +
    + +

    + + + Dialog Button Alignment End + + + + + +

    + + + +
    + +
    +
    + +
    + Dialog öffnen + + +
    + + +

    Modal

    + Close + +
    +
    +

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    +
    +
    + + +
    +     + +
    + + + +
    +
    + +

    + Dropdown +

    + +
    +

    This component is mainly meant to get used within the header section. If you're looking for a similar one within the content section, please refer to the overflow menu component.

    +

    Variation to display the overflow menu on the opposite side

    +

    This component expected to be placed at the end of the header regularly and thatfor opens the overlay to its opposite side (to the right on left-to-right reading direction). If you'd like to change this behaviour e.g. to implement some kind of a collision mechanism (most likely with JavaScript) and flip the overlays orientation to the opposite side, you could use the following attribute to configure this orientation change, compare to the examples below as well:

    +
    data-horizontal-position="opposite"
+
    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Dropdown + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Dropdown (within the header area) / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle user menus visibility + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +

    + Form +

    + +
    +

    General information

    +

    Forms in general are being built out of elements like form, input, textarea, button and fieldset.

    +

    For more information reach out to https://developer.mozilla.org/en-US/docs/Learn/Forms

    +

    Best practices

    +

    Best practice, research insights and examples: https://gerireid.com/forms.html

    +

    Form validation

    +

    It's best to use the built-in and standard form validation, as these are standards based API implementations, that are as well providing compatible and consistent states both for CSS and JS:

    +
      +
    • Interoperability
      • +
    • semantic (machine readable/understandable) state, even also keep a11y in mind
      • +
    • Single source of truth regarding the form (elements) state within the browser itself
      • +
    • Built-in localized validation messages
      • +
    +

    Additionally this way you're following the principles of Progressive Enhancement - and in other words, any JavaScript only solution doesn't provide a graceful degradation and puts that whole functionality to the weakest layer in the stack even only.

    +

    Nevertheless additionally to the browser built-in pseudo-selector :invalid we're providing styling for the aria-invalid="true" attribute on the elements input, radio, select and textarea. +We can't toggle any given/static attribute in the DB UI Core product itself, as we don't want to use JavaScript in this basic product. As you'd also need to add individual error messages, please find some inspiration on the necessary HTML code implementation e.g. on http://mars.dequecloud.com/demo/form-alert3.htm

    +

    Please find some more informations on the following pages:

    + +

    Accessibility

    +

    Forms can be tricky, so read through the W3C forms WAI tutorials for some guidance around how to implement accessibility successfully.

    + +
    + +
    +
    + +
    + +

    + + + Example Form + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Please choose a flavour + + +
    + + +
    + + +
    + +
    + +
    + + + +
    +
    + +

    + Language Switcher +

    + +
    +

    You could either use the language switcher component with hyperlinks, which would be the recommended way, to link to another language based page, which is addressable by a different URL.

    +

    The other way (especially for Single Page Applications) would be to use <button type="button"> elements, that have some JavaScript events attached to them to handle the switch directly. Please keep in mind to announce a change of contents e.g. to screenreaders in this case.

    +

    In both cases there's a slightly different HTML approach that you could inspect within the different examples below.

    +

    Please keep in mind that the styling is optimized to look good included within the header section of the page and doesn't "shine" included in here.

    + +
    + +
    +
    + +
    + +

    + + + Language switcher + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Language switcher with buttons + + + + + +

    + + + +
    + +
    +
    + +
    + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    + +
    + + + +
    +
    + +

    + Notifications +

    + +
    +

    Best practices

    +

    Best practice, research insights and examples: https://gerireid.com/forms.html#notifications

    +

    Accessibility

    +

    Notifications are intended to be small interruptions to your visitors or users, so to help those with screen readers and similar assistive technologies, you should wrap your notifications in an aria-live region. Changes to live regions (such as injecting/updating a notification component) are automatically announced by screen readers without needing to move the user’s focus or otherwise interrupt the user.

    +

    Additionally, if you'd like to update existing notifications incrementally, include aria-atomic="true" to ensure that the entire notification is always announced as a single (atomic) unit, rather than announcing what was changed (which could lead to problems if you only update part of the notification’s content, or if displaying the same notification content at a later point in time). It's still recommended to remove and add cmp-notification components as a whole within the section.

    +

    Note that the live region needs to be present in the markup before the notification is generated or updated. If you dynamically generate both at the same time and inject them into the page, they will generally not be announced by assistive technologies.

    +

    You also need to adapt the role and aria-live level depending on the content. If it’s an important message like an error, use role="alert" and aria-live="assertive", otherwise use role="status"and aria-live="polite" attributes.

    +

    Adapted from https://getbootstrap.com/docs/4.3/components/toasts/

    +

    And we're not using aria-relevant="additions", as the default behaviour is even already what we expect with the default (additions text), compare to e.g. https://medium.com/dev-channel/why-authors-should-avoid-aria-relevant-5d3164fab1e3 and https://github.com/w3c/aria/issues/712#issuecomment-529848465

    +

    Live regions

    +
    +

    Live regions are perceivable regions of a web page that are typically updated as a result of an external event when user focus may be elsewhere. These regions are not always updated as a result of a user interaction. This practice has become commonplace with the growing use of Ajax. Examples of live regions include a chat log, stock ticker, or a sport scoring section that updates periodically to reflect game statistics. Since these asynchronous areas are expected to update outside the user's area of focus, assistive technologies such as screen readers have either been unaware of their existence or unable to process them for the user. WAI-ARIA has provided a collection of properties that allow the author to identify these live regions and process them: aria-live, aria-relevant, aria-atomic, and aria-busy.

    +
    +

    Source: https://www.w3.org/TR/wai-aria/#terms

    +

    Conveying meaning to assistive technologies

    +
    +

    Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers. Ensure that information denoted by the color is either obvious from the content itself (e.g. the visible text), or is included through alternative means, such as additional visibly hidden text.

    +
    +

    Source: https://getbootstrap.com/docs/4.3/components/alerts/

    + +
    + +
    +
    + +
    + +

    + + + Notifications + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications Variants + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications Hovering + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + informative: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + success: Lorem ipsum dolor sit amet, consectetur adipisicing elit +
    +
    + +
    + + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications - Leading Icon + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    + +
    + +
    + + + +
    +
    + +
    + +

    + + + Notifications - Trailing Icon + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    + +
    + +
    + +
    + + + +
    +
    + +

    + Overflow Menu +

    + +
    +

    Variation to display the overflow menu on the opposite side

    +

    If you're either using this component at the very end of a main content part that will most likely always get displayed at the opposite viewport border or you'd like to implement some kind of a collision mechanism (most likely with JavaScript) and flip the overlays orientation to the opposite side (from regularly left to right positioned on left-to-right reading direction), you could use the following attribute to configure this orientation change, compare to the examples below as well:

    +
    data-horizontal-position="opposite"
+
    +

    JavaScript polyfill necessary for Microsoft Internet Explorer and Edge (older versions than 79)

    +

    In case you would need to support Microsoft Internet Explorer and/or Edge within your project setup, you'll need to polyfill (with e.g. details-element-polyfill, that is still included in our pages for demo purposes) the details and summary HTML tags due to their missing browser setup in those environments.

    + +
    + +
    +
    + +
    + +

    + + + Overflow menu + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu - Navigation + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + +
    + Toggle Overflow menu + +
  • +
    • +
  • +
    • +     +
    + +
    + + + +
    +
    + +
    + +

    + + + Overflow menu - Navigation / opposite position + + + + + +

    + + + +
    + +
    +
    + +
    + + + +
    + + + +
    +
    + +

    + Pagination +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Pagination + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +

    + Sidenavi +

    + +
    +

    Icons

    +

    The sidenavi pattern includes some general icons defined for some general rel values. Please feel free to define further by yourself depending on your needs, either within your SCSS code (recommended) or via attributes.

    + +
    + +
    +
    + +
    + +

    + + + Sidenavi + + + + + +

    + + + +
    + +
    +
    + +
    + + +
    + + + +
    +
    + +

    + Tab Bar +

    + +
    +

    Accessibility

    +

    This pattern has been tested and approved regarding accessibility.

    + +
    + +
    +
    + +
    + +

    + + + Tab Bar + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + +
    + Content 01 +
    + + +
    + Content 02 +
    + + +
    + Content 03 +
    + + +
    + Content 04 +
    + + +
    + Content 05 +
    +
    + +
    + + + +
    +
    + +

    + Table +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Table + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - alignment + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    center / middle:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    right / bottom:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01
    two lines    		Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01 - longer contentValue 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02 - longer content
    +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table - border around cells + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - border horizontal + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - density + + + + + +

    + + + +
    + +
    +
    + +
    +
    +
    small:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    regular:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    large:
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table - font size + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - icons + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table Overflow Menu + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 02 - 01Value 02 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 03 - 01Value 03 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 04 - 01Value 04 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    Value 05 - 01Value 05 - 02 +
    + + +
  • +
    • +
  • +
    • +     +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Table Row Title + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    Column headerThe table header 01The table header 02
    table headerValue 01 - 01Value 01 - 02
    table headerValue 02 - 01Value 02 - 02
    table headerValue 03 - 01Value 03 - 02
    table headerValue 04 - 01Value 04 - 02
    table headerValue 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - row zebra styling + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +
    + +

    + + + Table - sticky header + + + + + +

    + + + +
    + +
    +
    + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Table title +
    The table header 01The table header 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    Value 01 - 01Value 01 - 02
    Value 02 - 01Value 02 - 02
    Value 03 - 01Value 03 - 02
    Value 04 - 01Value 04 - 02
    Value 05 - 01Value 05 - 02
    + +
    + + + +
    +
    + +

    + Areas +

    + +
    + +
    + +
    + + + +
    + +

    + Grid +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Grid + + + + + +

    + + + +
    + +
    +
    + +
    + +
    +
    +

    First column

    +
    +
    + +
    +
    +

    First column

    +
    +
    +

    Second column

    +
    +
    + +
    +
    +

    First column

    +
    +
    +

    Second column

    +
    +
    +

    Third column

    +
    +
    + +
    +
    +

    First column

    +
    +
    +

    Second column

    +
    +
    +

    Third column

    +
    +
    +

    Fourth column

    +
    +
    + +
    +
    +

    First column

    +
    +
    +

    Second column

    +
    +
    +

    Third column

    +
    +
    +

    Fourth column

    +
    +
    +

    Fifth column

    +
    +
    + +
    +
    +

    First column

    +
    +
    +

    Second column

    +
    +
    +

    Third column

    +
    +
    +

    Fourth column

    +
    +
    +

    Fifth column

    +
    +
    +

    Sixth column

    +
    +
    + +
    + +
    +
    +

    First column / SCSS Placeholder: %is-four-fifths

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-three-quarters

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-two-thirds

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-three-fifths

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-half

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-two-fifths

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-one-third

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-one-quarter

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + +
    +
    +

    First column / SCSS Placeholder: %is-one-fifth

    +
    +
    +

    Auto

    +
    +
    +

    Auto

    +
    +
    + + +
    + + + +
    +
    + +

    + Header +

    + +
    + +
    + +
    +
    + +
    + +

    + + + Header + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + + + + + + + UI Core +
    + +
    + + + + + Login + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Header Loggedin + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + +
    + + + + + + + UI Core +
    + +
    + + + + + + +
    +
    + +
    + + + +
    +
    + +
    + +

    + + + Meta + + + + + +

    + + + +
    + +
    +
    + +
    +
    + + + + + Login + +
    + +
    + + + +
    +
    + +
    + +

    + + + Intro + + + + + +

    + + + +
    + +
    +
    + +
    +
    + +
    + + + + + +

    DB UI Core

    + + Apache 2.0 license badge + npm version + Based on DB UX Design System guidelines + +

    Personenverkehr und DB Systel führen ihre Design Systeme für Web in der Version 2.0 der Standard Web Components zusammen. Unser Ziel ist eine einheitliche Basis UX im Sinne der Modernen Ikone für Kunden und Mitarbeiteranwendungen. Um unser Design End 2 End von Konzeption über Design bis zur Implementierung konsistent zu halten, wird das DB UX Design System auch in Code von DB Systel und Reisendeninformation umgesetzt. Stay Tuned!

    + +
    +
    We’re not designing pages anymore. We’re designing systems of components.
    +
    Stephen Hay + +. + Quoted in a talk by Brad Frost + + at beyond tellerrand conference.
    +
    + +

    Mit DB UI Core bieten wir robuste HTML UI Komponenten, wiederverwendbare visuelle Styles und mächtige Werkzeuge, um + vor allem Mitarbeitende der Bereiche Entwicklung, Konzeption&Design und Content Pflege&Produktion dabei zu unterstützen, + allerbeste digitale Erlebnisse zu erstellen und zu betreiben.

    + +

    Damit unsere technischen Produkte einen möglichst großen Umfang an Nutzer:innen erreichen, + haben wir uns dazu entschlossen, die Majorität unserer Dokumentation in englischer Sprache zu verfassen, + die insbesondere im Bereich der technischen Entwicklung i.d.R. geläufig ist.

    +
    + +
    + +

    Core principals

    + +
      +
    • + +
      + +
      + +

      Consistent & Compliant

      +

      DB UI Core is based on the DB UX Design System, that are the guidelines for any Personenverkehr Customer and Deutsche Bahn Enterprise website and web applications.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Accessible

      +

      DB UI Core leverages semantic HTML, ARIA roles, states and properties to apply our styles wherever possible, thus enforcing correct, accessible markup. And we're quality checking this in partnership with the Team Digital Accessibility

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Declarative

      +

      DB UI Core uses declarative selectors instead of visual helpers to ensure our HTML class names and structure are human read- and understandable, lean, performant and so much easier to update.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Decoupled

      +

      DB UI Core is decoupled from the JavaScript layer, to implement the patterns in any Web Development technology context; and we're providing universal Web Components and native JS framework components with DB UI Elements as well.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Evergreen

      +

      As DB UX Design System evolves, so does DB UI Core, meaning apps only need to keep their DB UI Core package updated to ensure the latest look and feel.

      +
      +
      + +
      • +
    • + +
      + +
      + +

      Community driven

      +

      A platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback.

      +
      +
      + +
      • +
    +
    + +
    + +

    How to use

    +

    For using DB UI Core, you need to install it as a dependency to your project and then link it within your HTML / CSS.
    + Please have a look into the Docs / Get Started(docs) for detailed instructions.
    + In case that you're developing a JavaScript application, please have a look at DB UI Elements, that's based on DB UI Core and provides Web Components for easier integration into this tech context.

    + + +

    More information

    +

    Additionally we'll provide some more information over time regrading the whole ecosystem:

    + + +

    Give us your feedback!

    +

    This is only the beta version of our framework and we really want your feedback - either within the DB UI Channel by Web Dev Community in Microsoft Teams (only available DB internally) + +, or directly at db-ux-designsystem@deutschebahn.com + +.
    + We're particularly keen to add as many examples to the behaviours as possible, to further clarify them.

    + +

    Things to keep in mind

    + +

    Developed for and driven by the community

    +

    This is mainly a platform providing the space and technology for a common basis of curated components; their development is mainly driven by the community, adapted out of the work done in projects and through the huge amount of feedback that we're gaining out of the community. So please support us in any way possible, this is greatly appreciated!

    +
    +
    + + +
    + + + +
    + +
    + + +
    + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/version/v2.18.3/styleguide/images/pattern-lab-logo--on-dark.svg b/version/v2.18.3/styleguide/images/pattern-lab-logo--on-dark.svg new file mode 100644 index 0000000000..3c684ef3fb --- /dev/null +++ b/version/v2.18.3/styleguide/images/pattern-lab-logo--on-dark.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/version/v2.18.3/styleguide/images/pattern-lab-logo--on-light.svg b/version/v2.18.3/styleguide/images/pattern-lab-logo--on-light.svg new file mode 100644 index 0000000000..095fdf9cdd --- /dev/null +++ b/version/v2.18.3/styleguide/images/pattern-lab-logo--on-light.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-2c840af22bc0827abf9a.modern.js b/version/v2.18.3/styleguide/js/4-chunk-2c840af22bc0827abf9a.modern.js new file mode 100644 index 0000000000..38c5d5e80d --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-2c840af22bc0827abf9a.modern.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-2c840af22bc0827abf9a.modern.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{16:function(t){var e;e=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),s=n.n(i),r=n(370),a=n.n(r),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,s=t.target,r=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==s){if(!s||"object"!==c(s)||1!==s.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&s.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(s.hasAttribute("readonly")||s.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return r?h(r,{container:i}):s?"cut"===n?p(s):h(s,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),r}(s()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function s(t,e,n,i,s){var a=r.apply(this,arguments);return t.addEventListener(n,a,s),{destroy:function(){t.removeEventListener(n,a,s)}}}function r(t,e,n,s){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&s.call(t,n)}}t.exports=function(t,e,n,i,r){return"function"==typeof t.addEventListener?s.apply(null,arguments):"function"==typeof n?s.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return s(t,e,n,i,r)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),s=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return s(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),s=document.createRange();s.selectNodeContents(t),i.removeAllRanges(),i.addRange(s),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function s(){i.off(t,s),e.apply(n,arguments)}return s._=e,this.on(t,s,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,s=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple helpers");s.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(s.toString.call(t)===p)s.extend(this.partials,t);else{if(void 0===e)throw new r.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple decorators");s.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=s.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,s=/[&<>"'`=]/;function r(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):s(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return r(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var s=n(13).default,r=n(1).default;e.__esModule=!0;var a=n(5),o=r(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new o.default("Must pass iterator to #each");var n,r=e.fn,_=e.inverse,u=0,p="",l=void 0,h=void 0;function c(e,n,i){l&&(l.key=e,l.index=n,l.first=0===n,l.last=!!i,h&&(l.contextPath=h+e)),p+=r(t[e],{data:l,blockParams:a.blockParams([t[e],e],[h+e,null])})}if(e.data&&e.ids&&(h=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(l=a.createFrame(e.data)),t&&"object"==typeof t)if(a.isArray(t))for(var d=t.length;u=0?e:parseInt(t,10)}return t},log:function(t){if(t=s.lookupLevel(t),"undefined"!=typeof console&&s.lookupLevel(s.level)<=t){var e=s.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),r=1;r=u.LAST_COMPATIBLE_COMPILER_REVISION&&e<=u.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),s.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:s[s.length-(y||1)].first_line,last_line:s[s.length-1].last_line,first_column:s[s.length-(y||1)].first_column,last_column:s[s.length-1].last_column},l&&(w._$.range=[s[s.length-(y||1)].range[0],s[s.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,s)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),s=s.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),s.push(w._$),b=r[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var s=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[s[0],s[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,s;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var r=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((s=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=s.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:s?s[s.length-1].length-s[s.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,r[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function s(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(s(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(s(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(s(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=s(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=s(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var s=i(n(49));function r(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],s=t[e-2];return i?"ContentStatement"===i.type?(s||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],s=t[e+2];return i?"ContentStatement"===i.type?(s||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var s=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==s}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var s=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==s,i.leftStripped}}r.prototype=new s.default,r.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,s=0,r=i.length;s0)throw new s.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:r,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,s,r){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:s,loc:this.locInfo(r)}},e.prepareRawBlock=function(t,e,n,i){r(t,n),i=this.locInfo(i);var s={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:s,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&r(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new s.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return r(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var s=i(n(6));function r(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new s.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,s=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),s=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(s,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function s(){var i=n.parse(t,e),s=(new n.Compiler).compile(i,e),r=(new n.JavaScriptCompiler).compile(s,e,void 0,!0);return n.template(r)}function o(t,e){return i||(i=s()),i.call(this,t,e)}return o._setup=function(t){return i||(i=s()),i._setup(t)},o._child=function(t,e,n,r){return i||(i=s()),i._child(t,e,n,r)},o};var r=s(n(6)),a=n(5),o=s(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new r.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,s="SubExpression"===t.name.type;s&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",s,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,s=i.parts[0],r=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",s,r)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),s=t.path,a=s.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new r.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);s.strict=!0,s.falsy=!0,this.accept(s),this.opcode("invokeHelper",i.length,s.original,o.default.helpers.simpleId(s))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,s]}}}},function(t,e,n){"use strict";var i=n(13).default,s=n(1).default;e.__esModule=!0;var r=n(4),a=s(n(6)),o=n(5),_=s(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=r.COMPILER_REVISION;return[t,r.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var s=t.opcodes,r=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=s.length;_0&&(n+=", "+s.join(", "));var r=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++r+"="+t,i.children[0]="alias"+r)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,s=void 0,r=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(r?t.prepend(" + "):r=t,a=t):(r&&(s?r.prepend("buffer += "):i=!0,a.add(";"),r=a=void 0),s=!0,e||(n=!1))})),n?r?(r.prepend("return "),a.add(";")):s||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),r?(r.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var s=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[s++])),this.resolvePath("context",t,s,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,s){var r=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var s=e.popStack(),r=0,a=n.length;for(t&&a--;rthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(r);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",r=p[4],p[5]&&(_=u+p[5]),r=r.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(r)if(s){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,r=s(u+r,new l)}else{var h=e.whitespace_before;h&&(r=r.replace(new RegExp("\n("+h+")?","g"),"\n")),r=u+r.replace(/\n/g,"\n"+u)}o&&(r=r?o+r+"\n"+_:o+_),t.print_newline(!1),r&&(e.text=r,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var s=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,s){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&s.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var r=!1;r=(r=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(s.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==s.type,(n.is_content_unformatted||n.is_unformatted)&&(r=!1),r&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===s.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function s(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}s.prototype=new i,t.exports.Options=s},function(t,e,n){var i=n(9).Tokenizer,s=n(9).TOKEN,r=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:s.START,RAW:s.RAW,EOF:s.EOF},u=new r(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),s=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:s.starting_with(/{{!--/).until_after(/--}}/),handlebars:s.starting_with(/{{/).until_after(/}}/),handlebars_open:s.until(/[\n\r\t }]/),handlebars_raw_close:s.until(/}}/),comment:s.starting_with(//),cdata:s.starting_with(//),conditional_comment:s.starting_with(//),processing:s.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var r=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=s.matching(r).until_after(r)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,s="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var r=this._input.next();r+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,r)}else(s=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,s):this._create_token(_.ATTRIBUTE,s));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var s=e.opened.text.substr(1).toLowerCase();if("script"===s||"style"===s){var r=this._read_comment_or_cdata(t);if(r)return r.type=_.TEXT,r;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(s)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(18);r=n}();var a=r;i=[n,n(141),n(142)],s=function(t){var e=n(141),i=n(142);return{html_beautify:function(t,n){return a(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===s||(t.exports=s)}()},141:function(t,e){var n;!function(){var i;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,s=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new s}},function(t,e,n){var i=n(2).Output,s=n(3).Token,r=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new s(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&r.lineBreak.test(t||"")&&(e=t.match(r.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var s=t.comments_before.next();s;)this.handle_whitespace_and_comments(s,e),this.handle_token(s,e),s=t.comments_before.next();if(i)for(var r=0;r0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,s=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var r=0,a=null;this._flags.inline_frame=!0;do{if(r+=1,(a=this._tokens.peek(r-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(s||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var s=!0,r=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?s=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),s=!(this._output.just_added_newline()||b),this._output.space_before_token=s,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),s=!1;var v=this._tokens.peek();r=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),s=this._flags.last_token.type===p.START_BLOCK,r=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),s=!1,r=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(s=!0),this._flags.last_token.type===p.RESERVED?s=!0:this._flags.last_token.type===p.END_EXPR?s=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(s=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(r=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||s,this.print_token(t),this._output.space_before_token=r}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):r.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(r.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),s=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(s=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var s=this.__lines[i];if(s.is_empty())break;if(0!==s.item(0).indexOf(t)&&s.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",s="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",r="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])*";e.identifier=new RegExp(r+a,"g"),e.identifierStart=new RegExp(r),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,s=["before-newline","after-newline","preserve-newline"];function r(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var r=0;r>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){s.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new s)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,s=new i(t),r=null;for(;s.hasNext();)if((r=s.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=r[0]),"\\"===s.peek()){if(s.next(),"x"===s.peek())r=s.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==s.peek()){e+="\\",s.hasNext()&&(e+=s.next());continue}r=s.match(/u([0-9A-Fa-f]{4})/g)}if(!r)return t;if((n=parseInt(r[1],16))>126&&n<=255&&0===r[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+r[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,s=!1;this._input.hasNext()&&(i||s||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?s=!0:"]"===this._input.peek()&&(s=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var s=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),r=0===s.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===s||r&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,s;"'"===t?s=this.__patterns.single_quote:'"'===t?s=this.__patterns.double_quote:"`"===t?s=this.__patterns.template_text:"}"===t&&(s=this.__patterns.template_expression);for(var r=s.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),r+=a+=s.read()}return r},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,s=n(3).Token,r=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new r,this._reset();for(var e=new s(o.START,""),n=null,i=[],a=new r;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new r),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new s(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}r.prototype=new i,r.prototype._create=function(){return new r(this._input,this)},r.prototype._update=function(){this.__set_templated_pattern()},r.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},r.prototype.read_options=function(t){var e=this._create();for(var n in s)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},r.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},r.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},r.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},r.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=r}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(0);i=n}();var s=i;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},167:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var s=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],r=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},44:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof r?new r(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof r)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof r)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new r(h,g?s.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,s={value:n,prev:e,next:i};return e.next=s,i.prev=s,t.length++,s}function p(t,e,n){for(var i=e.next,s=0;s"+r.content+""},!t.document)return t.addEventListener?(s.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,r=n.code,a=n.immediateClose;t.postMessage(s.highlight(r,s.languages[i],i)),a&&t.close()}),!1),s):s;var l=s.util.currentScript();function h(){s.manual||s.highlightAll()}if(l&&(s.filename=l.src,l.hasAttribute("data-manual")&&(s.manual=!0)),!s.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return s}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},165:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},s={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:s,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:s})}(Prism)},164:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},170:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},161:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},163:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},168:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,s=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),r=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+s+r+"(?:"+s+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+s+r+")(?:"+s+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+s+")"+r+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+s+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},157:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,s,r){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(s,(function(t){if("function"==typeof r&&!r(t))return t;for(var s,o=a.length;-1!==n.code.indexOf(s=e(i,o));)++o;return a[o]=t,s})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var s=0,r=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=r.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=r[s],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++s;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},158:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var s={};s[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",s)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},166:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},159:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},162:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},169:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",s=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),r=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+s+"|"+r+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(r),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},45:function(t){!function(){if("undefined"!=typeof Prism){var e=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},n={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};i.prototype={setDefaults:function(t){this.defaults=e(this.defaults,t)},normalize:function(t,n){for(var i in n=e(this.defaults,n)){var s=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==s&&n[i]&&this[s]&&(t=this[s].call(this,t,n[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=i),Prism.plugins.NormalizeWhitespace=new i({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var e=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var i=t.element.parentNode;if(t.code&&i&&"pre"===i.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),n)if(Object.hasOwnProperty.call(n,s)){var r=n[s];if(i.hasAttribute("data-"+s))try{var a=JSON.parse(i.getAttribute("data-"+s)||"true");typeof a===r&&(t.settings[s]=a)}catch(d){}}for(var o=i.childNodes,_="",u="",p=!1,l=0;l{window.requestAnimationFrame((()=>{const p=Date.now(),l=Math.min(1,(p-r)/o);if(e===i)return u?u():null;!function(t,e){const n=a.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}(t,_(l)*(i-e)+e),l<1?n(e,i,s,r,o,_,u):u&&u()}))},i=function(t){const e=a.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}(t),s=function(t){const e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}},n="y";return t instanceof Window?e.window[n]:e.element[n]}(t);return new Promise((t=>{n(i,"number"==typeof e.top?e.top:i,s,Date.now(),e.duration,_(e.easing),t)}))}))}function r(t={}){return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=300),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}const a={getDocument(){return document}},o={linear(t){return t},"ease-in"(t){return t*t},"ease-out"(t){return t*(2-t)},"ease-in-out"(t){return t<.5?2*t*t:(4-2*t)*t-1}},_=t=>{const e=o[t||"linear"];if(!e){const e=Object.keys(o).join(",");throw new Error(`Scroll error: scroller does not support an easing option of "${t}". Supported options are ${e}`)}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-2c840af22bc0827abf9a.modern.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-2c840af22bc0827abf9a.modern.js.LICENSE.txt new file mode 100644 index 0000000000..353a9f05db --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-2c840af22bc0827abf9a.modern.js.LICENSE.txt @@ -0,0 +1,92 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-4f0103f33044e632a87a.js b/version/v2.18.3/styleguide/js/4-chunk-4f0103f33044e632a87a.js new file mode 100644 index 0000000000..95ba92095b --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-4f0103f33044e632a87a.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-4f0103f33044e632a87a.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{23:function(t,e,n){var i,r,s,a;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}t=n.nmd(t),a=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),r=n.n(i),s=n(370),a=n.n(s),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,r=t.target,s=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==r){if(!r||"object"!==c(r)||1!==r.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&r.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(r.hasAttribute("readonly")||r.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return s?h(s,{container:i}):r?"cut"===n?p(r):h(r,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),s}(r()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function r(t,e,n,i,r){var a=s.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function s(t,e,n,r){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&r.call(t,n)}}t.exports=function(t,e,n,i,s){return"function"==typeof t.addEventListener?r.apply(null,arguments):"function"==typeof n?r.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return r(t,e,n,i,s)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),r=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return r(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),r=document.createRange();r.selectNodeContents(t),i.removeAllRanges(),i.addRange(r),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function r(){i.off(t,r),e.apply(n,arguments)}return r._=e,this.on(t,r,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,r=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple helpers");r.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(r.toString.call(t)===p)r.extend(this.partials,t);else{if(void 0===e)throw new s.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple decorators");r.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=r.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,r=/[&<>"'`=]/;function s(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):r(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return s(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var r=n(13).default,s=n(1).default;e.__esModule=!0;var a=n(5),_=s(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new _.default("Must pass iterator to #each");var n,s=e.fn,u=e.inverse,p=0,l="",h=void 0,c=void 0;function d(e,n,i){h&&(h.key=e,h.index=n,h.first=0===n,h.last=!!i,c&&(h.contextPath=c+e)),l+=s(t[e],{data:h,blockParams:a.blockParams([t[e],e],[c+e,null])})}if(e.data&&e.ids&&(c=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(h=a.createFrame(e.data)),t&&"object"===o(t))if(a.isArray(t))for(var f=t.length;p=0?e:parseInt(t,10)}return t},log:function(t){if(t=r.lookupLevel(t),"undefined"!=typeof console&&r.lookupLevel(r.level)<=t){var e=r.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),s=1;s=p.LAST_COMPATIBLE_COMPILER_REVISION&&e<=p.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),r.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:r[r.length-(y||1)].first_line,last_line:r[r.length-1].last_line,first_column:r[r.length-(y||1)].first_column,last_column:r[r.length-1].last_column},l&&(w._$.range=[r[r.length-(y||1)].range[0],r[r.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,r)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),r=r.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),r.push(w._$),b=s[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var r=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[r[0],r[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,r;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var s=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((r=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=r.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:r?r[r.length-1].length-r[r.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,s[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function r(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(r(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(r(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(r(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=r(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=r(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var r=i(n(49));function s(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],r=t[e-2];return i?"ContentStatement"===i.type?(r||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],r=t[e+2];return i?"ContentStatement"===i.type?(r||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var r=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==r}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var r=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==r,i.leftStripped}}s.prototype=new r.default,s.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,r=0,s=i.length;r0)throw new r.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:s,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,r,s){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:r,loc:this.locInfo(s)}},e.prepareRawBlock=function(t,e,n,i){s(t,n),i=this.locInfo(i);var r={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:r,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&s(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new r.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return s(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var r=i(n(6));function s(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new r.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,r=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),r=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(r,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function r(){var i=n.parse(t,e),r=(new n.Compiler).compile(i,e),s=(new n.JavaScriptCompiler).compile(r,e,void 0,!0);return n.template(s)}function o(t,e){return i||(i=r()),i.call(this,t,e)}return o._setup=function(t){return i||(i=r()),i._setup(t)},o._child=function(t,e,n,s){return i||(i=r()),i._child(t,e,n,s)},o};var s=r(n(6)),a=n(5),o=r(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new s.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,r="SubExpression"===t.name.type;r&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",r,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,r=i.parts[0],s=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",r,s)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),r=t.path,a=r.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new s.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);r.strict=!0,r.falsy=!0,this.accept(r),this.opcode("invokeHelper",i.length,r.original,o.default.helpers.simpleId(r))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,r]}}}},function(t,e,n){"use strict";var i=n(13).default,r=n(1).default;e.__esModule=!0;var s=n(4),a=r(n(6)),o=n(5),_=r(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=s.COMPILER_REVISION;return[t,s.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var r=t.opcodes,s=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=r.length;_0&&(n+=", "+r.join(", "));var s=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++s+"="+t,i.children[0]="alias"+s)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,r=void 0,s=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(s?t.prepend(" + "):s=t,a=t):(s&&(r?s.prepend("buffer += "):i=!0,a.add(";"),s=a=void 0),r=!0,e||(n=!1))})),n?s?(s.prepend("return "),a.add(";")):r||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),s?(s.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var r=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[r++])),this.resolvePath("context",t,r,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,r){var s=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var r=e.popStack(),s=0,a=n.length;for(t&&a--;sthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(s);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",s=p[4],p[5]&&(_=u+p[5]),s=s.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(s)if(r){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,s=r(u+s,new l)}else{var h=e.whitespace_before;h&&(s=s.replace(new RegExp("\n("+h+")?","g"),"\n")),s=u+s.replace(/\n/g,"\n"+u)}o&&(s=s?o+s+"\n"+_:o+_),t.print_newline(!1),s&&(e.text=s,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var r=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,r){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&r.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var s=!1;s=(s=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(r.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==r.type,(n.is_content_unformatted||n.is_unformatted)&&(s=!1),s&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===r.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function r(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}r.prototype=new i,t.exports.Options=r},function(t,e,n){var i=n(9).Tokenizer,r=n(9).TOKEN,s=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:r.START,RAW:r.RAW,EOF:r.EOF},u=new s(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),r=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:r.starting_with(/{{!--/).until_after(/--}}/),handlebars:r.starting_with(/{{/).until_after(/}}/),handlebars_open:r.until(/[\n\r\t }]/),handlebars_raw_close:r.until(/}}/),comment:r.starting_with(//),cdata:r.starting_with(//),conditional_comment:r.starting_with(//),processing:r.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var s=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=r.matching(s).until_after(s)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,r="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var s=this._input.next();s+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,s)}else(r=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,r):this._create_token(_.ATTRIBUTE,r));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var r=e.opened.text.substr(1).toLowerCase();if("script"===r||"style"===r){var s=this._read_comment_or_cdata(t);if(s)return s.type=_.TEXT,s;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(r)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(18);a=n}();var o=a;i=[n,n(386),n(387)],r=function(t){var e=n(386),i=n(387);return{html_beautify:function(t,n){return o(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===r||(t.exports=r)}()},386:function(t,e){var n;function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}!function(){var r;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,r=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new r}},function(t,e,n){var i=n(2).Output,r=n(3).Token,s=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new r(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&s.lineBreak.test(t||"")&&(e=t.match(s.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var r=t.comments_before.next();r;)this.handle_whitespace_and_comments(r,e),this.handle_token(r,e),r=t.comments_before.next();if(i)for(var s=0;s0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,r=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var s=0,a=null;this._flags.inline_frame=!0;do{if(s+=1,(a=this._tokens.peek(s-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(r||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var r=!0,s=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?r=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),r=!(this._output.just_added_newline()||b),this._output.space_before_token=r,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),r=!1;var v=this._tokens.peek();s=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),r=this._flags.last_token.type===p.START_BLOCK,s=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),r=!1,s=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(r=!0),this._flags.last_token.type===p.RESERVED?r=!0:this._flags.last_token.type===p.END_EXPR?r=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(r=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(s=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||r,this.print_token(t),this._output.space_before_token=s}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):s.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(s.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),r=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(r=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var r=this.__lines[i];if(r.is_empty())break;if(0!==r.item(0).indexOf(t)&&r.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",r="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",s="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])*";e.identifier=new RegExp(s+a,"g"),e.identifierStart=new RegExp(s),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,r=["before-newline","after-newline","preserve-newline"];function s(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var s=0;s>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){r.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new r)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,r=new i(t),s=null;for(;r.hasNext();)if((s=r.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=s[0]),"\\"===r.peek()){if(r.next(),"x"===r.peek())s=r.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==r.peek()){e+="\\",r.hasNext()&&(e+=r.next());continue}s=r.match(/u([0-9A-Fa-f]{4})/g)}if(!s)return t;if((n=parseInt(s[1],16))>126&&n<=255&&0===s[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+s[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,r=!1;this._input.hasNext()&&(i||r||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?r=!0:"]"===this._input.peek()&&(r=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var r=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),s=0===r.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===r||s&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,r;"'"===t?r=this.__patterns.single_quote:'"'===t?r=this.__patterns.double_quote:"`"===t?r=this.__patterns.template_text:"}"===t&&(r=this.__patterns.template_expression);for(var s=r.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),s+=a+=r.read()}return s},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,r=n(3).Token,s=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new s,this._reset();for(var e=new r(o.START,""),n=null,i=[],a=new s;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new s),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new r(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}s.prototype=new i,s.prototype._create=function(){return new s(this._input,this)},s.prototype._update=function(){this.__set_templated_pattern()},s.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},s.prototype.read_options=function(t){var e=this._create();for(var n in r)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},s.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},s.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},s.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},s.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=s}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(0);r=n}();var s=r;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},406:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var r=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],s=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},171:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof s?new s(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof s)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof s)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new s(h,g?r.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,r={value:n,prev:e,next:i};return e.next=r,i.prev=r,t.length++,r}function p(t,e,n){for(var i=e.next,r=0;r"+s.content+""},!t.document)return t.addEventListener?(r.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,s=n.code,a=n.immediateClose;t.postMessage(r.highlight(s,r.languages[i],i)),a&&t.close()}),!1),r):r;var l=r.util.currentScript();function h(){r.manual||r.highlightAll()}if(l&&(r.filename=l.src,l.hasAttribute("data-manual")&&(r.manual=!0)),!r.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return r}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},404:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},r={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:r,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:r})}(Prism)},403:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},409:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},400:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},402:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},407:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,r=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),s=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+r+s+"(?:"+r+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+r+s+")(?:"+r+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+r+")"+s+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+r+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},396:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,r,s){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(r,(function(t){if("function"==typeof s&&!s(t))return t;for(var r,o=a.length;-1!==n.code.indexOf(r=e(i,o));)++o;return a[o]=t,r})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var r=0,s=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=s.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=s[r],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++r;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},397:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var r={};r[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",r)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},405:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},398:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},401:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},408:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",r=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),s=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+r+"|"+s+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(s),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},282:function(t){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},e(t)}!function(){if("undefined"!=typeof Prism){var n=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},i={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};r.prototype={setDefaults:function(t){this.defaults=n(this.defaults,t)},normalize:function(t,e){for(var i in e=n(this.defaults,e)){var r=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==r&&e[i]&&this[r]&&(t=this[r].call(this,t,e[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=r),Prism.plugins.NormalizeWhitespace=new r({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var n=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var r=t.element.parentNode;if(t.code&&r&&"pre"===r.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),i)if(Object.hasOwnProperty.call(i,s)){var a=i[s];if(r.hasAttribute("data-"+s))try{var o=JSON.parse(r.getAttribute("data-"+s)||"true");e(o)===a&&(t.settings[s]=o)}catch(f){}}for(var _=r.childNodes,u="",p="",l=!1,h=0;h<_.length;++h){var c=_[h];c==t.element?l=!0:"#text"===c.nodeName&&(l?p+=c.nodeValue:u+=c.nodeValue,r.removeChild(c),--h)}if(t.element.children.length&&Prism.plugins.KeepMarkup){var d=u+t.element.innerHTML+p;t.element.innerHTML=n.normalize(d,t.settings),t.code=t.element.textContent}else t.code=u+t.code+p,t.code=n.normalize(t.code,t.settings)}}else t.code=n.normalize(t.code,t.settings)}))}function r(t){this.defaults=n({},t)}function s(t){for(var e=0,n=0;n=0;--r){var s=this.tryEntries[r],a=s.completion;if("root"===s.tryLoc)return i("end");if(s.tryLoc<=this.prev){var o=n.call(s,"catchLoc"),_=n.call(s,"finallyLoc");if(o&&_){if(this.prev=0;--i){var r=this.tryEntries[i];if(r.tryLoc<=this.prev&&n.call(r,"finallyLoc")&&this.prev=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),O(n),c}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var i=n.completion;if("throw"===i.type){var r=i.arg;O(n)}return r}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,n){return this.delegate={iterator:A(t),resultName:e,nextLoc:n},"next"===this.method&&(this.arg=void 0),c}},t}function s(t,e,n,i){return new(n||(n=Promise))((function(r,s){function a(t){try{_(i.next(t))}catch(e){s(e)}}function o(t){try{_(i.throw(t))}catch(e){s(e)}}function _(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(a,o)}_((i=i.apply(t,e||[])).next())}))}n.d(e,{X5:function(){return o}});var a=300;function o(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(this,void 0,void 0,r().mark((function n(){var i,s,o;return r().wrap((function(n){for(;;)switch(n.prev=n.next){case 0:if(t instanceof Element||t instanceof Window){n.next=2;break}throw new Error("element passed to scrollTo() must be either the window or a DOM element, you passed ".concat(t,"!"));case 2:return e=u(e),i=function e(n,i,r,s){var o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:a,_=arguments.length>5?arguments[5]:void 0,u=arguments.length>6?arguments[6]:void 0;window.requestAnimationFrame((function(){var a=Date.now(),p=Math.min(1,(a-s)/o);if(n===i)return u?u():null;l(t,_(p)*(i-n)+n),p<1?e(n,i,r,s,o,_,u):u&&u()}))},s=p(t),o=_(t),n.abrupt("return",new Promise((function(t){i(s,"number"==typeof e.top?e.top:s,o,Date.now(),e.duration,d(e.easing),t)})));case 7:case"end":return n.stop()}}),n)})))}function _(t){var e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}};return t instanceof Window?e.window.y:e.element.y}function u(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=a),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}function p(t){var e=h.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}function l(t,e){var n=h.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}var h={getDocument:function(){return document}},c={linear:function(t){return t},"ease-in":function(t){return t*t},"ease-out":function(t){return t*(2-t)},"ease-in-out":function(t){return t<.5?2*t*t:(4-2*t)*t-1}},d=function(t){var e=c[t||"linear"];if(!e){var n=Object.keys(c).join(",");throw new Error('Scroll error: scroller does not support an easing option of "'.concat(t,'". Supported options are ').concat(n))}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-4f0103f33044e632a87a.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-4f0103f33044e632a87a.js.LICENSE.txt new file mode 100644 index 0000000000..f4f3f5d942 --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-4f0103f33044e632a87a.js.LICENSE.txt @@ -0,0 +1,94 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-530bd2dee358e8d9a1cc.modern.js b/version/v2.18.3/styleguide/js/4-chunk-530bd2dee358e8d9a1cc.modern.js new file mode 100644 index 0000000000..f5a0bf9e91 --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-530bd2dee358e8d9a1cc.modern.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-530bd2dee358e8d9a1cc.modern.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{15:function(t){var e;e=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),s=n.n(i),r=n(370),a=n.n(r),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,s=t.target,r=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==s){if(!s||"object"!==c(s)||1!==s.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&s.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(s.hasAttribute("readonly")||s.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return r?h(r,{container:i}):s?"cut"===n?p(s):h(s,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),r}(s()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function s(t,e,n,i,s){var a=r.apply(this,arguments);return t.addEventListener(n,a,s),{destroy:function(){t.removeEventListener(n,a,s)}}}function r(t,e,n,s){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&s.call(t,n)}}t.exports=function(t,e,n,i,r){return"function"==typeof t.addEventListener?s.apply(null,arguments):"function"==typeof n?s.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return s(t,e,n,i,r)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),s=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return s(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),s=document.createRange();s.selectNodeContents(t),i.removeAllRanges(),i.addRange(s),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function s(){i.off(t,s),e.apply(n,arguments)}return s._=e,this.on(t,s,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,s=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple helpers");s.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(s.toString.call(t)===p)s.extend(this.partials,t);else{if(void 0===e)throw new r.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple decorators");s.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=s.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,s=/[&<>"'`=]/;function r(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):s(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return r(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var s=n(13).default,r=n(1).default;e.__esModule=!0;var a=n(5),o=r(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new o.default("Must pass iterator to #each");var n,r=e.fn,_=e.inverse,u=0,p="",l=void 0,h=void 0;function c(e,n,i){l&&(l.key=e,l.index=n,l.first=0===n,l.last=!!i,h&&(l.contextPath=h+e)),p+=r(t[e],{data:l,blockParams:a.blockParams([t[e],e],[h+e,null])})}if(e.data&&e.ids&&(h=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(l=a.createFrame(e.data)),t&&"object"==typeof t)if(a.isArray(t))for(var d=t.length;u=0?e:parseInt(t,10)}return t},log:function(t){if(t=s.lookupLevel(t),"undefined"!=typeof console&&s.lookupLevel(s.level)<=t){var e=s.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),r=1;r=u.LAST_COMPATIBLE_COMPILER_REVISION&&e<=u.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),s.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:s[s.length-(y||1)].first_line,last_line:s[s.length-1].last_line,first_column:s[s.length-(y||1)].first_column,last_column:s[s.length-1].last_column},l&&(w._$.range=[s[s.length-(y||1)].range[0],s[s.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,s)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),s=s.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),s.push(w._$),b=r[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var s=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[s[0],s[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,s;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var r=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((s=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=s.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:s?s[s.length-1].length-s[s.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,r[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function s(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(s(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(s(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(s(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=s(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=s(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var s=i(n(49));function r(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],s=t[e-2];return i?"ContentStatement"===i.type?(s||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],s=t[e+2];return i?"ContentStatement"===i.type?(s||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var s=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==s}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var s=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==s,i.leftStripped}}r.prototype=new s.default,r.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,s=0,r=i.length;s0)throw new s.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:r,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,s,r){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:s,loc:this.locInfo(r)}},e.prepareRawBlock=function(t,e,n,i){r(t,n),i=this.locInfo(i);var s={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:s,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&r(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new s.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return r(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var s=i(n(6));function r(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new s.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,s=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),s=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(s,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function s(){var i=n.parse(t,e),s=(new n.Compiler).compile(i,e),r=(new n.JavaScriptCompiler).compile(s,e,void 0,!0);return n.template(r)}function o(t,e){return i||(i=s()),i.call(this,t,e)}return o._setup=function(t){return i||(i=s()),i._setup(t)},o._child=function(t,e,n,r){return i||(i=s()),i._child(t,e,n,r)},o};var r=s(n(6)),a=n(5),o=s(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new r.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,s="SubExpression"===t.name.type;s&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",s,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,s=i.parts[0],r=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",s,r)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),s=t.path,a=s.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new r.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);s.strict=!0,s.falsy=!0,this.accept(s),this.opcode("invokeHelper",i.length,s.original,o.default.helpers.simpleId(s))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,s]}}}},function(t,e,n){"use strict";var i=n(13).default,s=n(1).default;e.__esModule=!0;var r=n(4),a=s(n(6)),o=n(5),_=s(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=r.COMPILER_REVISION;return[t,r.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var s=t.opcodes,r=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=s.length;_0&&(n+=", "+s.join(", "));var r=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++r+"="+t,i.children[0]="alias"+r)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,s=void 0,r=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(r?t.prepend(" + "):r=t,a=t):(r&&(s?r.prepend("buffer += "):i=!0,a.add(";"),r=a=void 0),s=!0,e||(n=!1))})),n?r?(r.prepend("return "),a.add(";")):s||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),r?(r.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var s=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[s++])),this.resolvePath("context",t,s,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,s){var r=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var s=e.popStack(),r=0,a=n.length;for(t&&a--;rthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(r);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",r=p[4],p[5]&&(_=u+p[5]),r=r.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(r)if(s){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,r=s(u+r,new l)}else{var h=e.whitespace_before;h&&(r=r.replace(new RegExp("\n("+h+")?","g"),"\n")),r=u+r.replace(/\n/g,"\n"+u)}o&&(r=r?o+r+"\n"+_:o+_),t.print_newline(!1),r&&(e.text=r,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var s=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,s){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&s.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var r=!1;r=(r=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(s.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==s.type,(n.is_content_unformatted||n.is_unformatted)&&(r=!1),r&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===s.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function s(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}s.prototype=new i,t.exports.Options=s},function(t,e,n){var i=n(9).Tokenizer,s=n(9).TOKEN,r=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:s.START,RAW:s.RAW,EOF:s.EOF},u=new r(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),s=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:s.starting_with(/{{!--/).until_after(/--}}/),handlebars:s.starting_with(/{{/).until_after(/}}/),handlebars_open:s.until(/[\n\r\t }]/),handlebars_raw_close:s.until(/}}/),comment:s.starting_with(//),cdata:s.starting_with(//),conditional_comment:s.starting_with(//),processing:s.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var r=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=s.matching(r).until_after(r)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,s="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var r=this._input.next();r+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,r)}else(s=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,s):this._create_token(_.ATTRIBUTE,s));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var s=e.opened.text.substr(1).toLowerCase();if("script"===s||"style"===s){var r=this._read_comment_or_cdata(t);if(r)return r.type=_.TEXT,r;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(s)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(18);r=n}();var a=r;i=[n,n(141),n(142)],s=function(t){var e=n(141),i=n(142);return{html_beautify:function(t,n){return a(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===s||(t.exports=s)}()},141:function(t,e){var n;!function(){var i;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,s=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new s}},function(t,e,n){var i=n(2).Output,s=n(3).Token,r=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new s(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&r.lineBreak.test(t||"")&&(e=t.match(r.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var s=t.comments_before.next();s;)this.handle_whitespace_and_comments(s,e),this.handle_token(s,e),s=t.comments_before.next();if(i)for(var r=0;r0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,s=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var r=0,a=null;this._flags.inline_frame=!0;do{if(r+=1,(a=this._tokens.peek(r-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(s||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var s=!0,r=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?s=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),s=!(this._output.just_added_newline()||b),this._output.space_before_token=s,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),s=!1;var v=this._tokens.peek();r=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),s=this._flags.last_token.type===p.START_BLOCK,r=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),s=!1,r=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(s=!0),this._flags.last_token.type===p.RESERVED?s=!0:this._flags.last_token.type===p.END_EXPR?s=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(s=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(r=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||s,this.print_token(t),this._output.space_before_token=r}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):r.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(r.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),s=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(s=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var s=this.__lines[i];if(s.is_empty())break;if(0!==s.item(0).indexOf(t)&&s.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",s="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",r="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])*";e.identifier=new RegExp(r+a,"g"),e.identifierStart=new RegExp(r),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,s=["before-newline","after-newline","preserve-newline"];function r(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var r=0;r>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){s.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new s)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,s=new i(t),r=null;for(;s.hasNext();)if((r=s.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=r[0]),"\\"===s.peek()){if(s.next(),"x"===s.peek())r=s.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==s.peek()){e+="\\",s.hasNext()&&(e+=s.next());continue}r=s.match(/u([0-9A-Fa-f]{4})/g)}if(!r)return t;if((n=parseInt(r[1],16))>126&&n<=255&&0===r[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+r[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,s=!1;this._input.hasNext()&&(i||s||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?s=!0:"]"===this._input.peek()&&(s=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var s=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),r=0===s.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===s||r&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,s;"'"===t?s=this.__patterns.single_quote:'"'===t?s=this.__patterns.double_quote:"`"===t?s=this.__patterns.template_text:"}"===t&&(s=this.__patterns.template_expression);for(var r=s.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),r+=a+=s.read()}return r},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,s=n(3).Token,r=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new r,this._reset();for(var e=new s(o.START,""),n=null,i=[],a=new r;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new r),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new s(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}r.prototype=new i,r.prototype._create=function(){return new r(this._input,this)},r.prototype._update=function(){this.__set_templated_pattern()},r.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},r.prototype.read_options=function(t){var e=this._create();for(var n in s)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},r.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},r.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},r.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},r.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=r}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(0);i=n}();var s=i;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},167:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var s=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],r=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},44:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof r?new r(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof r)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof r)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new r(h,g?s.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,s={value:n,prev:e,next:i};return e.next=s,i.prev=s,t.length++,s}function p(t,e,n){for(var i=e.next,s=0;s"+r.content+""},!t.document)return t.addEventListener?(s.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,r=n.code,a=n.immediateClose;t.postMessage(s.highlight(r,s.languages[i],i)),a&&t.close()}),!1),s):s;var l=s.util.currentScript();function h(){s.manual||s.highlightAll()}if(l&&(s.filename=l.src,l.hasAttribute("data-manual")&&(s.manual=!0)),!s.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return s}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},165:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},s={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:s,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:s})}(Prism)},164:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},170:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},161:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},163:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},168:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,s=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),r=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+s+r+"(?:"+s+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+s+r+")(?:"+s+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+s+")"+r+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+s+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},157:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,s,r){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(s,(function(t){if("function"==typeof r&&!r(t))return t;for(var s,o=a.length;-1!==n.code.indexOf(s=e(i,o));)++o;return a[o]=t,s})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var s=0,r=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=r.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=r[s],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++s;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},158:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var s={};s[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",s)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},166:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},159:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},162:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},169:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",s=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),r=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+s+"|"+r+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(r),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},77:function(t){!function(){if("undefined"!=typeof Prism){var e=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},n={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};i.prototype={setDefaults:function(t){this.defaults=e(this.defaults,t)},normalize:function(t,n){for(var i in n=e(this.defaults,n)){var s=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==s&&n[i]&&this[s]&&(t=this[s].call(this,t,n[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=i),Prism.plugins.NormalizeWhitespace=new i({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var e=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var i=t.element.parentNode;if(t.code&&i&&"pre"===i.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),n)if(Object.hasOwnProperty.call(n,s)){var r=n[s];if(i.hasAttribute("data-"+s))try{var a=JSON.parse(i.getAttribute("data-"+s)||"true");typeof a===r&&(t.settings[s]=a)}catch(d){}}for(var o=i.childNodes,_="",u="",p=!1,l=0;l{window.requestAnimationFrame((()=>{const p=Date.now(),l=Math.min(1,(p-r)/o);if(e===i)return u?u():null;!function(t,e){const n=a.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}(t,_(l)*(i-e)+e),l<1?n(e,i,s,r,o,_,u):u&&u()}))},i=function(t){const e=a.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}(t),s=function(t){const e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}},n="y";return t instanceof Window?e.window[n]:e.element[n]}(t);return new Promise((t=>{n(i,"number"==typeof e.top?e.top:i,s,Date.now(),e.duration,_(e.easing),t)}))}))}function r(t={}){return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=300),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}const a={getDocument(){return document}},o={linear(t){return t},"ease-in"(t){return t*t},"ease-out"(t){return t*(2-t)},"ease-in-out"(t){return t<.5?2*t*t:(4-2*t)*t-1}},_=t=>{const e=o[t||"linear"];if(!e){const e=Object.keys(o).join(",");throw new Error(`Scroll error: scroller does not support an easing option of "${t}". Supported options are ${e}`)}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-530bd2dee358e8d9a1cc.modern.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-530bd2dee358e8d9a1cc.modern.js.LICENSE.txt new file mode 100644 index 0000000000..353a9f05db --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-530bd2dee358e8d9a1cc.modern.js.LICENSE.txt @@ -0,0 +1,92 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-5efb7ff9f8773a11c914.js b/version/v2.18.3/styleguide/js/4-chunk-5efb7ff9f8773a11c914.js new file mode 100644 index 0000000000..0c57fcb88d --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-5efb7ff9f8773a11c914.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-5efb7ff9f8773a11c914.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{23:function(t,e,n){var i,r,s,a;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}t=n.nmd(t),a=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),r=n.n(i),s=n(370),a=n.n(s),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,r=t.target,s=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==r){if(!r||"object"!==c(r)||1!==r.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&r.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(r.hasAttribute("readonly")||r.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return s?h(s,{container:i}):r?"cut"===n?p(r):h(r,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),s}(r()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function r(t,e,n,i,r){var a=s.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function s(t,e,n,r){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&r.call(t,n)}}t.exports=function(t,e,n,i,s){return"function"==typeof t.addEventListener?r.apply(null,arguments):"function"==typeof n?r.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return r(t,e,n,i,s)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),r=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return r(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),r=document.createRange();r.selectNodeContents(t),i.removeAllRanges(),i.addRange(r),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function r(){i.off(t,r),e.apply(n,arguments)}return r._=e,this.on(t,r,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,r=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple helpers");r.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(r.toString.call(t)===p)r.extend(this.partials,t);else{if(void 0===e)throw new s.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple decorators");r.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=r.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,r=/[&<>"'`=]/;function s(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):r(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return s(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var r=n(13).default,s=n(1).default;e.__esModule=!0;var a=n(5),_=s(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new _.default("Must pass iterator to #each");var n,s=e.fn,u=e.inverse,p=0,l="",h=void 0,c=void 0;function d(e,n,i){h&&(h.key=e,h.index=n,h.first=0===n,h.last=!!i,c&&(h.contextPath=c+e)),l+=s(t[e],{data:h,blockParams:a.blockParams([t[e],e],[c+e,null])})}if(e.data&&e.ids&&(c=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(h=a.createFrame(e.data)),t&&"object"===o(t))if(a.isArray(t))for(var f=t.length;p=0?e:parseInt(t,10)}return t},log:function(t){if(t=r.lookupLevel(t),"undefined"!=typeof console&&r.lookupLevel(r.level)<=t){var e=r.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),s=1;s=p.LAST_COMPATIBLE_COMPILER_REVISION&&e<=p.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),r.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:r[r.length-(y||1)].first_line,last_line:r[r.length-1].last_line,first_column:r[r.length-(y||1)].first_column,last_column:r[r.length-1].last_column},l&&(w._$.range=[r[r.length-(y||1)].range[0],r[r.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,r)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),r=r.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),r.push(w._$),b=s[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var r=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[r[0],r[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,r;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var s=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((r=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=r.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:r?r[r.length-1].length-r[r.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,s[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function r(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(r(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(r(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(r(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=r(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=r(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var r=i(n(49));function s(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],r=t[e-2];return i?"ContentStatement"===i.type?(r||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],r=t[e+2];return i?"ContentStatement"===i.type?(r||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var r=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==r}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var r=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==r,i.leftStripped}}s.prototype=new r.default,s.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,r=0,s=i.length;r0)throw new r.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:s,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,r,s){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:r,loc:this.locInfo(s)}},e.prepareRawBlock=function(t,e,n,i){s(t,n),i=this.locInfo(i);var r={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:r,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&s(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new r.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return s(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var r=i(n(6));function s(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new r.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,r=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),r=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(r,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function r(){var i=n.parse(t,e),r=(new n.Compiler).compile(i,e),s=(new n.JavaScriptCompiler).compile(r,e,void 0,!0);return n.template(s)}function o(t,e){return i||(i=r()),i.call(this,t,e)}return o._setup=function(t){return i||(i=r()),i._setup(t)},o._child=function(t,e,n,s){return i||(i=r()),i._child(t,e,n,s)},o};var s=r(n(6)),a=n(5),o=r(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new s.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,r="SubExpression"===t.name.type;r&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",r,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,r=i.parts[0],s=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",r,s)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),r=t.path,a=r.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new s.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);r.strict=!0,r.falsy=!0,this.accept(r),this.opcode("invokeHelper",i.length,r.original,o.default.helpers.simpleId(r))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,r]}}}},function(t,e,n){"use strict";var i=n(13).default,r=n(1).default;e.__esModule=!0;var s=n(4),a=r(n(6)),o=n(5),_=r(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=s.COMPILER_REVISION;return[t,s.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var r=t.opcodes,s=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=r.length;_0&&(n+=", "+r.join(", "));var s=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++s+"="+t,i.children[0]="alias"+s)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,r=void 0,s=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(s?t.prepend(" + "):s=t,a=t):(s&&(r?s.prepend("buffer += "):i=!0,a.add(";"),s=a=void 0),r=!0,e||(n=!1))})),n?s?(s.prepend("return "),a.add(";")):r||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),s?(s.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var r=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[r++])),this.resolvePath("context",t,r,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,r){var s=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var r=e.popStack(),s=0,a=n.length;for(t&&a--;sthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(s);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",s=p[4],p[5]&&(_=u+p[5]),s=s.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(s)if(r){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,s=r(u+s,new l)}else{var h=e.whitespace_before;h&&(s=s.replace(new RegExp("\n("+h+")?","g"),"\n")),s=u+s.replace(/\n/g,"\n"+u)}o&&(s=s?o+s+"\n"+_:o+_),t.print_newline(!1),s&&(e.text=s,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var r=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,r){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&r.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var s=!1;s=(s=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(r.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==r.type,(n.is_content_unformatted||n.is_unformatted)&&(s=!1),s&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===r.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function r(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}r.prototype=new i,t.exports.Options=r},function(t,e,n){var i=n(9).Tokenizer,r=n(9).TOKEN,s=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:r.START,RAW:r.RAW,EOF:r.EOF},u=new s(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),r=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:r.starting_with(/{{!--/).until_after(/--}}/),handlebars:r.starting_with(/{{/).until_after(/}}/),handlebars_open:r.until(/[\n\r\t }]/),handlebars_raw_close:r.until(/}}/),comment:r.starting_with(//),cdata:r.starting_with(//),conditional_comment:r.starting_with(//),processing:r.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var s=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=r.matching(s).until_after(s)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,r="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var s=this._input.next();s+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,s)}else(r=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,r):this._create_token(_.ATTRIBUTE,r));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var r=e.opened.text.substr(1).toLowerCase();if("script"===r||"style"===r){var s=this._read_comment_or_cdata(t);if(s)return s.type=_.TEXT,s;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(r)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(18);a=n}();var o=a;i=[n,n(385),n(386)],r=function(t){var e=n(385),i=n(386);return{html_beautify:function(t,n){return o(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===r||(t.exports=r)}()},385:function(t,e){var n;function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}!function(){var r;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,r=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new r}},function(t,e,n){var i=n(2).Output,r=n(3).Token,s=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new r(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&s.lineBreak.test(t||"")&&(e=t.match(s.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var r=t.comments_before.next();r;)this.handle_whitespace_and_comments(r,e),this.handle_token(r,e),r=t.comments_before.next();if(i)for(var s=0;s0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,r=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var s=0,a=null;this._flags.inline_frame=!0;do{if(s+=1,(a=this._tokens.peek(s-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(r||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var r=!0,s=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?r=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),r=!(this._output.just_added_newline()||b),this._output.space_before_token=r,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),r=!1;var v=this._tokens.peek();s=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),r=this._flags.last_token.type===p.START_BLOCK,s=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),r=!1,s=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(r=!0),this._flags.last_token.type===p.RESERVED?r=!0:this._flags.last_token.type===p.END_EXPR?r=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(r=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(s=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||r,this.print_token(t),this._output.space_before_token=s}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):s.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(s.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),r=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(r=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var r=this.__lines[i];if(r.is_empty())break;if(0!==r.item(0).indexOf(t)&&r.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",r="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",s="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])*";e.identifier=new RegExp(s+a,"g"),e.identifierStart=new RegExp(s),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,r=["before-newline","after-newline","preserve-newline"];function s(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var s=0;s>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){r.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new r)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,r=new i(t),s=null;for(;r.hasNext();)if((s=r.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=s[0]),"\\"===r.peek()){if(r.next(),"x"===r.peek())s=r.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==r.peek()){e+="\\",r.hasNext()&&(e+=r.next());continue}s=r.match(/u([0-9A-Fa-f]{4})/g)}if(!s)return t;if((n=parseInt(s[1],16))>126&&n<=255&&0===s[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+s[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,r=!1;this._input.hasNext()&&(i||r||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?r=!0:"]"===this._input.peek()&&(r=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var r=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),s=0===r.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===r||s&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,r;"'"===t?r=this.__patterns.single_quote:'"'===t?r=this.__patterns.double_quote:"`"===t?r=this.__patterns.template_text:"}"===t&&(r=this.__patterns.template_expression);for(var s=r.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),s+=a+=r.read()}return s},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,r=n(3).Token,s=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new s,this._reset();for(var e=new r(o.START,""),n=null,i=[],a=new s;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new s),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new r(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}s.prototype=new i,s.prototype._create=function(){return new s(this._input,this)},s.prototype._update=function(){this.__set_templated_pattern()},s.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},s.prototype.read_options=function(t){var e=this._create();for(var n in r)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},s.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},s.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},s.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},s.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=s}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(0);r=n}();var s=r;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},406:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var r=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],s=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},267:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof s?new s(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof s)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof s)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new s(h,g?r.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,r={value:n,prev:e,next:i};return e.next=r,i.prev=r,t.length++,r}function p(t,e,n){for(var i=e.next,r=0;r"+s.content+""},!t.document)return t.addEventListener?(r.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,s=n.code,a=n.immediateClose;t.postMessage(r.highlight(s,r.languages[i],i)),a&&t.close()}),!1),r):r;var l=r.util.currentScript();function h(){r.manual||r.highlightAll()}if(l&&(r.filename=l.src,l.hasAttribute("data-manual")&&(r.manual=!0)),!r.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return r}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},404:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},r={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:r,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:r})}(Prism)},403:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},409:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},400:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},402:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},407:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,r=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),s=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+r+s+"(?:"+r+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+r+s+")(?:"+r+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+r+")"+s+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+r+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},396:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,r,s){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(r,(function(t){if("function"==typeof s&&!s(t))return t;for(var r,o=a.length;-1!==n.code.indexOf(r=e(i,o));)++o;return a[o]=t,r})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var r=0,s=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=s.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=s[r],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++r;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},397:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var r={};r[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",r)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},405:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},398:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},401:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},408:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",r=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),s=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+r+"|"+s+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(s),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},268:function(t){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},e(t)}!function(){if("undefined"!=typeof Prism){var n=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},i={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};r.prototype={setDefaults:function(t){this.defaults=n(this.defaults,t)},normalize:function(t,e){for(var i in e=n(this.defaults,e)){var r=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==r&&e[i]&&this[r]&&(t=this[r].call(this,t,e[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=r),Prism.plugins.NormalizeWhitespace=new r({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var n=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var r=t.element.parentNode;if(t.code&&r&&"pre"===r.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),i)if(Object.hasOwnProperty.call(i,s)){var a=i[s];if(r.hasAttribute("data-"+s))try{var o=JSON.parse(r.getAttribute("data-"+s)||"true");e(o)===a&&(t.settings[s]=o)}catch(f){}}for(var _=r.childNodes,u="",p="",l=!1,h=0;h<_.length;++h){var c=_[h];c==t.element?l=!0:"#text"===c.nodeName&&(l?p+=c.nodeValue:u+=c.nodeValue,r.removeChild(c),--h)}if(t.element.children.length&&Prism.plugins.KeepMarkup){var d=u+t.element.innerHTML+p;t.element.innerHTML=n.normalize(d,t.settings),t.code=t.element.textContent}else t.code=u+t.code+p,t.code=n.normalize(t.code,t.settings)}}else t.code=n.normalize(t.code,t.settings)}))}function r(t){this.defaults=n({},t)}function s(t){for(var e=0,n=0;n=0;--r){var s=this.tryEntries[r],a=s.completion;if("root"===s.tryLoc)return i("end");if(s.tryLoc<=this.prev){var o=n.call(s,"catchLoc"),_=n.call(s,"finallyLoc");if(o&&_){if(this.prev=0;--i){var r=this.tryEntries[i];if(r.tryLoc<=this.prev&&n.call(r,"finallyLoc")&&this.prev=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),O(n),c}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var i=n.completion;if("throw"===i.type){var r=i.arg;O(n)}return r}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,n){return this.delegate={iterator:A(t),resultName:e,nextLoc:n},"next"===this.method&&(this.arg=void 0),c}},t}function s(t,e,n,i){return new(n||(n=Promise))((function(r,s){function a(t){try{_(i.next(t))}catch(e){s(e)}}function o(t){try{_(i.throw(t))}catch(e){s(e)}}function _(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(a,o)}_((i=i.apply(t,e||[])).next())}))}n.d(e,{X5:function(){return o}});var a=300;function o(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(this,void 0,void 0,r().mark((function n(){var i,s,o;return r().wrap((function(n){for(;;)switch(n.prev=n.next){case 0:if(t instanceof Element||t instanceof Window){n.next=2;break}throw new Error("element passed to scrollTo() must be either the window or a DOM element, you passed ".concat(t,"!"));case 2:return e=u(e),i=function e(n,i,r,s){var o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:a,_=arguments.length>5?arguments[5]:void 0,u=arguments.length>6?arguments[6]:void 0;window.requestAnimationFrame((function(){var a=Date.now(),p=Math.min(1,(a-s)/o);if(n===i)return u?u():null;l(t,_(p)*(i-n)+n),p<1?e(n,i,r,s,o,_,u):u&&u()}))},s=p(t),o=_(t),n.abrupt("return",new Promise((function(t){i(s,"number"==typeof e.top?e.top:s,o,Date.now(),e.duration,d(e.easing),t)})));case 7:case"end":return n.stop()}}),n)})))}function _(t){var e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}};return t instanceof Window?e.window.y:e.element.y}function u(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=a),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}function p(t){var e=h.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}function l(t,e){var n=h.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}var h={getDocument:function(){return document}},c={linear:function(t){return t},"ease-in":function(t){return t*t},"ease-out":function(t){return t*(2-t)},"ease-in-out":function(t){return t<.5?2*t*t:(4-2*t)*t-1}},d=function(t){var e=c[t||"linear"];if(!e){var n=Object.keys(c).join(",");throw new Error('Scroll error: scroller does not support an easing option of "'.concat(t,'". Supported options are ').concat(n))}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-5efb7ff9f8773a11c914.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-5efb7ff9f8773a11c914.js.LICENSE.txt new file mode 100644 index 0000000000..f4f3f5d942 --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-5efb7ff9f8773a11c914.js.LICENSE.txt @@ -0,0 +1,94 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-7a265786ddc0d4faa705.js b/version/v2.18.3/styleguide/js/4-chunk-7a265786ddc0d4faa705.js new file mode 100644 index 0000000000..10c7af2aba --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-7a265786ddc0d4faa705.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-7a265786ddc0d4faa705.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{23:function(t,e,n){var i,r,s,a;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}t=n.nmd(t),a=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),r=n.n(i),s=n(370),a=n.n(s),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,r=t.target,s=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==r){if(!r||"object"!==c(r)||1!==r.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&r.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(r.hasAttribute("readonly")||r.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return s?h(s,{container:i}):r?"cut"===n?p(r):h(r,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),s}(r()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function r(t,e,n,i,r){var a=s.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function s(t,e,n,r){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&r.call(t,n)}}t.exports=function(t,e,n,i,s){return"function"==typeof t.addEventListener?r.apply(null,arguments):"function"==typeof n?r.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return r(t,e,n,i,s)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),r=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return r(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),r=document.createRange();r.selectNodeContents(t),i.removeAllRanges(),i.addRange(r),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function r(){i.off(t,r),e.apply(n,arguments)}return r._=e,this.on(t,r,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,r=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple helpers");r.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(r.toString.call(t)===p)r.extend(this.partials,t);else{if(void 0===e)throw new s.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple decorators");r.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=r.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,r=/[&<>"'`=]/;function s(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):r(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return s(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var r=n(13).default,s=n(1).default;e.__esModule=!0;var a=n(5),_=s(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new _.default("Must pass iterator to #each");var n,s=e.fn,u=e.inverse,p=0,l="",h=void 0,c=void 0;function d(e,n,i){h&&(h.key=e,h.index=n,h.first=0===n,h.last=!!i,c&&(h.contextPath=c+e)),l+=s(t[e],{data:h,blockParams:a.blockParams([t[e],e],[c+e,null])})}if(e.data&&e.ids&&(c=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(h=a.createFrame(e.data)),t&&"object"===o(t))if(a.isArray(t))for(var f=t.length;p=0?e:parseInt(t,10)}return t},log:function(t){if(t=r.lookupLevel(t),"undefined"!=typeof console&&r.lookupLevel(r.level)<=t){var e=r.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),s=1;s=p.LAST_COMPATIBLE_COMPILER_REVISION&&e<=p.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),r.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:r[r.length-(y||1)].first_line,last_line:r[r.length-1].last_line,first_column:r[r.length-(y||1)].first_column,last_column:r[r.length-1].last_column},l&&(w._$.range=[r[r.length-(y||1)].range[0],r[r.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,r)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),r=r.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),r.push(w._$),b=s[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var r=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[r[0],r[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,r;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var s=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((r=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=r.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:r?r[r.length-1].length-r[r.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,s[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function r(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(r(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(r(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(r(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=r(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=r(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var r=i(n(49));function s(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],r=t[e-2];return i?"ContentStatement"===i.type?(r||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],r=t[e+2];return i?"ContentStatement"===i.type?(r||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var r=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==r}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var r=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==r,i.leftStripped}}s.prototype=new r.default,s.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,r=0,s=i.length;r0)throw new r.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:s,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,r,s){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:r,loc:this.locInfo(s)}},e.prepareRawBlock=function(t,e,n,i){s(t,n),i=this.locInfo(i);var r={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:r,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&s(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new r.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return s(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var r=i(n(6));function s(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new r.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,r=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),r=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(r,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function r(){var i=n.parse(t,e),r=(new n.Compiler).compile(i,e),s=(new n.JavaScriptCompiler).compile(r,e,void 0,!0);return n.template(s)}function o(t,e){return i||(i=r()),i.call(this,t,e)}return o._setup=function(t){return i||(i=r()),i._setup(t)},o._child=function(t,e,n,s){return i||(i=r()),i._child(t,e,n,s)},o};var s=r(n(6)),a=n(5),o=r(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new s.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,r="SubExpression"===t.name.type;r&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",r,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,r=i.parts[0],s=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",r,s)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),r=t.path,a=r.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new s.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);r.strict=!0,r.falsy=!0,this.accept(r),this.opcode("invokeHelper",i.length,r.original,o.default.helpers.simpleId(r))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,r]}}}},function(t,e,n){"use strict";var i=n(13).default,r=n(1).default;e.__esModule=!0;var s=n(4),a=r(n(6)),o=n(5),_=r(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=s.COMPILER_REVISION;return[t,s.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var r=t.opcodes,s=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=r.length;_0&&(n+=", "+r.join(", "));var s=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++s+"="+t,i.children[0]="alias"+s)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,r=void 0,s=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(s?t.prepend(" + "):s=t,a=t):(s&&(r?s.prepend("buffer += "):i=!0,a.add(";"),s=a=void 0),r=!0,e||(n=!1))})),n?s?(s.prepend("return "),a.add(";")):r||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),s?(s.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var r=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[r++])),this.resolvePath("context",t,r,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,r){var s=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var r=e.popStack(),s=0,a=n.length;for(t&&a--;sthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(s);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",s=p[4],p[5]&&(_=u+p[5]),s=s.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(s)if(r){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,s=r(u+s,new l)}else{var h=e.whitespace_before;h&&(s=s.replace(new RegExp("\n("+h+")?","g"),"\n")),s=u+s.replace(/\n/g,"\n"+u)}o&&(s=s?o+s+"\n"+_:o+_),t.print_newline(!1),s&&(e.text=s,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var r=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,r){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&r.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var s=!1;s=(s=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(r.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==r.type,(n.is_content_unformatted||n.is_unformatted)&&(s=!1),s&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===r.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function r(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}r.prototype=new i,t.exports.Options=r},function(t,e,n){var i=n(9).Tokenizer,r=n(9).TOKEN,s=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:r.START,RAW:r.RAW,EOF:r.EOF},u=new s(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),r=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:r.starting_with(/{{!--/).until_after(/--}}/),handlebars:r.starting_with(/{{/).until_after(/}}/),handlebars_open:r.until(/[\n\r\t }]/),handlebars_raw_close:r.until(/}}/),comment:r.starting_with(//),cdata:r.starting_with(//),conditional_comment:r.starting_with(//),processing:r.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var s=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=r.matching(s).until_after(s)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,r="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var s=this._input.next();s+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,s)}else(r=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,r):this._create_token(_.ATTRIBUTE,r));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var r=e.opened.text.substr(1).toLowerCase();if("script"===r||"style"===r){var s=this._read_comment_or_cdata(t);if(s)return s.type=_.TEXT,s;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(r)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(18);a=n}();var o=a;i=[n,n(382),n(383)],r=function(t){var e=n(382),i=n(383);return{html_beautify:function(t,n){return o(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===r||(t.exports=r)}()},382:function(t,e){var n;function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}!function(){var r;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,r=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new r}},function(t,e,n){var i=n(2).Output,r=n(3).Token,s=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new r(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&s.lineBreak.test(t||"")&&(e=t.match(s.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var r=t.comments_before.next();r;)this.handle_whitespace_and_comments(r,e),this.handle_token(r,e),r=t.comments_before.next();if(i)for(var s=0;s0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,r=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var s=0,a=null;this._flags.inline_frame=!0;do{if(s+=1,(a=this._tokens.peek(s-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(r||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var r=!0,s=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?r=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),r=!(this._output.just_added_newline()||b),this._output.space_before_token=r,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),r=!1;var v=this._tokens.peek();s=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),r=this._flags.last_token.type===p.START_BLOCK,s=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),r=!1,s=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(r=!0),this._flags.last_token.type===p.RESERVED?r=!0:this._flags.last_token.type===p.END_EXPR?r=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(r=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(s=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||r,this.print_token(t),this._output.space_before_token=s}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):s.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(s.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),r=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(r=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var r=this.__lines[i];if(r.is_empty())break;if(0!==r.item(0).indexOf(t)&&r.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",r="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",s="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])*";e.identifier=new RegExp(s+a,"g"),e.identifierStart=new RegExp(s),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,r=["before-newline","after-newline","preserve-newline"];function s(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var s=0;s>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){r.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new r)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,r=new i(t),s=null;for(;r.hasNext();)if((s=r.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=s[0]),"\\"===r.peek()){if(r.next(),"x"===r.peek())s=r.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==r.peek()){e+="\\",r.hasNext()&&(e+=r.next());continue}s=r.match(/u([0-9A-Fa-f]{4})/g)}if(!s)return t;if((n=parseInt(s[1],16))>126&&n<=255&&0===s[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+s[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,r=!1;this._input.hasNext()&&(i||r||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?r=!0:"]"===this._input.peek()&&(r=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var r=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),s=0===r.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===r||s&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,r;"'"===t?r=this.__patterns.single_quote:'"'===t?r=this.__patterns.double_quote:"`"===t?r=this.__patterns.template_text:"}"===t&&(r=this.__patterns.template_expression);for(var s=r.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),s+=a+=r.read()}return s},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,r=n(3).Token,s=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new s,this._reset();for(var e=new r(o.START,""),n=null,i=[],a=new s;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new s),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new r(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}s.prototype=new i,s.prototype._create=function(){return new s(this._input,this)},s.prototype._update=function(){this.__set_templated_pattern()},s.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},s.prototype.read_options=function(t){var e=this._create();for(var n in r)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},s.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},s.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},s.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},s.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=s}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(0);r=n}();var s=r;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},406:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var r=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],s=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},219:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof s?new s(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof s)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof s)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new s(h,g?r.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,r={value:n,prev:e,next:i};return e.next=r,i.prev=r,t.length++,r}function p(t,e,n){for(var i=e.next,r=0;r"+s.content+""},!t.document)return t.addEventListener?(r.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,s=n.code,a=n.immediateClose;t.postMessage(r.highlight(s,r.languages[i],i)),a&&t.close()}),!1),r):r;var l=r.util.currentScript();function h(){r.manual||r.highlightAll()}if(l&&(r.filename=l.src,l.hasAttribute("data-manual")&&(r.manual=!0)),!r.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return r}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},404:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},r={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:r,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:r})}(Prism)},403:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},409:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},400:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},402:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},407:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,r=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),s=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+r+s+"(?:"+r+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+r+s+")(?:"+r+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+r+")"+s+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+r+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},396:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,r,s){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(r,(function(t){if("function"==typeof s&&!s(t))return t;for(var r,o=a.length;-1!==n.code.indexOf(r=e(i,o));)++o;return a[o]=t,r})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var r=0,s=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=s.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=s[r],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++r;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},397:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var r={};r[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",r)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},405:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},398:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},401:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},408:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",r=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),s=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+r+"|"+s+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(s),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},220:function(t){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},e(t)}!function(){if("undefined"!=typeof Prism){var n=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},i={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};r.prototype={setDefaults:function(t){this.defaults=n(this.defaults,t)},normalize:function(t,e){for(var i in e=n(this.defaults,e)){var r=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==r&&e[i]&&this[r]&&(t=this[r].call(this,t,e[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=r),Prism.plugins.NormalizeWhitespace=new r({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var n=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var r=t.element.parentNode;if(t.code&&r&&"pre"===r.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),i)if(Object.hasOwnProperty.call(i,s)){var a=i[s];if(r.hasAttribute("data-"+s))try{var o=JSON.parse(r.getAttribute("data-"+s)||"true");e(o)===a&&(t.settings[s]=o)}catch(f){}}for(var _=r.childNodes,u="",p="",l=!1,h=0;h<_.length;++h){var c=_[h];c==t.element?l=!0:"#text"===c.nodeName&&(l?p+=c.nodeValue:u+=c.nodeValue,r.removeChild(c),--h)}if(t.element.children.length&&Prism.plugins.KeepMarkup){var d=u+t.element.innerHTML+p;t.element.innerHTML=n.normalize(d,t.settings),t.code=t.element.textContent}else t.code=u+t.code+p,t.code=n.normalize(t.code,t.settings)}}else t.code=n.normalize(t.code,t.settings)}))}function r(t){this.defaults=n({},t)}function s(t){for(var e=0,n=0;n=0;--r){var s=this.tryEntries[r],a=s.completion;if("root"===s.tryLoc)return i("end");if(s.tryLoc<=this.prev){var o=n.call(s,"catchLoc"),_=n.call(s,"finallyLoc");if(o&&_){if(this.prev=0;--i){var r=this.tryEntries[i];if(r.tryLoc<=this.prev&&n.call(r,"finallyLoc")&&this.prev=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),O(n),c}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var i=n.completion;if("throw"===i.type){var r=i.arg;O(n)}return r}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,n){return this.delegate={iterator:A(t),resultName:e,nextLoc:n},"next"===this.method&&(this.arg=void 0),c}},t}function s(t,e,n,i){return new(n||(n=Promise))((function(r,s){function a(t){try{_(i.next(t))}catch(e){s(e)}}function o(t){try{_(i.throw(t))}catch(e){s(e)}}function _(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(a,o)}_((i=i.apply(t,e||[])).next())}))}n.d(e,{X5:function(){return o}});var a=300;function o(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(this,void 0,void 0,r().mark((function n(){var i,s,o;return r().wrap((function(n){for(;;)switch(n.prev=n.next){case 0:if(t instanceof Element||t instanceof Window){n.next=2;break}throw new Error("element passed to scrollTo() must be either the window or a DOM element, you passed ".concat(t,"!"));case 2:return e=u(e),i=function e(n,i,r,s){var o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:a,_=arguments.length>5?arguments[5]:void 0,u=arguments.length>6?arguments[6]:void 0;window.requestAnimationFrame((function(){var a=Date.now(),p=Math.min(1,(a-s)/o);if(n===i)return u?u():null;l(t,_(p)*(i-n)+n),p<1?e(n,i,r,s,o,_,u):u&&u()}))},s=p(t),o=_(t),n.abrupt("return",new Promise((function(t){i(s,"number"==typeof e.top?e.top:s,o,Date.now(),e.duration,d(e.easing),t)})));case 7:case"end":return n.stop()}}),n)})))}function _(t){var e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}};return t instanceof Window?e.window.y:e.element.y}function u(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=a),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}function p(t){var e=h.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}function l(t,e){var n=h.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}var h={getDocument:function(){return document}},c={linear:function(t){return t},"ease-in":function(t){return t*t},"ease-out":function(t){return t*(2-t)},"ease-in-out":function(t){return t<.5?2*t*t:(4-2*t)*t-1}},d=function(t){var e=c[t||"linear"];if(!e){var n=Object.keys(c).join(",");throw new Error('Scroll error: scroller does not support an easing option of "'.concat(t,'". Supported options are ').concat(n))}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-7a265786ddc0d4faa705.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-7a265786ddc0d4faa705.js.LICENSE.txt new file mode 100644 index 0000000000..f4f3f5d942 --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-7a265786ddc0d4faa705.js.LICENSE.txt @@ -0,0 +1,94 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-89e9e4ddcdf713f6b994.modern.js b/version/v2.18.3/styleguide/js/4-chunk-89e9e4ddcdf713f6b994.modern.js new file mode 100644 index 0000000000..2b76779b3c --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-89e9e4ddcdf713f6b994.modern.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-89e9e4ddcdf713f6b994.modern.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{16:function(t){var e;e=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),s=n.n(i),r=n(370),a=n.n(r),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,s=t.target,r=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==s){if(!s||"object"!==c(s)||1!==s.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&s.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(s.hasAttribute("readonly")||s.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return r?h(r,{container:i}):s?"cut"===n?p(s):h(s,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),r}(s()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function s(t,e,n,i,s){var a=r.apply(this,arguments);return t.addEventListener(n,a,s),{destroy:function(){t.removeEventListener(n,a,s)}}}function r(t,e,n,s){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&s.call(t,n)}}t.exports=function(t,e,n,i,r){return"function"==typeof t.addEventListener?s.apply(null,arguments):"function"==typeof n?s.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return s(t,e,n,i,r)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),s=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return s(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),s=document.createRange();s.selectNodeContents(t),i.removeAllRanges(),i.addRange(s),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function s(){i.off(t,s),e.apply(n,arguments)}return s._=e,this.on(t,s,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,s=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple helpers");s.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(s.toString.call(t)===p)s.extend(this.partials,t);else{if(void 0===e)throw new r.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple decorators");s.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=s.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,s=/[&<>"'`=]/;function r(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):s(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return r(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var s=n(13).default,r=n(1).default;e.__esModule=!0;var a=n(5),o=r(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new o.default("Must pass iterator to #each");var n,r=e.fn,_=e.inverse,u=0,p="",l=void 0,h=void 0;function c(e,n,i){l&&(l.key=e,l.index=n,l.first=0===n,l.last=!!i,h&&(l.contextPath=h+e)),p+=r(t[e],{data:l,blockParams:a.blockParams([t[e],e],[h+e,null])})}if(e.data&&e.ids&&(h=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(l=a.createFrame(e.data)),t&&"object"==typeof t)if(a.isArray(t))for(var d=t.length;u=0?e:parseInt(t,10)}return t},log:function(t){if(t=s.lookupLevel(t),"undefined"!=typeof console&&s.lookupLevel(s.level)<=t){var e=s.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),r=1;r=u.LAST_COMPATIBLE_COMPILER_REVISION&&e<=u.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),s.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:s[s.length-(y||1)].first_line,last_line:s[s.length-1].last_line,first_column:s[s.length-(y||1)].first_column,last_column:s[s.length-1].last_column},l&&(w._$.range=[s[s.length-(y||1)].range[0],s[s.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,s)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),s=s.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),s.push(w._$),b=r[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var s=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[s[0],s[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,s;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var r=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((s=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=s.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:s?s[s.length-1].length-s[s.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,r[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function s(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(s(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(s(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(s(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=s(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=s(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var s=i(n(49));function r(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],s=t[e-2];return i?"ContentStatement"===i.type?(s||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],s=t[e+2];return i?"ContentStatement"===i.type?(s||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var s=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==s}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var s=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==s,i.leftStripped}}r.prototype=new s.default,r.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,s=0,r=i.length;s0)throw new s.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:r,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,s,r){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:s,loc:this.locInfo(r)}},e.prepareRawBlock=function(t,e,n,i){r(t,n),i=this.locInfo(i);var s={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:s,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&r(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new s.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return r(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var s=i(n(6));function r(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new s.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,s=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),s=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(s,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function s(){var i=n.parse(t,e),s=(new n.Compiler).compile(i,e),r=(new n.JavaScriptCompiler).compile(s,e,void 0,!0);return n.template(r)}function o(t,e){return i||(i=s()),i.call(this,t,e)}return o._setup=function(t){return i||(i=s()),i._setup(t)},o._child=function(t,e,n,r){return i||(i=s()),i._child(t,e,n,r)},o};var r=s(n(6)),a=n(5),o=s(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new r.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,s="SubExpression"===t.name.type;s&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",s,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,s=i.parts[0],r=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",s,r)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),s=t.path,a=s.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new r.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);s.strict=!0,s.falsy=!0,this.accept(s),this.opcode("invokeHelper",i.length,s.original,o.default.helpers.simpleId(s))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,s]}}}},function(t,e,n){"use strict";var i=n(13).default,s=n(1).default;e.__esModule=!0;var r=n(4),a=s(n(6)),o=n(5),_=s(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=r.COMPILER_REVISION;return[t,r.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var s=t.opcodes,r=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=s.length;_0&&(n+=", "+s.join(", "));var r=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++r+"="+t,i.children[0]="alias"+r)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,s=void 0,r=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(r?t.prepend(" + "):r=t,a=t):(r&&(s?r.prepend("buffer += "):i=!0,a.add(";"),r=a=void 0),s=!0,e||(n=!1))})),n?r?(r.prepend("return "),a.add(";")):s||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),r?(r.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var s=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[s++])),this.resolvePath("context",t,s,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,s){var r=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var s=e.popStack(),r=0,a=n.length;for(t&&a--;rthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(r);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",r=p[4],p[5]&&(_=u+p[5]),r=r.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(r)if(s){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,r=s(u+r,new l)}else{var h=e.whitespace_before;h&&(r=r.replace(new RegExp("\n("+h+")?","g"),"\n")),r=u+r.replace(/\n/g,"\n"+u)}o&&(r=r?o+r+"\n"+_:o+_),t.print_newline(!1),r&&(e.text=r,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var s=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,s){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&s.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var r=!1;r=(r=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(s.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==s.type,(n.is_content_unformatted||n.is_unformatted)&&(r=!1),r&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===s.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function s(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}s.prototype=new i,t.exports.Options=s},function(t,e,n){var i=n(9).Tokenizer,s=n(9).TOKEN,r=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:s.START,RAW:s.RAW,EOF:s.EOF},u=new r(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),s=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:s.starting_with(/{{!--/).until_after(/--}}/),handlebars:s.starting_with(/{{/).until_after(/}}/),handlebars_open:s.until(/[\n\r\t }]/),handlebars_raw_close:s.until(/}}/),comment:s.starting_with(//),cdata:s.starting_with(//),conditional_comment:s.starting_with(//),processing:s.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var r=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=s.matching(r).until_after(r)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,s="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var r=this._input.next();r+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,r)}else(s=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,s):this._create_token(_.ATTRIBUTE,s));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var s=e.opened.text.substr(1).toLowerCase();if("script"===s||"style"===s){var r=this._read_comment_or_cdata(t);if(r)return r.type=_.TEXT,r;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(s)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(18);r=n}();var a=r;i=[n,n(141),n(142)],s=function(t){var e=n(141),i=n(142);return{html_beautify:function(t,n){return a(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===s||(t.exports=s)}()},141:function(t,e){var n;!function(){var i;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,s=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new s}},function(t,e,n){var i=n(2).Output,s=n(3).Token,r=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new s(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&r.lineBreak.test(t||"")&&(e=t.match(r.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var s=t.comments_before.next();s;)this.handle_whitespace_and_comments(s,e),this.handle_token(s,e),s=t.comments_before.next();if(i)for(var r=0;r0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,s=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var r=0,a=null;this._flags.inline_frame=!0;do{if(r+=1,(a=this._tokens.peek(r-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(s||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var s=!0,r=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?s=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),s=!(this._output.just_added_newline()||b),this._output.space_before_token=s,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),s=!1;var v=this._tokens.peek();r=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),s=this._flags.last_token.type===p.START_BLOCK,r=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),s=!1,r=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(s=!0),this._flags.last_token.type===p.RESERVED?s=!0:this._flags.last_token.type===p.END_EXPR?s=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(s=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(r=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||s,this.print_token(t),this._output.space_before_token=r}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):r.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(r.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),s=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(s=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var s=this.__lines[i];if(s.is_empty())break;if(0!==s.item(0).indexOf(t)&&s.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",s="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",r="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])*";e.identifier=new RegExp(r+a,"g"),e.identifierStart=new RegExp(r),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,s=["before-newline","after-newline","preserve-newline"];function r(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var r=0;r>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){s.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new s)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,s=new i(t),r=null;for(;s.hasNext();)if((r=s.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=r[0]),"\\"===s.peek()){if(s.next(),"x"===s.peek())r=s.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==s.peek()){e+="\\",s.hasNext()&&(e+=s.next());continue}r=s.match(/u([0-9A-Fa-f]{4})/g)}if(!r)return t;if((n=parseInt(r[1],16))>126&&n<=255&&0===r[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+r[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,s=!1;this._input.hasNext()&&(i||s||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?s=!0:"]"===this._input.peek()&&(s=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var s=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),r=0===s.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===s||r&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,s;"'"===t?s=this.__patterns.single_quote:'"'===t?s=this.__patterns.double_quote:"`"===t?s=this.__patterns.template_text:"}"===t&&(s=this.__patterns.template_expression);for(var r=s.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),r+=a+=s.read()}return r},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,s=n(3).Token,r=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new r,this._reset();for(var e=new s(o.START,""),n=null,i=[],a=new r;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new r),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new s(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}r.prototype=new i,r.prototype._create=function(){return new r(this._input,this)},r.prototype._update=function(){this.__set_templated_pattern()},r.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},r.prototype.read_options=function(t){var e=this._create();for(var n in s)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},r.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},r.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},r.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},r.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=r}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(0);i=n}();var s=i;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},167:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var s=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],r=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},44:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof r?new r(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof r)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof r)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new r(h,g?s.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,s={value:n,prev:e,next:i};return e.next=s,i.prev=s,t.length++,s}function p(t,e,n){for(var i=e.next,s=0;s"+r.content+""},!t.document)return t.addEventListener?(s.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,r=n.code,a=n.immediateClose;t.postMessage(s.highlight(r,s.languages[i],i)),a&&t.close()}),!1),s):s;var l=s.util.currentScript();function h(){s.manual||s.highlightAll()}if(l&&(s.filename=l.src,l.hasAttribute("data-manual")&&(s.manual=!0)),!s.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return s}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},165:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},s={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:s,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:s})}(Prism)},164:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},170:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},161:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},163:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},168:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,s=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),r=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+s+r+"(?:"+s+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+s+r+")(?:"+s+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+s+")"+r+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+s+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},157:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,s,r){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(s,(function(t){if("function"==typeof r&&!r(t))return t;for(var s,o=a.length;-1!==n.code.indexOf(s=e(i,o));)++o;return a[o]=t,s})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var s=0,r=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=r.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=r[s],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++s;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},158:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var s={};s[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",s)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},166:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},159:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},162:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},169:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",s=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),r=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+s+"|"+r+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(r),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},87:function(t){!function(){if("undefined"!=typeof Prism){var e=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},n={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};i.prototype={setDefaults:function(t){this.defaults=e(this.defaults,t)},normalize:function(t,n){for(var i in n=e(this.defaults,n)){var s=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==s&&n[i]&&this[s]&&(t=this[s].call(this,t,n[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=i),Prism.plugins.NormalizeWhitespace=new i({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var e=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var i=t.element.parentNode;if(t.code&&i&&"pre"===i.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),n)if(Object.hasOwnProperty.call(n,s)){var r=n[s];if(i.hasAttribute("data-"+s))try{var a=JSON.parse(i.getAttribute("data-"+s)||"true");typeof a===r&&(t.settings[s]=a)}catch(d){}}for(var o=i.childNodes,_="",u="",p=!1,l=0;l{window.requestAnimationFrame((()=>{const p=Date.now(),l=Math.min(1,(p-r)/o);if(e===i)return u?u():null;!function(t,e){const n=a.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}(t,_(l)*(i-e)+e),l<1?n(e,i,s,r,o,_,u):u&&u()}))},i=function(t){const e=a.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}(t),s=function(t){const e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}},n="y";return t instanceof Window?e.window[n]:e.element[n]}(t);return new Promise((t=>{n(i,"number"==typeof e.top?e.top:i,s,Date.now(),e.duration,_(e.easing),t)}))}))}function r(t={}){return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=300),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}const a={getDocument(){return document}},o={linear(t){return t},"ease-in"(t){return t*t},"ease-out"(t){return t*(2-t)},"ease-in-out"(t){return t<.5?2*t*t:(4-2*t)*t-1}},_=t=>{const e=o[t||"linear"];if(!e){const e=Object.keys(o).join(",");throw new Error(`Scroll error: scroller does not support an easing option of "${t}". Supported options are ${e}`)}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-89e9e4ddcdf713f6b994.modern.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-89e9e4ddcdf713f6b994.modern.js.LICENSE.txt new file mode 100644 index 0000000000..353a9f05db --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-89e9e4ddcdf713f6b994.modern.js.LICENSE.txt @@ -0,0 +1,92 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-9d131fbad93c294f5a13.js b/version/v2.18.3/styleguide/js/4-chunk-9d131fbad93c294f5a13.js new file mode 100644 index 0000000000..7c5aaa15c0 --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-9d131fbad93c294f5a13.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-9d131fbad93c294f5a13.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{23:function(t,e,n){var i,r,s,a;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}t=n.nmd(t),a=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),r=n.n(i),s=n(370),a=n.n(s),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,r=t.target,s=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==r){if(!r||"object"!==c(r)||1!==r.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&r.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(r.hasAttribute("readonly")||r.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return s?h(s,{container:i}):r?"cut"===n?p(r):h(r,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),s}(r()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function r(t,e,n,i,r){var a=s.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function s(t,e,n,r){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&r.call(t,n)}}t.exports=function(t,e,n,i,s){return"function"==typeof t.addEventListener?r.apply(null,arguments):"function"==typeof n?r.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return r(t,e,n,i,s)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),r=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return r(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),r=document.createRange();r.selectNodeContents(t),i.removeAllRanges(),i.addRange(r),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function r(){i.off(t,r),e.apply(n,arguments)}return r._=e,this.on(t,r,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,r=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple helpers");r.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(r.toString.call(t)===p)r.extend(this.partials,t);else{if(void 0===e)throw new s.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(r.toString.call(t)===p){if(e)throw new s.default("Arg not supported with multiple decorators");r.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=r.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,r=/[&<>"'`=]/;function s(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):r(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return s(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var r=n(13).default,s=n(1).default;e.__esModule=!0;var a=n(5),_=s(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new _.default("Must pass iterator to #each");var n,s=e.fn,u=e.inverse,p=0,l="",h=void 0,c=void 0;function d(e,n,i){h&&(h.key=e,h.index=n,h.first=0===n,h.last=!!i,c&&(h.contextPath=c+e)),l+=s(t[e],{data:h,blockParams:a.blockParams([t[e],e],[c+e,null])})}if(e.data&&e.ids&&(c=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(h=a.createFrame(e.data)),t&&"object"===o(t))if(a.isArray(t))for(var f=t.length;p=0?e:parseInt(t,10)}return t},log:function(t){if(t=r.lookupLevel(t),"undefined"!=typeof console&&r.lookupLevel(r.level)<=t){var e=r.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),s=1;s=p.LAST_COMPATIBLE_COMPILER_REVISION&&e<=p.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),r.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:r[r.length-(y||1)].first_line,last_line:r[r.length-1].last_line,first_column:r[r.length-(y||1)].first_column,last_column:r[r.length-1].last_column},l&&(w._$.range=[r[r.length-(y||1)].range[0],r[r.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,r)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),r=r.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),r.push(w._$),b=s[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var r=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[r[0],r[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,r;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var s=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((r=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=r.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:r?r[r.length-1].length-r[r.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,s[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function r(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(r(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(r(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(r(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=r(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=r(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var r=i(n(49));function s(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],r=t[e-2];return i?"ContentStatement"===i.type?(r||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],r=t[e+2];return i?"ContentStatement"===i.type?(r||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var r=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==r}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var r=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==r,i.leftStripped}}s.prototype=new r.default,s.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,r=0,s=i.length;r0)throw new r.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:s,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,r,s){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:r,loc:this.locInfo(s)}},e.prepareRawBlock=function(t,e,n,i){s(t,n),i=this.locInfo(i);var r={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:r,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&s(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new r.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return s(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var r=i(n(6));function s(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new r.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,r=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),r=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(r,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new s.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function r(){var i=n.parse(t,e),r=(new n.Compiler).compile(i,e),s=(new n.JavaScriptCompiler).compile(r,e,void 0,!0);return n.template(s)}function o(t,e){return i||(i=r()),i.call(this,t,e)}return o._setup=function(t){return i||(i=r()),i._setup(t)},o._child=function(t,e,n,s){return i||(i=r()),i._child(t,e,n,s)},o};var s=r(n(6)),a=n(5),o=r(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new s.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,r="SubExpression"===t.name.type;r&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",r,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,r=i.parts[0],s=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",r,s)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),r=t.path,a=r.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new s.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);r.strict=!0,r.falsy=!0,this.accept(r),this.opcode("invokeHelper",i.length,r.original,o.default.helpers.simpleId(r))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,r]}}}},function(t,e,n){"use strict";var i=n(13).default,r=n(1).default;e.__esModule=!0;var s=n(4),a=r(n(6)),o=n(5),_=r(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=s.COMPILER_REVISION;return[t,s.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var r=t.opcodes,s=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=r.length;_0&&(n+=", "+r.join(", "));var s=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++s+"="+t,i.children[0]="alias"+s)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,r=void 0,s=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(s?t.prepend(" + "):s=t,a=t):(s&&(r?s.prepend("buffer += "):i=!0,a.add(";"),s=a=void 0),r=!0,e||(n=!1))})),n?s?(s.prepend("return "),a.add(";")):r||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),s?(s.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var r=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[r++])),this.resolvePath("context",t,r,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,r){var s=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var r=e.popStack(),s=0,a=n.length;for(t&&a--;sthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(s);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",s=p[4],p[5]&&(_=u+p[5]),s=s.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(s)if(r){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,s=r(u+s,new l)}else{var h=e.whitespace_before;h&&(s=s.replace(new RegExp("\n("+h+")?","g"),"\n")),s=u+s.replace(/\n/g,"\n"+u)}o&&(s=s?o+s+"\n"+_:o+_),t.print_newline(!1),s&&(e.text=s,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var r=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,r){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&r.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var s=!1;s=(s=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(r.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==r.type,(n.is_content_unformatted||n.is_unformatted)&&(s=!1),s&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===r.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function r(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}r.prototype=new i,t.exports.Options=r},function(t,e,n){var i=n(9).Tokenizer,r=n(9).TOKEN,s=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:r.START,RAW:r.RAW,EOF:r.EOF},u=new s(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),r=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:r.starting_with(/{{!--/).until_after(/--}}/),handlebars:r.starting_with(/{{/).until_after(/}}/),handlebars_open:r.until(/[\n\r\t }]/),handlebars_raw_close:r.until(/}}/),comment:r.starting_with(//),cdata:r.starting_with(//),conditional_comment:r.starting_with(//),processing:r.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var s=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=r.matching(s).until_after(s)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,r="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var s=this._input.next();s+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,s)}else(r=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,r):this._create_token(_.ATTRIBUTE,r));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var r=e.opened.text.substr(1).toLowerCase();if("script"===r||"style"===r){var s=this._read_comment_or_cdata(t);if(s)return s.type=_.TEXT,s;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(r)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(18);a=n}();var o=a;i=[n,n(386),n(387)],r=function(t){var e=n(386),i=n(387);return{html_beautify:function(t,n){return o(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===r||(t.exports=r)}()},386:function(t,e){var n;function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}!function(){var r;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,r=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new r}},function(t,e,n){var i=n(2).Output,r=n(3).Token,s=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new r(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&s.lineBreak.test(t||"")&&(e=t.match(s.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var r=t.comments_before.next();r;)this.handle_whitespace_and_comments(r,e),this.handle_token(r,e),r=t.comments_before.next();if(i)for(var s=0;s0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,r=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var s=0,a=null;this._flags.inline_frame=!0;do{if(s+=1,(a=this._tokens.peek(s-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(r||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var r=!0,s=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?r=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),r=!(this._output.just_added_newline()||b),this._output.space_before_token=r,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),r=!1;var v=this._tokens.peek();s=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),r=this._flags.last_token.type===p.START_BLOCK,s=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),r=!1,s=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(r=!0),this._flags.last_token.type===p.RESERVED?r=!0:this._flags.last_token.type===p.END_EXPR?r=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(r=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(s=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||r,this.print_token(t),this._output.space_before_token=s}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):s.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(s.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),r=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(r=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var r=this.__lines[i];if(r.is_empty())break;if(0!==r.item(0).indexOf(t)&&r.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",r="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",s="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])*";e.identifier=new RegExp(s+a,"g"),e.identifierStart=new RegExp(s),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+r+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,r=["before-newline","after-newline","preserve-newline"];function s(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var s=0;s>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){r.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new r)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,r=new i(t),s=null;for(;r.hasNext();)if((s=r.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=s[0]),"\\"===r.peek()){if(r.next(),"x"===r.peek())s=r.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==r.peek()){e+="\\",r.hasNext()&&(e+=r.next());continue}s=r.match(/u([0-9A-Fa-f]{4})/g)}if(!s)return t;if((n=parseInt(s[1],16))>126&&n<=255&&0===s[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+s[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,r=!1;this._input.hasNext()&&(i||r||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?r=!0:"]"===this._input.peek()&&(r=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var r=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),s=0===r.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===r||s&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,r;"'"===t?r=this.__patterns.single_quote:'"'===t?r=this.__patterns.double_quote:"`"===t?r=this.__patterns.template_text:"}"===t&&(r=this.__patterns.template_expression);for(var s=r.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),s+=a+=r.read()}return s},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,r=n(3).Token,s=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new s,this._reset();for(var e=new r(o.START,""),n=null,i=[],a=new s;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new s),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new r(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}s.prototype=new i,s.prototype._create=function(){return new s(this._input,this)},s.prototype._update=function(){this.__set_templated_pattern()},s.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},s.prototype.read_options=function(t){var e=this._create();for(var n in r)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},s.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},s.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},s.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},s.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=s}],e={};var n=function n(i){var r=e[i];if(void 0!==r)return r.exports;var s=e[i]={exports:{}};return t[i](s,s.exports,n),s.exports}(0);r=n}();var s=r;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},406:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var r=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],s=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},173:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof s?new s(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof s)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof s)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new s(h,g?r.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,r={value:n,prev:e,next:i};return e.next=r,i.prev=r,t.length++,r}function p(t,e,n){for(var i=e.next,r=0;r"+s.content+""},!t.document)return t.addEventListener?(r.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,s=n.code,a=n.immediateClose;t.postMessage(r.highlight(s,r.languages[i],i)),a&&t.close()}),!1),r):r;var l=r.util.currentScript();function h(){r.manual||r.highlightAll()}if(l&&(r.filename=l.src,l.hasAttribute("data-manual")&&(r.manual=!0)),!r.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return r}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},404:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},r={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:r,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:r})}(Prism)},403:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},409:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},400:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},402:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},407:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,r=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),s=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+r+s+"(?:"+r+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+r+s+")(?:"+r+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+r+")"+s+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+r+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},396:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,r,s){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(r,(function(t){if("function"==typeof s&&!s(t))return t;for(var r,o=a.length;-1!==n.code.indexOf(r=e(i,o));)++o;return a[o]=t,r})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var r=0,s=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=s.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=s[r],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++r;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},397:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var r={};r[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",r)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},405:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},398:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},401:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},408:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",r=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),s=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+r+"|"+s+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(s),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},174:function(t){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},e(t)}!function(){if("undefined"!=typeof Prism){var n=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},i={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};r.prototype={setDefaults:function(t){this.defaults=n(this.defaults,t)},normalize:function(t,e){for(var i in e=n(this.defaults,e)){var r=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==r&&e[i]&&this[r]&&(t=this[r].call(this,t,e[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=r),Prism.plugins.NormalizeWhitespace=new r({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var n=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var r=t.element.parentNode;if(t.code&&r&&"pre"===r.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),i)if(Object.hasOwnProperty.call(i,s)){var a=i[s];if(r.hasAttribute("data-"+s))try{var o=JSON.parse(r.getAttribute("data-"+s)||"true");e(o)===a&&(t.settings[s]=o)}catch(f){}}for(var _=r.childNodes,u="",p="",l=!1,h=0;h<_.length;++h){var c=_[h];c==t.element?l=!0:"#text"===c.nodeName&&(l?p+=c.nodeValue:u+=c.nodeValue,r.removeChild(c),--h)}if(t.element.children.length&&Prism.plugins.KeepMarkup){var d=u+t.element.innerHTML+p;t.element.innerHTML=n.normalize(d,t.settings),t.code=t.element.textContent}else t.code=u+t.code+p,t.code=n.normalize(t.code,t.settings)}}else t.code=n.normalize(t.code,t.settings)}))}function r(t){this.defaults=n({},t)}function s(t){for(var e=0,n=0;n=0;--r){var s=this.tryEntries[r],a=s.completion;if("root"===s.tryLoc)return i("end");if(s.tryLoc<=this.prev){var o=n.call(s,"catchLoc"),_=n.call(s,"finallyLoc");if(o&&_){if(this.prev=0;--i){var r=this.tryEntries[i];if(r.tryLoc<=this.prev&&n.call(r,"finallyLoc")&&this.prev=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),O(n),c}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var i=n.completion;if("throw"===i.type){var r=i.arg;O(n)}return r}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,n){return this.delegate={iterator:A(t),resultName:e,nextLoc:n},"next"===this.method&&(this.arg=void 0),c}},t}function s(t,e,n,i){return new(n||(n=Promise))((function(r,s){function a(t){try{_(i.next(t))}catch(e){s(e)}}function o(t){try{_(i.throw(t))}catch(e){s(e)}}function _(t){var e;t.done?r(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(a,o)}_((i=i.apply(t,e||[])).next())}))}n.d(e,{X5:function(){return o}});var a=300;function o(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(this,void 0,void 0,r().mark((function n(){var i,s,o;return r().wrap((function(n){for(;;)switch(n.prev=n.next){case 0:if(t instanceof Element||t instanceof Window){n.next=2;break}throw new Error("element passed to scrollTo() must be either the window or a DOM element, you passed ".concat(t,"!"));case 2:return e=u(e),i=function e(n,i,r,s){var o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:a,_=arguments.length>5?arguments[5]:void 0,u=arguments.length>6?arguments[6]:void 0;window.requestAnimationFrame((function(){var a=Date.now(),p=Math.min(1,(a-s)/o);if(n===i)return u?u():null;l(t,_(p)*(i-n)+n),p<1?e(n,i,r,s,o,_,u):u&&u()}))},s=p(t),o=_(t),n.abrupt("return",new Promise((function(t){i(s,"number"==typeof e.top?e.top:s,o,Date.now(),e.duration,d(e.easing),t)})));case 7:case"end":return n.stop()}}),n)})))}function _(t){var e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}};return t instanceof Window?e.window.y:e.element.y}function u(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=a),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}function p(t){var e=h.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}function l(t,e){var n=h.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}var h={getDocument:function(){return document}},c={linear:function(t){return t},"ease-in":function(t){return t*t},"ease-out":function(t){return t*(2-t)},"ease-in-out":function(t){return t<.5?2*t*t:(4-2*t)*t-1}},d=function(t){var e=c[t||"linear"];if(!e){var n=Object.keys(c).join(",");throw new Error('Scroll error: scroller does not support an easing option of "'.concat(t,'". Supported options are ').concat(n))}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-9d131fbad93c294f5a13.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-9d131fbad93c294f5a13.js.LICENSE.txt new file mode 100644 index 0000000000..f4f3f5d942 --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-9d131fbad93c294f5a13.js.LICENSE.txt @@ -0,0 +1,94 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/4-chunk-efb48caad6ff1a4474f5.modern.js b/version/v2.18.3/styleguide/js/4-chunk-efb48caad6ff1a4474f5.modern.js new file mode 100644 index 0000000000..1a04a2daaa --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-efb48caad6ff1a4474f5.modern.js @@ -0,0 +1,2 @@ +/*! For license information please see 4-chunk-efb48caad6ff1a4474f5.modern.js.LICENSE.txt */ +(self.webpackChunk_pattern_lab_uikit_workshop=self.webpackChunk_pattern_lab_uikit_workshop||[]).push([[4],{15:function(t){var e;e=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var i=n(279),s=n.n(i),r=n(370),a=n.n(r),o=n(817),_=n.n(o);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var p=function(t){var e=_()(t);return u("cut"),e},l=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var i=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(i,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var i=_()(n);return u("copy"),n.remove(),i},h=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=l(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=l(t.value,e):(n=_()(t),u("copy")),n};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var d=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,i=t.container,s=t.target,r=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==s){if(!s||"object"!==c(s)||1!==s.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&s.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(s.hasAttribute("readonly")||s.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return r?h(r,{container:i}):s?"cut"===n?p(s):h(s,{container:i}):void 0};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===f(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",i=d({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(i?"success":"error",{action:n,text:i,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return k("action",t)}},{key:"defaultTarget",value:function(t){var e=k("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return k("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],i=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return h(t,e)}},{key:"cut",value:function(t){return p(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),i&&g(e,i),r}(s()),x=w},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var i=n(828);function s(t,e,n,i,s){var a=r.apply(this,arguments);return t.addEventListener(n,a,s),{destroy:function(){t.removeEventListener(n,a,s)}}}function r(t,e,n,s){return function(n){n.delegateTarget=i(n.target,e),n.delegateTarget&&s.call(t,n)}}t.exports=function(t,e,n,i,r){return"function"==typeof t.addEventListener?s.apply(null,arguments):"function"==typeof n?s.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return s(t,e,n,i,r)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var i=n(879),s=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!i.string(e))throw new TypeError("Second argument must be a String");if(!i.fn(n))throw new TypeError("Third argument must be a Function");if(i.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(i.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(i.string(t))return function(t,e,n){return s(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var i=window.getSelection(),s=document.createRange();s.selectNodeContents(t),i.removeAllRanges(),i.addRange(s),e=i.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var i=this.e||(this.e={});return(i[t]||(i[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var i=this;function s(){i.off(t,s),e.apply(n,arguments)}return s._=e,this.on(t,s,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),i=0,s=n.length;i= 2.0.0-beta.1",7:">= 4.0.0 <4.3.0",8:">= 4.3.0"};var p="[object Object]";function l(t,e,n){this.helpers=t||{},this.partials=e||{},this.decorators=n||{},a.registerDefaultHelpers(this),o.registerDefaultDecorators(this)}l.prototype={constructor:l,logger:_.default,log:_.default.log,registerHelper:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple helpers");s.extend(this.helpers,t)}else this.helpers[t]=e},unregisterHelper:function(t){delete this.helpers[t]},registerPartial:function(t,e){if(s.toString.call(t)===p)s.extend(this.partials,t);else{if(void 0===e)throw new r.default('Attempting to register a partial called "'+t+'" as undefined');this.partials[t]=e}},unregisterPartial:function(t){delete this.partials[t]},registerDecorator:function(t,e){if(s.toString.call(t)===p){if(e)throw new r.default("Arg not supported with multiple decorators");s.extend(this.decorators,t)}else this.decorators[t]=e},unregisterDecorator:function(t){delete this.decorators[t]},resetLoggedPropertyAccesses:function(){u.resetLoggedProperties()}};var h=_.default.log;e.log=h,e.createFrame=s.createFrame,e.logger=_.default},function(t,e){"use strict";e.__esModule=!0,e.extend=a,e.indexOf=function(t,e){for(var n=0,i=t.length;n":">",'"':""","'":"'","`":"`","=":"="},i=/[&<>"'`=]/g,s=/[&<>"'`=]/;function r(t){return n[t]}function a(t){for(var e=1;e0?(n.ids&&(n.ids=[n.name]),t.helpers.each(e,n)):s(this);if(n.data&&n.ids){var a=i.createFrame(n.data);a.contextPath=i.appendContextPath(n.data.contextPath,n.name),n={data:a}}return r(e,n)}))},t.exports=e.default},function(t,e,n){(function(i){"use strict";var s=n(13).default,r=n(1).default;e.__esModule=!0;var a=n(5),o=r(n(6));e.default=function(t){t.registerHelper("each",(function(t,e){if(!e)throw new o.default("Must pass iterator to #each");var n,r=e.fn,_=e.inverse,u=0,p="",l=void 0,h=void 0;function c(e,n,i){l&&(l.key=e,l.index=n,l.first=0===n,l.last=!!i,h&&(l.contextPath=h+e)),p+=r(t[e],{data:l,blockParams:a.blockParams([t[e],e],[h+e,null])})}if(e.data&&e.ids&&(h=a.appendContextPath(e.data.contextPath,e.ids[0])+"."),a.isFunction(t)&&(t=t.call(this)),e.data&&(l=a.createFrame(e.data)),t&&"object"==typeof t)if(a.isArray(t))for(var d=t.length;u=0?e:parseInt(t,10)}return t},log:function(t){if(t=s.lookupLevel(t),"undefined"!=typeof console&&s.lookupLevel(s.level)<=t){var e=s.methodMap[t];console[e]||(e="log");for(var n=arguments.length,i=Array(n>1?n-1:0),r=1;r=u.LAST_COMPATIBLE_COMPILER_REVISION&&e<=u.COMPILER_REVISION)){if(e2&&v.push("'"+this.terminals_[m]+"'");x=this.lexer.showPosition?"Parse error on line "+(o+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[h]||h)+"'":"Parse error on line "+(o+1)+": Unexpected "+(1==h?"end of input":"'"+(this.terminals_[h]||h)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[h]||h,line:this.lexer.yylineno,loc:p,expected:v})}}if(f[0]instanceof Array&&f.length>1)throw new Error("Parse Error: multiple actions possible at state: "+d+", token: "+h);switch(f[0]){case 1:n.push(h),i.push(this.lexer.yytext),s.push(this.lexer.yylloc),n.push(f[1]),h=null,c?(h=c,c=null):(_=this.lexer.yyleng,a=this.lexer.yytext,o=this.lexer.yylineno,p=this.lexer.yylloc,u>0&&u--);break;case 2:if(y=this.productions_[f[1]][1],w.$=i[i.length-y],w._$={first_line:s[s.length-(y||1)].first_line,last_line:s[s.length-1].last_line,first_column:s[s.length-(y||1)].first_column,last_column:s[s.length-1].last_column},l&&(w._$.range=[s[s.length-(y||1)].range[0],s[s.length-1].range[1]]),void 0!==(g=this.performAction.call(w,a,_,o,this.yy,f[1],i,s)))return g;y&&(n=n.slice(0,-1*y*2),i=i.slice(0,-1*y),s=s.slice(0,-1*y)),n.push(this.productions_[f[1]][0]),i.push(w.$),s.push(w._$),b=r[n[n.length-2]][n[n.length-1]],n.push(b);break;case 3:return!0}}return!0}},e=function(){var t={EOF:1,parseError:function(t,e){if(!this.yy.parser)throw new Error(t);this.yy.parser.parseError(t,e)},setInput:function(t){return this._input=t,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var t=this._input[0];return this.yytext+=t,this.yyleng++,this.offset++,this.match+=t,this.matched+=t,t.match(/(?:\r\n?|\n).*/g)?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),t},unput:function(t){var e=t.length,n=t.split(/(?:\r\n?|\n)/g);this._input=t+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-e-1),this.offset-=e;var i=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),n.length-1&&(this.yylineno-=n.length-1);var s=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:n?(n.length===i.length?this.yylloc.first_column:0)+i[i.length-n.length].length-n[0].length:this.yylloc.first_column-e},this.options.ranges&&(this.yylloc.range=[s[0],s[0]+this.yyleng-e]),this},more:function(){return this._more=!0,this},less:function(t){this.unput(this.match.slice(t))},pastInput:function(){var t=this.matched.substr(0,this.matched.length-this.match.length);return(t.length>20?"...":"")+t.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var t=this.match;return t.length<20&&(t+=this._input.substr(0,20-t.length)),(t.substr(0,20)+(t.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var t=this.pastInput(),e=new Array(t.length+1).join("-");return t+this.upcomingInput()+"\n"+e+"^"},next:function(){if(this.done)return this.EOF;var t,e,n,i,s;this._input||(this.done=!0),this._more||(this.yytext="",this.match="");for(var r=this._currentRules(),a=0;ae[0].length)||(e=n,i=a,this.options.flex));a++);return e?((s=e[0].match(/(?:\r\n?|\n).*/g))&&(this.yylineno+=s.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:s?s[s.length-1].length-s[s.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+e[0].length},this.yytext+=e[0],this.match+=e[0],this.matches=e,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(e[0].length),this.matched+=e[0],t=this.performAction.call(this,this.yy,this,r[i],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),t||void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var t=this.next();return void 0!==t?t:this.lex()},begin:function(t){this.conditionStack.push(t)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(t){this.begin(t)},options:{},performAction:function(t,e,n,i){function s(t,n){return e.yytext=e.yytext.substring(t,e.yyleng-n+t)}switch(n){case 0:if("\\\\"===e.yytext.slice(-2)?(s(0,1),this.begin("mu")):"\\"===e.yytext.slice(-1)?(s(0,1),this.begin("emu")):this.begin("mu"),e.yytext)return 15;break;case 1:case 5:return 15;case 2:return this.popState(),15;case 3:return this.begin("raw"),15;case 4:return this.popState(),"raw"===this.conditionStack[this.conditionStack.length-1]?15:(s(5,9),"END_RAW_BLOCK");case 6:case 22:return this.popState(),14;case 7:return 65;case 8:return 68;case 9:return 19;case 10:return this.popState(),this.begin("raw"),23;case 11:return 55;case 12:return 60;case 13:return 29;case 14:return 47;case 15:case 16:return this.popState(),44;case 17:return 34;case 18:return 39;case 19:return 51;case 20:case 23:return 48;case 21:this.unput(e.yytext),this.popState(),this.begin("com");break;case 24:return 73;case 25:case 26:case 41:return 72;case 27:return 87;case 28:break;case 29:return this.popState(),54;case 30:return this.popState(),33;case 31:return e.yytext=s(1,2).replace(/\\"/g,'"'),80;case 32:return e.yytext=s(1,2).replace(/\\'/g,"'"),80;case 33:return 85;case 34:case 35:return 82;case 36:return 83;case 37:return 84;case 38:return 81;case 39:return 75;case 40:return 77;case 42:return e.yytext=e.yytext.replace(/\\([\\\]])/g,"$1"),72;case 43:return"INVALID";case 44:return 5}},rules:[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{(?=[^\/]))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]+?(?=(\{\{\{\{)))/,/^(?:[\s\S]*?--(~)?\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#>)/,/^(?:\{\{(~)?#\*?)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{(~)?!--)/,/^(?:\{\{(~)?![\s\S]*?\}\})/,/^(?:\{\{(~)?\*?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)|])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:undefined(?=([~}\s)])))/,/^(?:null(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:as\s+\|)/,/^(?:\|)/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)|]))))/,/^(?:\[(\\\]|[^\]])*\])/,/^(?:.)/,/^(?:$)/],conditions:{mu:{rules:[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[6],inclusive:!1},raw:{rules:[3,4,5],inclusive:!1},INITIAL:{rules:[0,1,44],inclusive:!0}}};return t}();function n(){this.yy={}}return t.lexer=e,n.prototype=t,t.Parser=n,new n}();e.default=n,t.exports=e.default},function(t,e,n){"use strict";var i=n(1).default;e.__esModule=!0;var s=i(n(49));function r(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0];this.options=t}function a(t,e,n){void 0===e&&(e=t.length);var i=t[e-1],s=t[e-2];return i?"ContentStatement"===i.type?(s||!n?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(i.original):void 0:n}function o(t,e,n){void 0===e&&(e=-1);var i=t[e+1],s=t[e+2];return i?"ContentStatement"===i.type?(s||!n?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(i.original):void 0:n}function _(t,e,n){var i=t[null==e?0:e+1];if(i&&"ContentStatement"===i.type&&(n||!i.rightStripped)){var s=i.value;i.value=i.value.replace(n?/^\s+/:/^[ \t]*\r?\n?/,""),i.rightStripped=i.value!==s}}function u(t,e,n){var i=t[null==e?t.length-1:e-1];if(i&&"ContentStatement"===i.type&&(n||!i.leftStripped)){var s=i.value;return i.value=i.value.replace(n?/\s+$/:/[ \t]+$/,""),i.leftStripped=i.value!==s,i.leftStripped}}r.prototype=new s.default,r.prototype.Program=function(t){var e=!this.options.ignoreStandalone,n=!this.isRootSeen;this.isRootSeen=!0;for(var i=t.body,s=0,r=i.length;s0)throw new s.default("Invalid path: "+i,{loc:n});".."===u&&a++}}return{type:"PathExpression",data:t,depth:a,parts:r,original:i,loc:n}},e.prepareMustache=function(t,e,n,i,s,r){var a=i.charAt(3)||i.charAt(2),o="{"!==a&&"&"!==a;return{type:/\*/.test(i)?"Decorator":"MustacheStatement",path:t,params:e,hash:n,escaped:o,strip:s,loc:this.locInfo(r)}},e.prepareRawBlock=function(t,e,n,i){r(t,n),i=this.locInfo(i);var s={type:"Program",body:e,strip:{},loc:i};return{type:"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:s,openStrip:{},inverseStrip:{},closeStrip:{},loc:i}},e.prepareBlock=function(t,e,n,i,a,o){i&&i.path&&r(t,i);var _=/\*/.test(t.open);e.blockParams=t.blockParams;var u=void 0,p=void 0;if(n){if(_)throw new s.default("Unexpected inverse block on decorator",n);n.chain&&(n.program.body[0].closeStrip=i.strip),p=n.strip,u=n.program}return a&&(a=u,u=e,e=a),{type:_?"DecoratorBlock":"BlockStatement",path:t.path,params:t.params,hash:t.hash,program:e,inverse:u,openStrip:t.strip,inverseStrip:p,closeStrip:i&&i.strip,loc:this.locInfo(o)}},e.prepareProgram=function(t,e){if(!e&&t.length){var n=t[0].loc,i=t[t.length-1].loc;n&&i&&(e={source:n.source,start:{line:n.start.line,column:n.start.column},end:{line:i.end.line,column:i.end.column}})}return{type:"Program",body:t,strip:{},loc:e}},e.preparePartialBlock=function(t,e,n,i){return r(t,n),{type:"PartialBlockStatement",name:t.path,params:t.params,hash:t.hash,program:e,openStrip:t.strip,closeStrip:n&&n.strip,loc:this.locInfo(i)}};var s=i(n(6));function r(t,e){if(e=e.path?e.path.original:e,t.path.original!==e){var n={loc:t.path.loc};throw new s.default(t.path.original+" doesn't match "+e,n)}}},function(t,e,n){"use strict";var i=n(34).default,s=n(1).default;e.__esModule=!0,e.Compiler=u,e.precompile=function(t,e,n){if(null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+t);"data"in(e=e||{})||(e.data=!0),e.compat&&(e.useDepths=!0);var i=n.parse(t,e),s=(new n.Compiler).compile(i,e);return(new n.JavaScriptCompiler).compile(s,e)},e.compile=function(t,e,n){if(void 0===e&&(e={}),null==t||"string"!=typeof t&&"Program"!==t.type)throw new r.default("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+t);"data"in(e=a.extend({},e))||(e.data=!0),e.compat&&(e.useDepths=!0);var i=void 0;function s(){var i=n.parse(t,e),s=(new n.Compiler).compile(i,e),r=(new n.JavaScriptCompiler).compile(s,e,void 0,!0);return n.template(r)}function o(t,e){return i||(i=s()),i.call(this,t,e)}return o._setup=function(t){return i||(i=s()),i._setup(t)},o._child=function(t,e,n,r){return i||(i=s()),i._child(t,e,n,r)},o};var r=s(n(6)),a=n(5),o=s(n(45)),_=[].slice;function u(){}function p(t,e){if(t===e)return!0;if(a.isArray(t)&&a.isArray(e)&&t.length===e.length){for(var n=0;n1)throw new r.default("Unsupported number of partial arguments: "+n.length,t);n.length||(this.options.explicitPartialContext?this.opcode("pushLiteral","undefined"):n.push({type:"PathExpression",parts:[],depth:0}));var i=t.name.original,s="SubExpression"===t.name.type;s&&this.accept(t.name),this.setupFullMustacheParams(t,e,void 0,!0);var a=t.indent||"";this.options.preventIndent&&a&&(this.opcode("appendContent",a),a=""),this.opcode("invokePartial",s,i,a),this.opcode("append")},PartialBlockStatement:function(t){this.PartialStatement(t)},MustacheStatement:function(t){this.SubExpression(t),t.escaped&&!this.options.noEscape?this.opcode("appendEscaped"):this.opcode("append")},Decorator:function(t){this.DecoratorBlock(t)},ContentStatement:function(t){t.value&&this.opcode("appendContent",t.value)},CommentStatement:function(){},SubExpression:function(t){l(t);var e=this.classifySexpr(t);"simple"===e?this.simpleSexpr(t):"helper"===e?this.helperSexpr(t):this.ambiguousSexpr(t)},ambiguousSexpr:function(t,e,n){var i=t.path,s=i.parts[0],r=null!=e||null!=n;this.opcode("getContext",i.depth),this.opcode("pushProgram",e),this.opcode("pushProgram",n),i.strict=!0,this.accept(i),this.opcode("invokeAmbiguous",s,r)},simpleSexpr:function(t){var e=t.path;e.strict=!0,this.accept(e),this.opcode("resolvePossibleLambda")},helperSexpr:function(t,e,n){var i=this.setupFullMustacheParams(t,e,n),s=t.path,a=s.parts[0];if(this.options.knownHelpers[a])this.opcode("invokeKnownHelper",i.length,a);else{if(this.options.knownHelpersOnly)throw new r.default("You specified knownHelpersOnly, but used the unknown helper "+a,t);s.strict=!0,s.falsy=!0,this.accept(s),this.opcode("invokeHelper",i.length,s.original,o.default.helpers.simpleId(s))}},PathExpression:function(t){this.addDepth(t.depth),this.opcode("getContext",t.depth);var e=t.parts[0],n=o.default.helpers.scopedId(t),i=!t.depth&&!n&&this.blockParamIndex(e);i?this.opcode("lookupBlockParam",i,t.parts):e?t.data?(this.options.data=!0,this.opcode("lookupData",t.depth,t.parts,t.strict)):this.opcode("lookupOnContext",t.parts,t.falsy,t.strict,n):this.opcode("pushContext")},StringLiteral:function(t){this.opcode("pushString",t.value)},NumberLiteral:function(t){this.opcode("pushLiteral",t.value)},BooleanLiteral:function(t){this.opcode("pushLiteral",t.value)},UndefinedLiteral:function(){this.opcode("pushLiteral","undefined")},NullLiteral:function(){this.opcode("pushLiteral","null")},Hash:function(t){var e=t.pairs,n=0,i=e.length;for(this.opcode("pushHash");n=0)return[e,s]}}}},function(t,e,n){"use strict";var i=n(13).default,s=n(1).default;e.__esModule=!0;var r=n(4),a=s(n(6)),o=n(5),_=s(n(53));function u(t){this.value=t}function p(){}p.prototype={nameLookup:function(t,e){return this.internalNameLookup(t,e)},depthedLookup:function(t){return[this.aliasable("container.lookup"),"(depths, ",JSON.stringify(t),")"]},compilerInfo:function(){var t=r.COMPILER_REVISION;return[t,r.REVISION_CHANGES[t]]},appendToBuffer:function(t,e,n){return o.isArray(t)||(t=[t]),t=this.source.wrap(t,e),this.environment.isSimple?["return ",t,";"]:n?["buffer += ",t,";"]:(t.appendToBuffer=!0,t)},initializeBuffer:function(){return this.quotedString("")},internalNameLookup:function(t,e){return this.lookupPropertyFunctionIsUsed=!0,["lookupProperty(",t,",",JSON.stringify(e),")"]},lookupPropertyFunctionIsUsed:!1,compile:function(t,e,n,i){this.environment=t,this.options=e,this.stringParams=this.options.stringParams,this.trackIds=this.options.trackIds,this.precompile=!i,this.name=this.environment.name,this.isChild=!!n,this.context=n||{decorators:[],programs:[],environments:[]},this.preamble(),this.stackSlot=0,this.stackVars=[],this.aliases={},this.registers={list:[]},this.hashes=[],this.compileStack=[],this.inlineStack=[],this.blockParams=[],this.compileChildren(t,e),this.useDepths=this.useDepths||t.useDepths||t.useDecorators||this.options.compat,this.useBlockParams=this.useBlockParams||t.useBlockParams;var s=t.opcodes,r=void 0,o=void 0,_=void 0,u=void 0;for(_=0,u=s.length;_0&&(n+=", "+s.join(", "));var r=0;i(this.aliases).forEach((function(t){var i=e.aliases[t];i.children&&i.referenceCount>1&&(n+=", alias"+ ++r+"="+t,i.children[0]="alias"+r)})),this.lookupPropertyFunctionIsUsed&&(n+=", "+this.lookupPropertyFunctionVarDeclaration());var a=["container","depth0","helpers","partials","data"];(this.useBlockParams||this.useDepths)&&a.push("blockParams"),this.useDepths&&a.push("depths");var o=this.mergeSource(n);return t?(a.push(o),Function.apply(this,a)):this.source.wrap(["function(",a.join(","),") {\n ",o,"}"])},mergeSource:function(t){var e=this.environment.isSimple,n=!this.forceBuffer,i=void 0,s=void 0,r=void 0,a=void 0;return this.source.each((function(t){t.appendToBuffer?(r?t.prepend(" + "):r=t,a=t):(r&&(s?r.prepend("buffer += "):i=!0,a.add(";"),r=a=void 0),s=!0,e||(n=!1))})),n?r?(r.prepend("return "),a.add(";")):s||this.source.push('return "";'):(t+=", buffer = "+(i?"":this.initializeBuffer()),r?(r.prepend("return buffer + "),a.add(";")):this.source.push("return buffer;")),t&&this.source.prepend("var "+t.substring(2)+(i?"":";\n")),this.source.merge()},lookupPropertyFunctionVarDeclaration:function(){return"\n lookupProperty = container.lookupProperty || function(parent, propertyName) {\n if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {\n return parent[propertyName];\n }\n return undefined\n }\n ".trim()},blockValue:function(t){var e=this.aliasable("container.hooks.blockHelperMissing"),n=[this.contextName(0)];this.setupHelperArgs(t,0,n);var i=this.popStack();n.splice(1,0,i),this.push(this.source.functionCall(e,"call",n))},ambiguousBlockValue:function(){var t=this.aliasable("container.hooks.blockHelperMissing"),e=[this.contextName(0)];this.setupHelperArgs("",0,e,!0),this.flushInline();var n=this.topStack();e.splice(1,0,n),this.pushSource(["if (!",this.lastHelper,") { ",n," = ",this.source.functionCall(t,"call",e),"}"])},appendContent:function(t){this.pendingContent?t=this.pendingContent+t:this.pendingLocation=this.source.currentLocation,this.pendingContent=t},append:function(){if(this.isInline())this.replaceStack((function(t){return[" != null ? ",t,' : ""']})),this.pushSource(this.appendToBuffer(this.popStack()));else{var t=this.popStack();this.pushSource(["if (",t," != null) { ",this.appendToBuffer(t,void 0,!0)," }"]),this.environment.isSimple&&this.pushSource(["else { ",this.appendToBuffer("''",void 0,!0)," }"])}},appendEscaped:function(){this.pushSource(this.appendToBuffer([this.aliasable("container.escapeExpression"),"(",this.popStack(),")"]))},getContext:function(t){this.lastContext=t},pushContext:function(){this.pushStackLiteral(this.contextName(this.lastContext))},lookupOnContext:function(t,e,n,i){var s=0;i||!this.options.compat||this.lastContext?this.pushContext():this.push(this.depthedLookup(t[s++])),this.resolvePath("context",t,s,e,n)},lookupBlockParam:function(t,e){this.useBlockParams=!0,this.push(["blockParams[",t[0],"][",t[1],"]"]),this.resolvePath("context",e,1)},lookupData:function(t,e,n){t?this.pushStackLiteral("container.data(data, "+t+")"):this.pushStackLiteral("data"),this.resolvePath("data",e,0,!0,n)},resolvePath:function(t,e,n,i,s){var r=this;if(this.options.strict||this.options.assumeObjects)this.push(function(t,e,n,i){var s=e.popStack(),r=0,a=n.length;for(t&&a--;rthis.stackVars.length&&this.stackVars.push("stack"+this.stackSlot),this.topStackName()},topStackName:function(){return"stack"+this.stackSlot},flushInline:function(){var t=this.inlineStack;this.inlineStack=[];for(var e=0,n=t.length;e(\s*)(?=|]]>)$/.exec(r);if(!p)return void t.add_raw_token(e);o=u+p[1]+"\n",r=p[4],p[5]&&(_=u+p[5]),r=r.replace(/\n[ \t]*$/,""),(p[2]||-1!==p[3].indexOf("\n"))&&(p=p[3].match(/[ \t]+$/))&&(e.whitespace_before=p[0])}if(r)if(s){var l=function(){this.eol="\n"};l.prototype=this._options.raw_options,r=s(u+r,new l)}else{var h=e.whitespace_before;h&&(r=r.replace(new RegExp("\n("+h+")?","g"),"\n")),r=u+r.replace(/\n/g,"\n"+u)}o&&(r=r?o+r+"\n"+_:o+_),t.print_newline(!1),r&&(e.text=r,e.whitespace_before="",e.newlines=0,t.add_raw_token(e),t.print_newline(!0))}},d.prototype._handle_tag_open=function(t,e,n,i){var s=this._get_tag_open_token(e);return!n.is_unformatted&&!n.is_content_unformatted||n.is_empty_element||e.type!==a.TAG_OPEN||0!==e.text.indexOf("]*)/),this.tag_check=n?n[1]:""):(n=e.text.match(/^{{~?(?:[\^]|#\*?)?([^\s}]+)/),this.tag_check=n?n[1]:"",(e.text.startsWith("{{#>")||e.text.startsWith("{{~#>"))&&">"===this.tag_check[0]&&(">"===this.tag_check&&null!==e.next?this.tag_check=e.next.text.split(" ")[0]:this.tag_check=e.text.split(">")[1])),this.tag_check=this.tag_check.toLowerCase(),e.type===a.COMMENT&&(this.tag_complete=!0),this.is_start_tag="/"!==this.tag_check.charAt(0),this.tag_name=this.is_start_tag?this.tag_check:this.tag_check.substr(1),this.is_end_tag=!this.is_start_tag||e.closed&&"/>"===e.closed.text;var i=2;"{"===this.tag_start_char&&this.text.length>=3&&"~"===this.text.charAt(2)&&(i=3),this.is_end_tag=this.is_end_tag||"{"===this.tag_start_char&&(this.text.length<3||/[^#\^]/.test(this.text.charAt(i)))}else this.tag_complete=!0};d.prototype._get_tag_open_token=function(t){var e=new f(this._tag_stack.get_parser_token(),t);return e.alignment_size=this._options.wrap_attributes_indent_size,e.is_end_tag=e.is_end_tag||l(e.tag_check,this._options.void_elements),e.is_empty_element=e.tag_complete||e.is_start_tag&&e.is_end_tag,e.is_unformatted=!e.tag_complete&&l(e.tag_check,this._options.unformatted),e.is_content_unformatted=!e.is_empty_element&&l(e.tag_check,this._options.content_unformatted),e.is_inline_element=l(e.tag_name,this._options.inline)||e.tag_name.includes("-")||"{"===e.tag_start_char,e},d.prototype._set_tag_position=function(t,e,n,i,s){if(n.is_empty_element||(n.is_end_tag?n.start_tag_token=this._tag_stack.try_pop(n.tag_name):(this._do_optional_end_element(n)&&(n.is_inline_element||t.print_newline(!1)),this._tag_stack.record_tag(n),"script"!==n.tag_name&&"style"!==n.tag_name||n.is_unformatted||n.is_content_unformatted||(n.custom_beautifier_name=p(n.tag_check,e)))),l(n.tag_check,this._options.extra_liners)&&(t.print_newline(!1),t._output.just_added_blankline()||t.print_newline(!0)),n.is_empty_element){if("{"===n.tag_start_char&&"else"===n.tag_check)this._tag_stack.indent_to_tag(["if","unless","each"]),n.indent_content=!0,t.current_line_has_match(/{{#if/)||t.print_newline(!1);"!--"===n.tag_name&&s.type===a.TAG_CLOSE&&i.is_end_tag&&-1===n.text.indexOf("\n")||(n.is_inline_element||n.is_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n))}else if(n.is_end_tag){var r=!1;r=(r=n.start_tag_token&&n.start_tag_token.multiline_content)||!n.is_inline_element&&!(i.is_inline_element||i.is_unformatted)&&!(s.type===a.TAG_CLOSE&&n.start_tag_token===i)&&"TK_CONTENT"!==s.type,(n.is_content_unformatted||n.is_unformatted)&&(r=!1),r&&t.print_newline(!1)}else n.indent_content=!n.custom_beautifier_name,"<"===n.tag_start_char&&("html"===n.tag_name?n.indent_content=this._options.indent_inner_html:"head"===n.tag_name?n.indent_content=this._options.indent_head_inner_html:"body"===n.tag_name&&(n.indent_content=this._options.indent_body_inner_html)),n.is_inline_element||n.is_unformatted||"TK_CONTENT"===s.type&&!n.is_content_unformatted||t.print_newline(!1),this._calcluate_parent_multiline(t,n)},d.prototype._calcluate_parent_multiline=function(t,e){!e.parent||!t._output.just_added_newline()||(e.is_inline_element||e.is_unformatted)&&e.parent.is_inline_element||(e.parent.multiline_content=!0)};var g=["address","article","aside","blockquote","details","div","dl","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","hr","main","nav","ol","p","pre","section","table","ul"],m=["a","audio","del","ins","map","noscript","video"];d.prototype._do_optional_end_element=function(t){var e=null;if(!t.is_empty_element&&t.is_start_tag&&t.parent){if("body"===t.tag_name)e=e||this._tag_stack.try_pop("head");else if("li"===t.tag_name)e=e||this._tag_stack.try_pop("li",["ol","ul"]);else if("dd"===t.tag_name||"dt"===t.tag_name)e=(e=e||this._tag_stack.try_pop("dt",["dl"]))||this._tag_stack.try_pop("dd",["dl"]);else if("p"===t.parent.tag_name&&-1!==g.indexOf(t.tag_name)){var n=t.parent.parent;n&&-1!==m.indexOf(n.tag_name)||(e=e||this._tag_stack.try_pop("p"))}else"rp"===t.tag_name||"rt"===t.tag_name?e=(e=e||this._tag_stack.try_pop("rt",["ruby","rtc"]))||this._tag_stack.try_pop("rp",["ruby","rtc"]):"optgroup"===t.tag_name?e=e||this._tag_stack.try_pop("optgroup",["select"]):"option"===t.tag_name?e=e||this._tag_stack.try_pop("option",["select","datalist","optgroup"]):"colgroup"===t.tag_name?e=e||this._tag_stack.try_pop("caption",["table"]):"thead"===t.tag_name?e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]):"tbody"===t.tag_name||"tfoot"===t.tag_name?e=(e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("thead",["table"]))||this._tag_stack.try_pop("tbody",["table"]):"tr"===t.tag_name?e=(e=(e=e||this._tag_stack.try_pop("caption",["table"]))||this._tag_stack.try_pop("colgroup",["table"]))||this._tag_stack.try_pop("tr",["table","thead","tbody","tfoot"]):"th"!==t.tag_name&&"td"!==t.tag_name||(e=(e=e||this._tag_stack.try_pop("td",["table","thead","tbody","tfoot","tr"]))||this._tag_stack.try_pop("th",["table","thead","tbody","tfoot","tr"]));return t.parent=this._tag_stack.get_parser_token(),e}},t.exports.Beautifier=d},function(t,e,n){var i=n(6).Options;function s(t){i.call(this,t,"html"),1===this.templating.length&&"auto"===this.templating[0]&&(this.templating=["django","erb","handlebars","php"]),this.indent_inner_html=this._get_boolean("indent_inner_html"),this.indent_body_inner_html=this._get_boolean("indent_body_inner_html",!0),this.indent_head_inner_html=this._get_boolean("indent_head_inner_html",!0),this.indent_handlebars=this._get_boolean("indent_handlebars",!0),this.wrap_attributes=this._get_selection("wrap_attributes",["auto","force","force-aligned","force-expand-multiline","aligned-multiple","preserve","preserve-aligned"]),this.wrap_attributes_indent_size=this._get_number("wrap_attributes_indent_size",this.indent_size),this.extra_liners=this._get_array("extra_liners",["head","body","/html"]),this.inline=this._get_array("inline",["a","abbr","area","audio","b","bdi","bdo","br","button","canvas","cite","code","data","datalist","del","dfn","em","embed","i","iframe","img","input","ins","kbd","keygen","label","map","mark","math","meter","noscript","object","output","progress","q","ruby","s","samp","select","small","span","strong","sub","sup","svg","template","textarea","time","u","var","video","wbr","text","acronym","big","strike","tt"]),this.void_elements=this._get_array("void_elements",["area","base","br","col","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","basefont","isindex"]),this.unformatted=this._get_array("unformatted",[]),this.content_unformatted=this._get_array("content_unformatted",["pre","textarea"]),this.unformatted_content_delimiter=this._get_characters("unformatted_content_delimiter"),this.indent_scripts=this._get_selection("indent_scripts",["normal","keep","separate"])}s.prototype=new i,t.exports.Options=s},function(t,e,n){var i=n(9).Tokenizer,s=n(9).TOKEN,r=n(13).Directives,a=n(14).TemplatablePattern,o=n(12).Pattern,_={TAG_OPEN:"TK_TAG_OPEN",TAG_CLOSE:"TK_TAG_CLOSE",ATTRIBUTE:"TK_ATTRIBUTE",EQUALS:"TK_EQUALS",VALUE:"TK_VALUE",COMMENT:"TK_COMMENT",TEXT:"TK_TEXT",UNKNOWN:"TK_UNKNOWN",START:s.START,RAW:s.RAW,EOF:s.EOF},u=new r(/<\!--/,/-->/),p=function(t,e){i.call(this,t,e),this._current_tag_name="";var n=new a(this._input).read_options(this._options),s=new o(this._input);if(this.__patterns={word:n.until(/[\n\r\t <]/),single_quote:n.until_after(/'/),double_quote:n.until_after(/"/),attribute:n.until(/[\n\r\t =>]|\/>/),element_name:n.until(/[\n\r\t >\/]/),handlebars_comment:s.starting_with(/{{!--/).until_after(/--}}/),handlebars:s.starting_with(/{{/).until_after(/}}/),handlebars_open:s.until(/[\n\r\t }]/),handlebars_raw_close:s.until(/}}/),comment:s.starting_with(//),cdata:s.starting_with(//),conditional_comment:s.starting_with(//),processing:s.starting_with(/<\?/).until_after(/\?>/)},this._options.indent_handlebars&&(this.__patterns.word=this.__patterns.word.exclude("handlebars")),this._unformatted_content_delimiter=null,this._options.unformatted_content_delimiter){var r=this._input.get_literal_regexp(this._options.unformatted_content_delimiter);this.__patterns.unformatted_content_delimiter=s.matching(r).until_after(r)}};(p.prototype=new i)._is_comment=function(t){return!1},p.prototype._is_opening=function(t){return t.type===_.TAG_OPEN},p.prototype._is_closing=function(t,e){return t.type===_.TAG_CLOSE&&e&&((">"===t.text||"/>"===t.text)&&"<"===e.text[0]||"}}"===t.text&&"{"===e.text[0]&&"{"===e.text[1])},p.prototype._reset=function(){this._current_tag_name=""},p.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(_.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_open_handlebars(i,e))||this._read_attribute(i,t,e))||this._read_close(i,e))||this._read_raw_content(i,t,e))||this._read_content_word(i))||this._read_comment_or_cdata(i))||this._read_processing(i))||this._read_open(i,e))||this._create_token(_.UNKNOWN,this._input.next())},p.prototype._read_comment_or_cdata=function(t){var e=null,n=null,i=null;"<"===t&&("!"===this._input.peek(1)&&((n=this.__patterns.comment.read())?(i=u.get_directives(n))&&"start"===i.ignore&&(n+=u.readIgnored(this._input)):n=this.__patterns.cdata.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=i));return e},p.prototype._read_processing=function(t){var e=null,n=null;if("<"===t){var i=this._input.peek(1);"!"!==i&&"?"!==i||(n=(n=this.__patterns.conditional_comment.read())||this.__patterns.processing.read()),n&&((e=this._create_token(_.COMMENT,n)).directives=null)}return e},p.prototype._read_open=function(t,e){var n=null,i=null;return e||"<"===t&&(n=this._input.next(),"/"===this._input.peek()&&(n+=this._input.next()),n+=this.__patterns.element_name.read(),i=this._create_token(_.TAG_OPEN,n)),i},p.prototype._read_open_handlebars=function(t,e){var n=null,i=null;return e||this._options.indent_handlebars&&"{"===t&&"{"===this._input.peek(1)&&("!"===this._input.peek(2)?(n=(n=this.__patterns.handlebars_comment.read())||this.__patterns.handlebars.read(),i=this._create_token(_.COMMENT,n)):(n=this.__patterns.handlebars_open.read(),i=this._create_token(_.TAG_OPEN,n))),i},p.prototype._read_close=function(t,e){var n=null,i=null;return e&&("<"===e.text[0]&&(">"===t||"/"===t&&">"===this._input.peek(1))?(n=this._input.next(),"/"===t&&(n+=this._input.next()),i=this._create_token(_.TAG_CLOSE,n)):"{"===e.text[0]&&"}"===t&&"}"===this._input.peek(1)&&(this._input.next(),this._input.next(),i=this._create_token(_.TAG_CLOSE,"}}"))),i},p.prototype._read_attribute=function(t,e,n){var i=null,s="";if(n&&"<"===n.text[0])if("="===t)i=this._create_token(_.EQUALS,this._input.next());else if('"'===t||"'"===t){var r=this._input.next();r+='"'===t?this.__patterns.double_quote.read():this.__patterns.single_quote.read(),i=this._create_token(_.VALUE,r)}else(s=this.__patterns.attribute.read())&&(i=e.type===_.EQUALS?this._create_token(_.VALUE,s):this._create_token(_.ATTRIBUTE,s));return i},p.prototype._is_content_unformatted=function(t){return-1===this._options.void_elements.indexOf(t)&&(-1!==this._options.content_unformatted.indexOf(t)||-1!==this._options.unformatted.indexOf(t))},p.prototype._read_raw_content=function(t,e,n){var i="";if(n&&"{"===n.text[0])i=this.__patterns.handlebars_raw_close.read();else if(e.type===_.TAG_CLOSE&&"<"===e.opened.text[0]&&"/"!==e.text[0]){var s=e.opened.text.substr(1).toLowerCase();if("script"===s||"style"===s){var r=this._read_comment_or_cdata(t);if(r)return r.type=_.TEXT,r;i=this._input.readUntil(new RegExp("","ig"))}else this._is_content_unformatted(s)&&(i=this._input.readUntil(new RegExp("","ig")))}return i?this._create_token(_.TEXT,i):null},p.prototype._read_content_word=function(t){var e="";if(this._options.unformatted_content_delimiter&&t===this._options.unformatted_content_delimiter[0]&&(e=this.__patterns.unformatted_content_delimiter.read()),e||(e=this.__patterns.word.read()),e)return this._create_token(_.TEXT,e)},t.exports.Tokenizer=p,t.exports.TOKEN=_}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(18);r=n}();var a=r;i=[n,n(141),n(142)],s=function(t){var e=n(141),i=n(142);return{html_beautify:function(t,n){return a(t,n,e.js_beautify,i.css_beautify)}}}.apply(e,i),void 0===s||(t.exports=s)}()},141:function(t,e){var n;!function(){var i;!function(){"use strict";var t=[function(t,e,n){var i=n(1).Beautifier,s=n(5).Options;t.exports=function(t,e){return new i(t,e).beautify()},t.exports.defaultOptions=function(){return new s}},function(t,e,n){var i=n(2).Output,s=n(3).Token,r=n(4),a=n(5).Options,o=n(7).Tokenizer,_=n(7).line_starters,u=n(7).positionable_operators,p=n(7).TOKEN;function l(t,e){return-1!==e.indexOf(t)}function h(t,e){return t&&t.type===p.RESERVED&&t.text===e}function c(t,e){return t&&t.type===p.RESERVED&&l(t.text,e)}var d=["case","return","do","if","throw","else","await","break","continue","async"],f=function(t){for(var e={},n=0;nn&&(n=t.line_indent_level)),{mode:e,parent:t,last_token:t?t.last_token:new s(p.START_BLOCK,""),last_word:t?t.last_word:"",declaration_statement:!1,declaration_assignment:!1,multiline_frame:!1,inline_frame:!1,if_block:!1,else_block:!1,class_start_block:!1,do_block:!1,do_while:!1,import_block:!1,in_case_statement:!1,in_case:!1,case_body:!1,case_block:!1,indentation_level:n,alignment:0,line_indent_level:t?t.line_indent_level:n,start_line_index:this._output.get_line_number(),ternary_depth:0}},P.prototype._reset=function(t){var e=t.match(/^[\t ]*/)[0];this._last_last_text="",this._output=new i(this._options,e),this._output.raw=this._options.test_output_raw,this._flag_store=[],this.set_mode(m);var n=new o(t,this._options);return this._tokens=n.tokenize(),t},P.prototype.beautify=function(){if(this._options.disabled)return this._source_text;var t=this._reset(this._source_text),e=this._options.eol;"auto"===this._options.eol&&(e="\n",t&&r.lineBreak.test(t||"")&&(e=t.match(r.lineBreak)[0]));for(var n=this._tokens.next();n;)this.handle_token(n),this._last_last_text=this._flags.last_token.text,this._flags.last_token=n,n=this._tokens.next();return this._output.get_code(e)},P.prototype.handle_token=function(t,e){t.type===p.START_EXPR?this.handle_start_expr(t):t.type===p.END_EXPR?this.handle_end_expr(t):t.type===p.START_BLOCK?this.handle_start_block(t):t.type===p.END_BLOCK?this.handle_end_block(t):t.type===p.WORD||t.type===p.RESERVED?this.handle_word(t):t.type===p.SEMICOLON?this.handle_semicolon(t):t.type===p.STRING?this.handle_string(t):t.type===p.EQUALS?this.handle_equals(t):t.type===p.OPERATOR?this.handle_operator(t):t.type===p.COMMA?this.handle_comma(t):t.type===p.BLOCK_COMMENT?this.handle_block_comment(t,e):t.type===p.COMMENT?this.handle_comment(t,e):t.type===p.DOT?this.handle_dot(t):t.type===p.EOF?this.handle_eof(t):(t.type,p.UNKNOWN,this.handle_unknown(t,e))},P.prototype.handle_whitespace_and_comments=function(t,e){var n=t.newlines,i=this._options.keep_array_indentation&&E(this._flags.mode);if(t.comments_before)for(var s=t.comments_before.next();s;)this.handle_whitespace_and_comments(s,e),this.handle_token(s,e),s=t.comments_before.next();if(i)for(var r=0;r0,e);else if(this._options.max_preserve_newlines&&n>this._options.max_preserve_newlines&&(n=this._options.max_preserve_newlines),this._options.preserve_newlines&&n>1){this.print_newline(!1,e);for(var a=1;a0&&(!this._flags.parent||this._flags.indentation_level>this._flags.parent.indentation_level)&&(this._flags.indentation_level-=1,this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.set_mode=function(t){this._flags?(this._flag_store.push(this._flags),this._previous_flags=this._flags):this._previous_flags=this.create_flags(null,t),this._flags=this.create_flags(this._previous_flags,t),this._output.set_indent(this._flags.indentation_level,this._flags.alignment)},P.prototype.restore_mode=function(){this._flag_store.length>0&&(this._previous_flags=this._flags,this._flags=this._flag_store.pop(),this._previous_flags.mode===y&&S(this._output,this._previous_flags),this._output.set_indent(this._flags.indentation_level,this._flags.alignment))},P.prototype.start_of_object_property=function(){return this._flags.parent.mode===b&&this._flags.mode===y&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"]))},P.prototype.start_of_statement=function(t){var e=!1;return!!(e=(e=(e=(e=(e=(e=(e=e||c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD)||h(this._flags.last_token,"do"))||!(this._flags.parent.mode===b&&this._flags.mode===y)&&c(this._flags.last_token,A)&&!t.newlines)||h(this._flags.last_token,"else")&&!(h(t,"if")&&!t.comments_before))||this._flags.last_token.type===p.END_EXPR&&(this._previous_flags.mode===k||this._previous_flags.mode===w))||this._flags.last_token.type===p.WORD&&this._flags.mode===m&&!this._flags.in_case&&!("--"===t.text||"++"===t.text)&&"function"!==this._last_last_text&&t.type!==p.WORD&&t.type!==p.RESERVED)||this._flags.mode===b&&(":"===this._flags.last_token.text&&0===this._flags.ternary_depth||c(this._flags.last_token,["get","set"])))&&(this.set_mode(y),this.indent(),this.handle_whitespace_and_comments(t,!0),this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t,c(t,["do","for","if","while"])),!0)},P.prototype.handle_start_expr=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t);var e=x;if("["===t.text){if(this._flags.last_token.type===p.WORD||")"===this._flags.last_token.text)return c(this._flags.last_token,_)&&(this._output.space_before_token=!0),this.print_token(t),this.set_mode(e),this.indent(),void(this._options.space_in_paren&&(this._output.space_before_token=!0));e=v,E(this._flags.mode)&&("["!==this._flags.last_token.text&&(","!==this._flags.last_token.text||"]"!==this._last_last_text&&"}"!==this._last_last_text)||this._options.keep_array_indentation||this.print_newline()),l(this._flags.last_token.type,[p.START_EXPR,p.END_EXPR,p.WORD,p.OPERATOR,p.DOT])||(this._output.space_before_token=!0)}else{if(this._flags.last_token.type===p.RESERVED)"for"===this._flags.last_token.text?(this._output.space_before_token=this._options.space_before_conditional,e=k):l(this._flags.last_token.text,["if","while","switch"])?(this._output.space_before_token=this._options.space_before_conditional,e=w):l(this._flags.last_word,["await","async"])?this._output.space_before_token=!0:"import"===this._flags.last_token.text&&""===t.whitespace_before?this._output.space_before_token=!1:(l(this._flags.last_token.text,_)||"catch"===this._flags.last_token.text)&&(this._output.space_before_token=!0);else if(this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR)this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t);else if(this._flags.last_token.type===p.WORD){this._output.space_before_token=!1;var n=this._tokens.peek(-3);if(this._options.space_after_named_function&&n){var i=this._tokens.peek(-4);c(n,["async","function"])||"*"===n.text&&c(i,["async","function"])?this._output.space_before_token=!0:this._flags.mode===b?"{"!==n.text&&","!==n.text&&("*"!==n.text||"{"!==i.text&&","!==i.text)||(this._output.space_before_token=!0):this._flags.parent&&this._flags.parent.class_start_block&&(this._output.space_before_token=!0)}}else this.allow_wrap_or_preserved_newline(t);(this._flags.last_token.type===p.RESERVED&&("function"===this._flags.last_word||"typeof"===this._flags.last_word)||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","])))&&(this._output.space_before_token=this._options.space_after_anon_function)}";"===this._flags.last_token.text||this._flags.last_token.type===p.START_BLOCK?this.print_newline():this._flags.last_token.type!==p.END_EXPR&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.END_BLOCK&&"."!==this._flags.last_token.text&&this._flags.last_token.type!==p.COMMA||this.allow_wrap_or_preserved_newline(t,t.newlines),this.print_token(t),this.set_mode(e),this._options.space_in_paren&&(this._output.space_before_token=!0),this.indent()},P.prototype.handle_end_expr=function(t){for(;this._flags.mode===y;)this.restore_mode();this.handle_whitespace_and_comments(t),this._flags.multiline_frame&&this.allow_wrap_or_preserved_newline(t,"]"===t.text&&E(this._flags.mode)&&!this._options.keep_array_indentation),this._options.space_in_paren&&(this._flags.last_token.type!==p.START_EXPR||this._options.space_in_empty_paren?this._output.space_before_token=!0:(this._output.trim(),this._output.space_before_token=!1)),this.deindent(),this.print_token(t),this.restore_mode(),S(this._output,this._previous_flags),this._flags.do_while&&this._previous_flags.mode===w&&(this._previous_flags.mode=x,this._flags.do_block=!1,this._flags.do_while=!1)},P.prototype.handle_start_block=function(t){this.handle_whitespace_and_comments(t);var e=this._tokens.peek(),n=this._tokens.peek(1);"switch"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR?(this.set_mode(m),this._flags.in_case_statement=!0):this._flags.case_body?this.set_mode(m):n&&(l(n.text,[":",","])&&l(e.type,[p.STRING,p.WORD,p.RESERVED])||l(e.text,["get","set","..."])&&l(n.type,[p.WORD,p.RESERVED]))?l(this._last_last_text,["class","interface"])&&!l(n.text,[":",","])?this.set_mode(m):this.set_mode(b):this._flags.last_token.type===p.OPERATOR&&"=>"===this._flags.last_token.text?this.set_mode(m):l(this._flags.last_token.type,[p.EQUALS,p.START_EXPR,p.COMMA,p.OPERATOR])||c(this._flags.last_token,["return","throw","import","default"])?this.set_mode(b):this.set_mode(m),this._flags.last_token&&c(this._flags.last_token.previous,["class","extends"])&&(this._flags.class_start_block=!0);var i=!e.comments_before&&"}"===e.text,s=i&&"function"===this._flags.last_word&&this._flags.last_token.type===p.END_EXPR;if(this._options.brace_preserve_inline){var r=0,a=null;this._flags.inline_frame=!0;do{if(r+=1,(a=this._tokens.peek(r-1)).newlines){this._flags.inline_frame=!1;break}}while(a.type!==p.EOF&&(a.type!==p.END_BLOCK||a.opened!==t))}("expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this._flags.last_token.type!==p.OPERATOR&&(s||this._flags.last_token.type===p.EQUALS||c(this._flags.last_token,d)&&"else"!==this._flags.last_token.text)?this._output.space_before_token=!0:this.print_newline(!1,!0):(!E(this._previous_flags.mode)||this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.COMMA||((this._flags.last_token.type===p.COMMA||this._options.space_in_paren)&&(this._output.space_before_token=!0),(this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR&&this._flags.inline_frame)&&(this.allow_wrap_or_preserved_newline(t),this._previous_flags.multiline_frame=this._previous_flags.multiline_frame||this._flags.multiline_frame,this._flags.multiline_frame=!1)),this._flags.last_token.type!==p.OPERATOR&&this._flags.last_token.type!==p.START_EXPR&&(this._flags.last_token.type!==p.START_BLOCK||this._flags.inline_frame?this._output.space_before_token=!0:this.print_newline())),this.print_token(t),this.indent(),i||this._options.brace_preserve_inline&&this._flags.inline_frame||this.print_newline()},P.prototype.handle_end_block=function(t){for(this.handle_whitespace_and_comments(t);this._flags.mode===y;)this.restore_mode();var e=this._flags.last_token.type===p.START_BLOCK;this._flags.inline_frame&&!e?this._output.space_before_token=!0:"expand"===this._options.brace_style?e||this.print_newline():e||(E(this._flags.mode)&&this._options.keep_array_indentation?(this._options.keep_array_indentation=!1,this.print_newline(),this._options.keep_array_indentation=!0):this.print_newline()),this.restore_mode(),this.print_token(t)},P.prototype.handle_word=function(t){if(t.type===p.RESERVED)if(l(t.text,["set","get"])&&this._flags.mode!==b)t.type=p.WORD;else if("import"===t.text&&l(this._tokens.peek().text,["(","."]))t.type=p.WORD;else if(l(t.text,["as","from"])&&!this._flags.import_block)t.type=p.WORD;else if(this._flags.mode===b){":"===this._tokens.peek().text&&(t.type=p.WORD)}if(this.start_of_statement(t)?c(this._flags.last_token,["var","let","const"])&&t.type===p.WORD&&(this._flags.declaration_statement=!0):!t.newlines||O(this._flags.mode)||this._flags.last_token.type===p.OPERATOR&&"--"!==this._flags.last_token.text&&"++"!==this._flags.last_token.text||this._flags.last_token.type===p.EQUALS||!this._options.preserve_newlines&&c(this._flags.last_token,["var","let","const","set","get"])?this.handle_whitespace_and_comments(t):(this.handle_whitespace_and_comments(t),this.print_newline()),this._flags.do_block&&!this._flags.do_while){if(h(t,"while"))return this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0,void(this._flags.do_while=!0);this.print_newline(),this._flags.do_block=!1}if(this._flags.if_block)if(!this._flags.else_block&&h(t,"else"))this._flags.else_block=!0;else{for(;this._flags.mode===y;)this.restore_mode();this._flags.if_block=!1,this._flags.else_block=!1}if(this._flags.in_case_statement&&c(t,["case","default"]))return this.print_newline(),this._flags.case_block||!this._flags.case_body&&!this._options.jslint_happy||this.deindent(),this._flags.case_body=!1,this.print_token(t),void(this._flags.in_case=!0);if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR&&this._flags.last_token.type!==p.EQUALS&&this._flags.last_token.type!==p.OPERATOR||this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t),h(t,"function"))return(l(this._flags.last_token.text,["}",";"])||this._output.just_added_newline()&&!l(this._flags.last_token.text,["(","[","{",":","=",","])&&this._flags.last_token.type!==p.OPERATOR)&&(this._output.just_added_blankline()||t.comments_before||(this.print_newline(),this.print_newline(!0))),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD?c(this._flags.last_token,["get","set","new","export"])||c(this._flags.last_token,A)||h(this._flags.last_token,"default")&&"export"===this._last_last_text||"declare"===this._flags.last_token.text?this._output.space_before_token=!0:this.print_newline():this._flags.last_token.type===p.OPERATOR||"="===this._flags.last_token.text?this._output.space_before_token=!0:(this._flags.multiline_frame||!O(this._flags.mode)&&!E(this._flags.mode))&&this.print_newline(),this.print_token(t),void(this._flags.last_word=t.text);var e="NONE";(this._flags.last_token.type===p.END_BLOCK?this._previous_flags.inline_frame?e="SPACE":c(t,["else","catch","finally","from"])?"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines?e="NEWLINE":(e="SPACE",this._output.space_before_token=!0):e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&this._flags.mode===m?e="NEWLINE":this._flags.last_token.type===p.SEMICOLON&&O(this._flags.mode)?e="SPACE":this._flags.last_token.type===p.STRING?e="NEWLINE":this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||"*"===this._flags.last_token.text&&(l(this._last_last_text,["function","yield"])||this._flags.mode===b&&l(this._last_last_text,["{",","]))?e="SPACE":this._flags.last_token.type===p.START_BLOCK?e=this._flags.inline_frame?"SPACE":"NEWLINE":this._flags.last_token.type===p.END_EXPR&&(this._output.space_before_token=!0,e="NEWLINE"),c(t,_)&&")"!==this._flags.last_token.text&&(e=this._flags.inline_frame||"else"===this._flags.last_token.text||"export"===this._flags.last_token.text?"SPACE":"NEWLINE"),c(t,["else","catch","finally"]))?(this._flags.last_token.type!==p.END_BLOCK||this._previous_flags.mode!==m||"expand"===this._options.brace_style||"end-expand"===this._options.brace_style||"none"===this._options.brace_style&&t.newlines)&&!this._flags.inline_frame?this.print_newline():(this._output.trim(!0),"}"!==this._output.current_line.last()&&this.print_newline(),this._output.space_before_token=!0):"NEWLINE"===e?c(this._flags.last_token,d)||"declare"===this._flags.last_token.text&&c(t,["var","let","const"])?this._output.space_before_token=!0:this._flags.last_token.type!==p.END_EXPR?this._flags.last_token.type===p.START_EXPR&&c(t,["var","let","const"])||":"===this._flags.last_token.text||(h(t,"if")&&h(t.previous,"else")?this._output.space_before_token=!0:this.print_newline()):c(t,_)&&")"!==this._flags.last_token.text&&this.print_newline():this._flags.multiline_frame&&E(this._flags.mode)&&","===this._flags.last_token.text&&"}"===this._last_last_text?this.print_newline():"SPACE"===e&&(this._output.space_before_token=!0);!t.previous||t.previous.type!==p.WORD&&t.previous.type!==p.RESERVED||(this._output.space_before_token=!0),this.print_token(t),this._flags.last_word=t.text,t.type===p.RESERVED&&("do"===t.text?this._flags.do_block=!0:"if"===t.text?this._flags.if_block=!0:"import"===t.text?this._flags.import_block=!0:this._flags.import_block&&h(t,"from")&&(this._flags.import_block=!1))},P.prototype.handle_semicolon=function(t){this.start_of_statement(t)?this._output.space_before_token=!1:this.handle_whitespace_and_comments(t);for(var e=this._tokens.peek();!(this._flags.mode!==y||this._flags.if_block&&h(e,"else")||this._flags.do_block);)this.restore_mode();this._flags.import_block&&(this._flags.import_block=!1),this.print_token(t)},P.prototype.handle_string=function(t){(!t.text.startsWith("`")||0!==t.newlines||""!==t.whitespace_before||")"!==t.previous.text&&this._flags.last_token.type!==p.WORD)&&(this.start_of_statement(t)?this._output.space_before_token=!0:(this.handle_whitespace_and_comments(t),this._flags.last_token.type===p.RESERVED||this._flags.last_token.type===p.WORD||this._flags.inline_frame?this._output.space_before_token=!0:this._flags.last_token.type===p.COMMA||this._flags.last_token.type===p.START_EXPR||this._flags.last_token.type===p.EQUALS||this._flags.last_token.type===p.OPERATOR?this.start_of_object_property()||this.allow_wrap_or_preserved_newline(t):!t.text.startsWith("`")||this._flags.last_token.type!==p.END_EXPR||"]"!==t.previous.text&&")"!==t.previous.text||0!==t.newlines?this.print_newline():this._output.space_before_token=!0)),this.print_token(t)},P.prototype.handle_equals=function(t){this.start_of_statement(t)||this.handle_whitespace_and_comments(t),this._flags.declaration_statement&&(this._flags.declaration_assignment=!0),this._output.space_before_token=!0,this.print_token(t),this._output.space_before_token=!0},P.prototype.handle_comma=function(t){this.handle_whitespace_and_comments(t,!0),this.print_token(t),this._output.space_before_token=!0,this._flags.declaration_statement?(O(this._flags.parent.mode)&&(this._flags.declaration_assignment=!1),this._flags.declaration_assignment?(this._flags.declaration_assignment=!1,this.print_newline(!1,!0)):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)):this._flags.mode===b||this._flags.mode===y&&this._flags.parent.mode===b?(this._flags.mode===y&&this.restore_mode(),this._flags.inline_frame||this.print_newline()):this._options.comma_first&&this.allow_wrap_or_preserved_newline(t)},P.prototype.handle_operator=function(t){var e="*"===t.text&&(c(this._flags.last_token,["function","yield"])||l(this._flags.last_token.type,[p.START_BLOCK,p.COMMA,p.END_BLOCK,p.SEMICOLON])),n=l(t.text,["-","+"])&&(l(this._flags.last_token.type,[p.START_BLOCK,p.START_EXPR,p.EQUALS,p.OPERATOR])||l(this._flags.last_token.text,_)||","===this._flags.last_token.text);if(this.start_of_statement(t));else{var i=!e;this.handle_whitespace_and_comments(t,i)}if("*"!==t.text||this._flags.last_token.type!==p.DOT)if("::"!==t.text){if(this._flags.last_token.type===p.OPERATOR&&l(this._options.operator_position,g)&&this.allow_wrap_or_preserved_newline(t),":"===t.text&&this._flags.in_case)return this.print_token(t),this._flags.in_case=!1,this._flags.case_body=!0,void(this._tokens.peek().type!==p.START_BLOCK?(this.indent(),this.print_newline(),this._flags.case_block=!1):(this._flags.case_block=!0,this._output.space_before_token=!0));var s=!0,r=!0,a=!1;if(":"===t.text?0===this._flags.ternary_depth?s=!1:(this._flags.ternary_depth-=1,a=!0):"?"===t.text&&(this._flags.ternary_depth+=1),!n&&!e&&this._options.preserve_newlines&&l(t.text,u)){var o=":"===t.text,h=o&&a,b=o&&!a;switch(this._options.operator_position){case f.before_newline:return this._output.space_before_token=!b,this.print_token(t),o&&!h||this.allow_wrap_or_preserved_newline(t),void(this._output.space_before_token=!0);case f.after_newline:return this._output.space_before_token=!0,!o||h?this._tokens.peek().newlines?this.print_newline(!1,!0):this.allow_wrap_or_preserved_newline(t):this._output.space_before_token=!1,this.print_token(t),void(this._output.space_before_token=!0);case f.preserve_newline:return b||this.allow_wrap_or_preserved_newline(t),s=!(this._output.just_added_newline()||b),this._output.space_before_token=s,this.print_token(t),void(this._output.space_before_token=!0)}}if(e){this.allow_wrap_or_preserved_newline(t),s=!1;var v=this._tokens.peek();r=v&&l(v.type,[p.WORD,p.RESERVED])}else if("..."===t.text)this.allow_wrap_or_preserved_newline(t),s=this._flags.last_token.type===p.START_BLOCK,r=!1;else if(l(t.text,["--","++","!","~"])||n){if(this._flags.last_token.type!==p.COMMA&&this._flags.last_token.type!==p.START_EXPR||this.allow_wrap_or_preserved_newline(t),s=!1,r=!1,t.newlines&&("--"===t.text||"++"===t.text||"~"===t.text)){var k=c(this._flags.last_token,d)&&t.newlines;k&&(this._previous_flags.if_block||this._previous_flags.else_block)&&this.restore_mode(),this.print_newline(k,!0)}";"===this._flags.last_token.text&&O(this._flags.mode)&&(s=!0),this._flags.last_token.type===p.RESERVED?s=!0:this._flags.last_token.type===p.END_EXPR?s=!("]"===this._flags.last_token.text&&("--"===t.text||"++"===t.text)):this._flags.last_token.type===p.OPERATOR&&(s=l(t.text,["--","-","++","+"])&&l(this._flags.last_token.text,["--","-","++","+"]),l(t.text,["+","-"])&&l(this._flags.last_token.text,["--","++"])&&(r=!0)),(this._flags.mode!==m||this._flags.inline_frame)&&this._flags.mode!==y||"{"!==this._flags.last_token.text&&";"!==this._flags.last_token.text||this.print_newline()}this._output.space_before_token=this._output.space_before_token||s,this.print_token(t),this._output.space_before_token=r}else this.print_token(t);else this.print_token(t)},P.prototype.handle_block_comment=function(t,e){return this._output.raw?(this._output.add_raw_token(t),void(t.directives&&"end"===t.directives.preserve&&(this._output.raw=this._options.test_output_raw))):t.directives?(this.print_newline(!1,e),this.print_token(t),"start"===t.directives.preserve&&(this._output.raw=!0),void this.print_newline(!1,!0)):r.newline.test(t.text)||t.newlines?void this.print_block_commment(t,e):(this._output.space_before_token=!0,this.print_token(t),void(this._output.space_before_token=!0))},P.prototype.print_block_commment=function(t,e){var n,i=function(t){for(var e=[],n=(t=t.replace(r.allLineBreaks,"\n")).indexOf("\n");-1!==n;)e.push(t.substring(0,n)),n=(t=t.substring(n+1)).indexOf("\n");return t.length&&e.push(t),e}(t.text),s=!1,a=!1,o=t.whitespace_before,_=o.length;if(this.print_newline(!1,e),this.print_token_line_indentation(t),this._output.add_token(i[0]),this.print_newline(!1,e),i.length>1){for(s=function(t,e){for(var n=0;n0&&(e=new Array(t.indent_level+1).join(this.__indent_string)),this.__base_string=e,this.__base_string_length=e.length}function i(t,i){this.__indent_cache=new n(t,i),this.raw=!1,this._end_with_newline=t.end_with_newline,this.indent_size=t.indent_size,this.wrap_line_length=t.wrap_line_length,this.indent_empty_lines=t.indent_empty_lines,this.__lines=[],this.previous_line=null,this.current_line=null,this.next_line=new e(this),this.space_before_token=!1,this.non_breaking_space=!1,this.previous_token_wrapped=!1,this.__add_outputline()}e.prototype.clone_empty=function(){var t=new e(this.__parent);return t.set_indent(this.__indent_count,this.__alignment_count),t},e.prototype.item=function(t){return t<0?this.__items[this.__items.length+t]:this.__items[t]},e.prototype.has_match=function(t){for(var e=this.__items.length-1;e>=0;e--)if(this.__items[e].match(t))return!0;return!1},e.prototype.set_indent=function(t,e){this.is_empty()&&(this.__indent_count=t||0,this.__alignment_count=e||0,this.__character_count=this.__parent.get_indent_size(this.__indent_count,this.__alignment_count))},e.prototype._set_wrap_point=function(){this.__parent.wrap_line_length&&(this.__wrap_point_index=this.__items.length,this.__wrap_point_character_count=this.__character_count,this.__wrap_point_indent_count=this.__parent.next_line.__indent_count,this.__wrap_point_alignment_count=this.__parent.next_line.__alignment_count)},e.prototype._should_wrap=function(){return this.__wrap_point_index&&this.__character_count>this.__parent.wrap_line_length&&this.__wrap_point_character_count>this.__parent.next_line.__character_count},e.prototype._allow_wrap=function(){if(this._should_wrap()){this.__parent.add_new_line();var t=this.__parent.current_line;return t.set_indent(this.__wrap_point_indent_count,this.__wrap_point_alignment_count),t.__items=this.__items.slice(this.__wrap_point_index),this.__items=this.__items.slice(0,this.__wrap_point_index),t.__character_count+=this.__character_count-this.__wrap_point_character_count,this.__character_count=this.__wrap_point_character_count," "===t.__items[0]&&(t.__items.splice(0,1),t.__character_count-=1),!0}return!1},e.prototype.is_empty=function(){return 0===this.__items.length},e.prototype.last=function(){return this.is_empty()?null:this.__items[this.__items.length-1]},e.prototype.push=function(t){this.__items.push(t);var e=t.lastIndexOf("\n");-1!==e?this.__character_count=t.length-e:this.__character_count+=t.length},e.prototype.pop=function(){var t=null;return this.is_empty()||(t=this.__items.pop(),this.__character_count-=t.length),t},e.prototype._remove_indent=function(){this.__indent_count>0&&(this.__indent_count-=1,this.__character_count-=this.__parent.indent_size)},e.prototype._remove_wrap_indent=function(){this.__wrap_point_indent_count>0&&(this.__wrap_point_indent_count-=1)},e.prototype.trim=function(){for(;" "===this.last();)this.__items.pop(),this.__character_count-=1},e.prototype.toString=function(){var t="";return this.is_empty()?this.__parent.indent_empty_lines&&(t=this.__parent.get_indent_string(this.__indent_count)):(t=this.__parent.get_indent_string(this.__indent_count,this.__alignment_count),t+=this.__items.join("")),t},n.prototype.get_indent_size=function(t,e){var n=this.__base_string_length;return e=e||0,t<0&&(n=0),n+=t*this.__indent_size,n+=e},n.prototype.get_indent_string=function(t,e){var n=this.__base_string;return e=e||0,t<0&&(t=0,n=""),e+=t*this.__indent_size,this.__ensure_cache(e),n+=this.__cache[e]},n.prototype.__ensure_cache=function(t){for(;t>=this.__cache.length;)this.__add_column()},n.prototype.__add_column=function(){var t=this.__cache.length,e=0,n="";this.__indent_size&&t>=this.__indent_size&&(t-=(e=Math.floor(t/this.__indent_size))*this.__indent_size,n=new Array(e+1).join(this.__indent_string)),t&&(n+=new Array(t+1).join(" ")),this.__cache.push(n)},i.prototype.__add_outputline=function(){this.previous_line=this.current_line,this.current_line=this.next_line.clone_empty(),this.__lines.push(this.current_line)},i.prototype.get_line_number=function(){return this.__lines.length},i.prototype.get_indent_string=function(t,e){return this.__indent_cache.get_indent_string(t,e)},i.prototype.get_indent_size=function(t,e){return this.__indent_cache.get_indent_size(t,e)},i.prototype.is_empty=function(){return!this.previous_line&&this.current_line.is_empty()},i.prototype.add_new_line=function(t){return!(this.is_empty()||!t&&this.just_added_newline())&&(this.raw||this.__add_outputline(),!0)},i.prototype.get_code=function(t){this.trim(!0);var e=this.current_line.pop();e&&("\n"===e[e.length-1]&&(e=e.replace(/\n+$/g,"")),this.current_line.push(e)),this._end_with_newline&&this.__add_outputline();var n=this.__lines.join("\n");return"\n"!==t&&(n=n.replace(/[\n]/g,t)),n},i.prototype.set_wrap_point=function(){this.current_line._set_wrap_point()},i.prototype.set_indent=function(t,e){return t=t||0,e=e||0,this.next_line.set_indent(t,e),this.__lines.length>1?(this.current_line.set_indent(t,e),!0):(this.current_line.set_indent(),!1)},i.prototype.add_raw_token=function(t){for(var e=0;e1&&this.current_line.is_empty();)this.__lines.pop(),this.current_line=this.__lines[this.__lines.length-1],this.current_line.trim();this.previous_line=this.__lines.length>1?this.__lines[this.__lines.length-2]:null},i.prototype.just_added_newline=function(){return this.current_line.is_empty()},i.prototype.just_added_blankline=function(){return this.is_empty()||this.current_line.is_empty()&&this.previous_line.is_empty()},i.prototype.ensure_empty_line_above=function(t,n){for(var i=this.__lines.length-2;i>=0;){var s=this.__lines[i];if(s.is_empty())break;if(0!==s.item(0).indexOf(t)&&s.item(-1)!==n){this.__lines.splice(i+1,0,new e(this)),this.previous_line=this.__lines[this.__lines.length-2];break}i--}},t.exports.Output=i},function(t){t.exports.Token=function(t,e,n,i){this.type=t,this.text=e,this.comments_before=null,this.newlines=n||0,this.whitespace_before=i||"",this.parent=null,this.next=null,this.previous=null,this.opened=null,this.closed=null,this.directives=null}},function(t,e){var n="\\x24\\x30-\\x39\\x41-\\x5a\\x5f\\x61-\\x7a",i="\\xaa\\xb5\\xba\\xc0-\\xd6\\xd8-\\xf6\\xf8-\\u02c1\\u02c6-\\u02d1\\u02e0-\\u02e4\\u02ec\\u02ee\\u0370-\\u0374\\u0376\\u0377\\u037a-\\u037d\\u0386\\u0388-\\u038a\\u038c\\u038e-\\u03a1\\u03a3-\\u03f5\\u03f7-\\u0481\\u048a-\\u0527\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05d0-\\u05ea\\u05f0-\\u05f2\\u0620-\\u064a\\u066e\\u066f\\u0671-\\u06d3\\u06d5\\u06e5\\u06e6\\u06ee\\u06ef\\u06fa-\\u06fc\\u06ff\\u0710\\u0712-\\u072f\\u074d-\\u07a5\\u07b1\\u07ca-\\u07ea\\u07f4\\u07f5\\u07fa\\u0800-\\u0815\\u081a\\u0824\\u0828\\u0840-\\u0858\\u08a0\\u08a2-\\u08ac\\u0904-\\u0939\\u093d\\u0950\\u0958-\\u0961\\u0971-\\u0977\\u0979-\\u097f\\u0985-\\u098c\\u098f\\u0990\\u0993-\\u09a8\\u09aa-\\u09b0\\u09b2\\u09b6-\\u09b9\\u09bd\\u09ce\\u09dc\\u09dd\\u09df-\\u09e1\\u09f0\\u09f1\\u0a05-\\u0a0a\\u0a0f\\u0a10\\u0a13-\\u0a28\\u0a2a-\\u0a30\\u0a32\\u0a33\\u0a35\\u0a36\\u0a38\\u0a39\\u0a59-\\u0a5c\\u0a5e\\u0a72-\\u0a74\\u0a85-\\u0a8d\\u0a8f-\\u0a91\\u0a93-\\u0aa8\\u0aaa-\\u0ab0\\u0ab2\\u0ab3\\u0ab5-\\u0ab9\\u0abd\\u0ad0\\u0ae0\\u0ae1\\u0b05-\\u0b0c\\u0b0f\\u0b10\\u0b13-\\u0b28\\u0b2a-\\u0b30\\u0b32\\u0b33\\u0b35-\\u0b39\\u0b3d\\u0b5c\\u0b5d\\u0b5f-\\u0b61\\u0b71\\u0b83\\u0b85-\\u0b8a\\u0b8e-\\u0b90\\u0b92-\\u0b95\\u0b99\\u0b9a\\u0b9c\\u0b9e\\u0b9f\\u0ba3\\u0ba4\\u0ba8-\\u0baa\\u0bae-\\u0bb9\\u0bd0\\u0c05-\\u0c0c\\u0c0e-\\u0c10\\u0c12-\\u0c28\\u0c2a-\\u0c33\\u0c35-\\u0c39\\u0c3d\\u0c58\\u0c59\\u0c60\\u0c61\\u0c85-\\u0c8c\\u0c8e-\\u0c90\\u0c92-\\u0ca8\\u0caa-\\u0cb3\\u0cb5-\\u0cb9\\u0cbd\\u0cde\\u0ce0\\u0ce1\\u0cf1\\u0cf2\\u0d05-\\u0d0c\\u0d0e-\\u0d10\\u0d12-\\u0d3a\\u0d3d\\u0d4e\\u0d60\\u0d61\\u0d7a-\\u0d7f\\u0d85-\\u0d96\\u0d9a-\\u0db1\\u0db3-\\u0dbb\\u0dbd\\u0dc0-\\u0dc6\\u0e01-\\u0e30\\u0e32\\u0e33\\u0e40-\\u0e46\\u0e81\\u0e82\\u0e84\\u0e87\\u0e88\\u0e8a\\u0e8d\\u0e94-\\u0e97\\u0e99-\\u0e9f\\u0ea1-\\u0ea3\\u0ea5\\u0ea7\\u0eaa\\u0eab\\u0ead-\\u0eb0\\u0eb2\\u0eb3\\u0ebd\\u0ec0-\\u0ec4\\u0ec6\\u0edc-\\u0edf\\u0f00\\u0f40-\\u0f47\\u0f49-\\u0f6c\\u0f88-\\u0f8c\\u1000-\\u102a\\u103f\\u1050-\\u1055\\u105a-\\u105d\\u1061\\u1065\\u1066\\u106e-\\u1070\\u1075-\\u1081\\u108e\\u10a0-\\u10c5\\u10c7\\u10cd\\u10d0-\\u10fa\\u10fc-\\u1248\\u124a-\\u124d\\u1250-\\u1256\\u1258\\u125a-\\u125d\\u1260-\\u1288\\u128a-\\u128d\\u1290-\\u12b0\\u12b2-\\u12b5\\u12b8-\\u12be\\u12c0\\u12c2-\\u12c5\\u12c8-\\u12d6\\u12d8-\\u1310\\u1312-\\u1315\\u1318-\\u135a\\u1380-\\u138f\\u13a0-\\u13f4\\u1401-\\u166c\\u166f-\\u167f\\u1681-\\u169a\\u16a0-\\u16ea\\u16ee-\\u16f0\\u1700-\\u170c\\u170e-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176c\\u176e-\\u1770\\u1780-\\u17b3\\u17d7\\u17dc\\u1820-\\u1877\\u1880-\\u18a8\\u18aa\\u18b0-\\u18f5\\u1900-\\u191c\\u1950-\\u196d\\u1970-\\u1974\\u1980-\\u19ab\\u19c1-\\u19c7\\u1a00-\\u1a16\\u1a20-\\u1a54\\u1aa7\\u1b05-\\u1b33\\u1b45-\\u1b4b\\u1b83-\\u1ba0\\u1bae\\u1baf\\u1bba-\\u1be5\\u1c00-\\u1c23\\u1c4d-\\u1c4f\\u1c5a-\\u1c7d\\u1ce9-\\u1cec\\u1cee-\\u1cf1\\u1cf5\\u1cf6\\u1d00-\\u1dbf\\u1e00-\\u1f15\\u1f18-\\u1f1d\\u1f20-\\u1f45\\u1f48-\\u1f4d\\u1f50-\\u1f57\\u1f59\\u1f5b\\u1f5d\\u1f5f-\\u1f7d\\u1f80-\\u1fb4\\u1fb6-\\u1fbc\\u1fbe\\u1fc2-\\u1fc4\\u1fc6-\\u1fcc\\u1fd0-\\u1fd3\\u1fd6-\\u1fdb\\u1fe0-\\u1fec\\u1ff2-\\u1ff4\\u1ff6-\\u1ffc\\u2071\\u207f\\u2090-\\u209c\\u2102\\u2107\\u210a-\\u2113\\u2115\\u2119-\\u211d\\u2124\\u2126\\u2128\\u212a-\\u212d\\u212f-\\u2139\\u213c-\\u213f\\u2145-\\u2149\\u214e\\u2160-\\u2188\\u2c00-\\u2c2e\\u2c30-\\u2c5e\\u2c60-\\u2ce4\\u2ceb-\\u2cee\\u2cf2\\u2cf3\\u2d00-\\u2d25\\u2d27\\u2d2d\\u2d30-\\u2d67\\u2d6f\\u2d80-\\u2d96\\u2da0-\\u2da6\\u2da8-\\u2dae\\u2db0-\\u2db6\\u2db8-\\u2dbe\\u2dc0-\\u2dc6\\u2dc8-\\u2dce\\u2dd0-\\u2dd6\\u2dd8-\\u2dde\\u2e2f\\u3005-\\u3007\\u3021-\\u3029\\u3031-\\u3035\\u3038-\\u303c\\u3041-\\u3096\\u309d-\\u309f\\u30a1-\\u30fa\\u30fc-\\u30ff\\u3105-\\u312d\\u3131-\\u318e\\u31a0-\\u31ba\\u31f0-\\u31ff\\u3400-\\u4db5\\u4e00-\\u9fcc\\ua000-\\ua48c\\ua4d0-\\ua4fd\\ua500-\\ua60c\\ua610-\\ua61f\\ua62a\\ua62b\\ua640-\\ua66e\\ua67f-\\ua697\\ua6a0-\\ua6ef\\ua717-\\ua71f\\ua722-\\ua788\\ua78b-\\ua78e\\ua790-\\ua793\\ua7a0-\\ua7aa\\ua7f8-\\ua801\\ua803-\\ua805\\ua807-\\ua80a\\ua80c-\\ua822\\ua840-\\ua873\\ua882-\\ua8b3\\ua8f2-\\ua8f7\\ua8fb\\ua90a-\\ua925\\ua930-\\ua946\\ua960-\\ua97c\\ua984-\\ua9b2\\ua9cf\\uaa00-\\uaa28\\uaa40-\\uaa42\\uaa44-\\uaa4b\\uaa60-\\uaa76\\uaa7a\\uaa80-\\uaaaf\\uaab1\\uaab5\\uaab6\\uaab9-\\uaabd\\uaac0\\uaac2\\uaadb-\\uaadd\\uaae0-\\uaaea\\uaaf2-\\uaaf4\\uab01-\\uab06\\uab09-\\uab0e\\uab11-\\uab16\\uab20-\\uab26\\uab28-\\uab2e\\uabc0-\\uabe2\\uac00-\\ud7a3\\ud7b0-\\ud7c6\\ud7cb-\\ud7fb\\uf900-\\ufa6d\\ufa70-\\ufad9\\ufb00-\\ufb06\\ufb13-\\ufb17\\ufb1d\\ufb1f-\\ufb28\\ufb2a-\\ufb36\\ufb38-\\ufb3c\\ufb3e\\ufb40\\ufb41\\ufb43\\ufb44\\ufb46-\\ufbb1\\ufbd3-\\ufd3d\\ufd50-\\ufd8f\\ufd92-\\ufdc7\\ufdf0-\\ufdfb\\ufe70-\\ufe74\\ufe76-\\ufefc\\uff21-\\uff3a\\uff41-\\uff5a\\uff66-\\uffbe\\uffc2-\\uffc7\\uffca-\\uffcf\\uffd2-\\uffd7\\uffda-\\uffdc",s="\\u0300-\\u036f\\u0483-\\u0487\\u0591-\\u05bd\\u05bf\\u05c1\\u05c2\\u05c4\\u05c5\\u05c7\\u0610-\\u061a\\u0620-\\u0649\\u0672-\\u06d3\\u06e7-\\u06e8\\u06fb-\\u06fc\\u0730-\\u074a\\u0800-\\u0814\\u081b-\\u0823\\u0825-\\u0827\\u0829-\\u082d\\u0840-\\u0857\\u08e4-\\u08fe\\u0900-\\u0903\\u093a-\\u093c\\u093e-\\u094f\\u0951-\\u0957\\u0962-\\u0963\\u0966-\\u096f\\u0981-\\u0983\\u09bc\\u09be-\\u09c4\\u09c7\\u09c8\\u09d7\\u09df-\\u09e0\\u0a01-\\u0a03\\u0a3c\\u0a3e-\\u0a42\\u0a47\\u0a48\\u0a4b-\\u0a4d\\u0a51\\u0a66-\\u0a71\\u0a75\\u0a81-\\u0a83\\u0abc\\u0abe-\\u0ac5\\u0ac7-\\u0ac9\\u0acb-\\u0acd\\u0ae2-\\u0ae3\\u0ae6-\\u0aef\\u0b01-\\u0b03\\u0b3c\\u0b3e-\\u0b44\\u0b47\\u0b48\\u0b4b-\\u0b4d\\u0b56\\u0b57\\u0b5f-\\u0b60\\u0b66-\\u0b6f\\u0b82\\u0bbe-\\u0bc2\\u0bc6-\\u0bc8\\u0bca-\\u0bcd\\u0bd7\\u0be6-\\u0bef\\u0c01-\\u0c03\\u0c46-\\u0c48\\u0c4a-\\u0c4d\\u0c55\\u0c56\\u0c62-\\u0c63\\u0c66-\\u0c6f\\u0c82\\u0c83\\u0cbc\\u0cbe-\\u0cc4\\u0cc6-\\u0cc8\\u0cca-\\u0ccd\\u0cd5\\u0cd6\\u0ce2-\\u0ce3\\u0ce6-\\u0cef\\u0d02\\u0d03\\u0d46-\\u0d48\\u0d57\\u0d62-\\u0d63\\u0d66-\\u0d6f\\u0d82\\u0d83\\u0dca\\u0dcf-\\u0dd4\\u0dd6\\u0dd8-\\u0ddf\\u0df2\\u0df3\\u0e34-\\u0e3a\\u0e40-\\u0e45\\u0e50-\\u0e59\\u0eb4-\\u0eb9\\u0ec8-\\u0ecd\\u0ed0-\\u0ed9\\u0f18\\u0f19\\u0f20-\\u0f29\\u0f35\\u0f37\\u0f39\\u0f41-\\u0f47\\u0f71-\\u0f84\\u0f86-\\u0f87\\u0f8d-\\u0f97\\u0f99-\\u0fbc\\u0fc6\\u1000-\\u1029\\u1040-\\u1049\\u1067-\\u106d\\u1071-\\u1074\\u1082-\\u108d\\u108f-\\u109d\\u135d-\\u135f\\u170e-\\u1710\\u1720-\\u1730\\u1740-\\u1750\\u1772\\u1773\\u1780-\\u17b2\\u17dd\\u17e0-\\u17e9\\u180b-\\u180d\\u1810-\\u1819\\u1920-\\u192b\\u1930-\\u193b\\u1951-\\u196d\\u19b0-\\u19c0\\u19c8-\\u19c9\\u19d0-\\u19d9\\u1a00-\\u1a15\\u1a20-\\u1a53\\u1a60-\\u1a7c\\u1a7f-\\u1a89\\u1a90-\\u1a99\\u1b46-\\u1b4b\\u1b50-\\u1b59\\u1b6b-\\u1b73\\u1bb0-\\u1bb9\\u1be6-\\u1bf3\\u1c00-\\u1c22\\u1c40-\\u1c49\\u1c5b-\\u1c7d\\u1cd0-\\u1cd2\\u1d00-\\u1dbe\\u1e01-\\u1f15\\u200c\\u200d\\u203f\\u2040\\u2054\\u20d0-\\u20dc\\u20e1\\u20e5-\\u20f0\\u2d81-\\u2d96\\u2de0-\\u2dff\\u3021-\\u3028\\u3099\\u309a\\ua640-\\ua66d\\ua674-\\ua67d\\ua69f\\ua6f0-\\ua6f1\\ua7f8-\\ua800\\ua806\\ua80b\\ua823-\\ua827\\ua880-\\ua881\\ua8b4-\\ua8c4\\ua8d0-\\ua8d9\\ua8f3-\\ua8f7\\ua900-\\ua909\\ua926-\\ua92d\\ua930-\\ua945\\ua980-\\ua983\\ua9b3-\\ua9c0\\uaa00-\\uaa27\\uaa40-\\uaa41\\uaa4c-\\uaa4d\\uaa50-\\uaa59\\uaa7b\\uaae0-\\uaae9\\uaaf2-\\uaaf3\\uabc0-\\uabe1\\uabec\\uabed\\uabf0-\\uabf9\\ufb20-\\ufb28\\ufe00-\\ufe0f\\ufe20-\\ufe26\\ufe33\\ufe34\\ufe4d-\\ufe4f\\uff10-\\uff19\\uff3f",r="(?:\\\\u[0-9a-fA-F]{4}|[\\x23\\x24\\x40\\x41-\\x5a\\x5f\\x61-\\x7a"+i+"])",a="(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])*";e.identifier=new RegExp(r+a,"g"),e.identifierStart=new RegExp(r),e.identifierMatch=new RegExp("(?:\\\\u[0-9a-fA-F]{4}|["+n+i+s+"])+");e.newline=/[\n\r\u2028\u2029]/,e.lineBreak=new RegExp("\r\n|"+e.newline.source),e.allLineBreaks=new RegExp(e.lineBreak.source,"g")},function(t,e,n){var i=n(6).Options,s=["before-newline","after-newline","preserve-newline"];function r(t){i.call(this,t,"js");var e=this.raw_options.brace_style||null;"expand-strict"===e?this.raw_options.brace_style="expand":"collapse-preserve-inline"===e?this.raw_options.brace_style="collapse,preserve-inline":void 0!==this.raw_options.braces_on_own_line&&(this.raw_options.brace_style=this.raw_options.braces_on_own_line?"expand":"collapse");var n=this._get_selection_list("brace_style",["collapse","expand","end-expand","none","preserve-inline"]);this.brace_preserve_inline=!1,this.brace_style="collapse";for(var r=0;r>> === !== &&= ??= ||= << && >= ** != == <= >> || ?? |> < / - + > : & % ? ^ | *".split(" "),m=">>>= ... >>= <<= === >>> !== **= &&= ??= ||= => ^= :: /= << <= == && -= >= >> != -- += ** || ?? ++ %= &= *= |= |> = ! ? > < : / ^ - + * & % ~ |";m=(m="\\?\\.(?!\\d) "+(m=m.replace(/[-[\]{}()*+?.,\\^$|#]/g,"\\$&"))).replace(/ /g,"|");var y,b=new RegExp(m),v="continue,try,throw,return,var,let,const,if,switch,case,default,for,while,break,function,import,export".split(","),k=v.concat(["do","in","of","else","get","set","new","catch","finally","typeof","yield","async","await","from","as","class","extends"]),w=new RegExp("^(?:"+k.join("|")+")$"),x=function(t,e){s.call(this,t,e),this._patterns.whitespace=this._patterns.whitespace.matching(/\u00A0\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff/.source,/\u2028\u2029/.source);var n=new _(this._input),i=new u(this._input).read_options(this._options);this.__patterns={template:i,identifier:i.starting_with(o.identifier).matching(o.identifierMatch),number:n.matching(c),punct:n.matching(b),comment:n.starting_with(/\/\//).until(/[\n\r\u2028\u2029]/),block_comment:n.starting_with(/\/\*/).until_after(/\*\//),html_comment_start:n.matching(//),include:n.starting_with(/#include/).until_after(o.lineBreak),shebang:n.starting_with(/#!/).until_after(o.lineBreak),xml:n.matching(/[\s\S]*?<(\/?)([-a-zA-Z:0-9_.]+|{[^}]+?}|!\[CDATA\[[^\]]*?\]\]|)(\s*{[^}]+?}|\s+[-a-zA-Z:0-9_.]+|\s+[-a-zA-Z:0-9_.]+\s*=\s*('[^']*'|"[^"]*"|{([^{}]|{[^}]+?})+?}))*\s*(\/?)\s*>/),single_quote:i.until(/['\\\n\r\u2028\u2029]/),double_quote:i.until(/["\\\n\r\u2028\u2029]/),template_text:i.until(/[`\\$]/),template_expression:i.until(/[`}\\]/)}};(x.prototype=new s)._is_comment=function(t){return t.type===l.COMMENT||t.type===l.BLOCK_COMMENT||t.type===l.UNKNOWN},x.prototype._is_opening=function(t){return t.type===l.START_BLOCK||t.type===l.START_EXPR},x.prototype._is_closing=function(t,e){return(t.type===l.END_BLOCK||t.type===l.END_EXPR)&&e&&("]"===t.text&&"["===e.text||")"===t.text&&"("===e.text||"}"===t.text&&"{"===e.text)},x.prototype._reset=function(){y=!1},x.prototype._get_next_token=function(t,e){var n=null;this._readWhitespace();var i=this._input.peek();return null===i?this._create_token(l.EOF,""):n=(n=(n=(n=(n=(n=(n=(n=(n=n||this._read_non_javascript(i))||this._read_string(i))||this._read_word(t))||this._read_singles(i))||this._read_comment(i))||this._read_regexp(i,t))||this._read_xml(i,t))||this._read_punctuation())||this._create_token(l.UNKNOWN,this._input.next())},x.prototype._read_word=function(t){var e;return""!==(e=this.__patterns.identifier.read())?(e=e.replace(o.allLineBreaks,"\n"),t.type!==l.DOT&&(t.type!==l.RESERVED||"set"!==t.text&&"get"!==t.text)&&w.test(e)?"in"!==e&&"of"!==e||t.type!==l.WORD&&t.type!==l.STRING?this._create_token(l.RESERVED,e):this._create_token(l.OPERATOR,e):this._create_token(l.WORD,e)):""!==(e=this.__patterns.number.read())?this._create_token(l.WORD,e):void 0},x.prototype._read_singles=function(t){var e=null;return"("===t||"["===t?e=this._create_token(l.START_EXPR,t):")"===t||"]"===t?e=this._create_token(l.END_EXPR,t):"{"===t?e=this._create_token(l.START_BLOCK,t):"}"===t?e=this._create_token(l.END_BLOCK,t):";"===t?e=this._create_token(l.SEMICOLON,t):"."===t&&f.test(this._input.peek(1))?e=this._create_token(l.DOT,t):","===t&&(e=this._create_token(l.COMMA,t)),e&&this._input.next(),e},x.prototype._read_punctuation=function(){var t=this.__patterns.punct.read();if(""!==t)return"="===t?this._create_token(l.EQUALS,t):"?."===t?this._create_token(l.DOT,t):this._create_token(l.OPERATOR,t)},x.prototype._read_non_javascript=function(t){var e="";if("#"===t){if(this._is_first_token()&&(e=this.__patterns.shebang.read()))return this._create_token(l.UNKNOWN,e.trim()+"\n");if(e=this.__patterns.include.read())return this._create_token(l.UNKNOWN,e.trim()+"\n");t=this._input.next();var n="#";if(this._input.hasNext()&&this._input.testChar(d)){do{n+=t=this._input.next()}while(this._input.hasNext()&&"#"!==t&&"="!==t);return"#"===t||("["===this._input.peek()&&"]"===this._input.peek(1)?(n+="[]",this._input.next(),this._input.next()):"{"===this._input.peek()&&"}"===this._input.peek(1)&&(n+="{}",this._input.next(),this._input.next())),this._create_token(l.WORD,n)}this._input.back()}else if("<"===t&&this._is_first_token()){if(e=this.__patterns.html_comment_start.read()){for(;this._input.hasNext()&&!this._input.testChar(o.newline);)e+=this._input.next();return y=!0,this._create_token(l.COMMENT,e)}}else if(y&&"-"===t&&(e=this.__patterns.html_comment_end.read()))return y=!1,this._create_token(l.COMMENT,e);return null},x.prototype._read_comment=function(t){var e=null;if("/"===t){var n="";if("*"===this._input.peek(1)){n=this.__patterns.block_comment.read();var i=h.get_directives(n);i&&"start"===i.ignore&&(n+=h.readIgnored(this._input)),n=n.replace(o.allLineBreaks,"\n"),(e=this._create_token(l.BLOCK_COMMENT,n)).directives=i}else"/"===this._input.peek(1)&&(n=this.__patterns.comment.read(),e=this._create_token(l.COMMENT,n))}return e},x.prototype._read_string=function(t){if("`"===t||"'"===t||'"'===t){var e=this._input.next();return this.has_char_escapes=!1,e+="`"===t?this._read_string_recursive("`",!0,"${"):this._read_string_recursive(t),this.has_char_escapes&&this._options.unescape_strings&&(e=function(t){var e="",n=0,s=new i(t),r=null;for(;s.hasNext();)if((r=s.match(/([\s]|[^\\]|\\\\)+/g))&&(e+=r[0]),"\\"===s.peek()){if(s.next(),"x"===s.peek())r=s.match(/x([0-9A-Fa-f]{2})/g);else{if("u"!==s.peek()){e+="\\",s.hasNext()&&(e+=s.next());continue}r=s.match(/u([0-9A-Fa-f]{4})/g)}if(!r)return t;if((n=parseInt(r[1],16))>126&&n<=255&&0===r[0].indexOf("x"))return t;if(n>=0&&n<32){e+="\\"+r[0];continue}e+=34===n||39===n||92===n?"\\"+String.fromCharCode(n):String.fromCharCode(n)}return e}(e)),this._input.peek()===t&&(e+=this._input.next()),e=e.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,e)}return null},x.prototype._allow_regexp_or_xml=function(t){return t.type===l.RESERVED&&p(t.text,["return","case","throw","else","do","typeof","yield"])||t.type===l.END_EXPR&&")"===t.text&&t.opened.previous.type===l.RESERVED&&p(t.opened.previous.text,["if","while","for"])||p(t.type,[l.COMMENT,l.START_EXPR,l.START_BLOCK,l.START,l.END_BLOCK,l.OPERATOR,l.EQUALS,l.EOF,l.SEMICOLON,l.COMMA])},x.prototype._read_regexp=function(t,e){if("/"===t&&this._allow_regexp_or_xml(e)){for(var n=this._input.next(),i=!1,s=!1;this._input.hasNext()&&(i||s||this._input.peek()!==t)&&!this._input.testChar(o.newline);)n+=this._input.peek(),i?i=!1:(i="\\"===this._input.peek(),"["===this._input.peek()?s=!0:"]"===this._input.peek()&&(s=!1)),this._input.next();return this._input.peek()===t&&(n+=this._input.next(),n+=this._input.read(o.identifier)),this._create_token(l.STRING,n)}return null},x.prototype._read_xml=function(t,e){if(this._options.e4x&&"<"===t&&this._allow_regexp_or_xml(e)){var n="",i=this.__patterns.xml.read_match();if(i){for(var s=i[2].replace(/^{\s+/,"{").replace(/\s+}$/,"}"),r=0===s.indexOf("{"),a=0;i;){var _=!!i[1],u=i[2];if(!(!!i[i.length-1]||"![CDATA["===u.slice(0,8))&&(u===s||r&&u.replace(/^{\s+/,"{").replace(/\s+}$/,"}"))&&(_?--a:++a),n+=i[0],a<=0)break;i=this.__patterns.xml.read_match()}return i||(n+=this._input.match(/[\s\S]*/g)[0]),n=n.replace(o.allLineBreaks,"\n"),this._create_token(l.STRING,n)}}return null},x.prototype._read_string_recursive=function(t,e,n){var i,s;"'"===t?s=this.__patterns.single_quote:'"'===t?s=this.__patterns.double_quote:"`"===t?s=this.__patterns.template_text:"}"===t&&(s=this.__patterns.template_expression);for(var r=s.read(),a="";this._input.hasNext();){if((a=this._input.next())===t||!e&&o.newline.test(a)){this._input.back();break}"\\"===a&&this._input.hasNext()?("x"===(i=this._input.peek())||"u"===i?this.has_char_escapes=!0:"\r"===i&&"\n"===this._input.peek(1)&&this._input.next(),a+=this._input.next()):n&&("${"===n&&"$"===a&&"{"===this._input.peek()&&(a+=this._input.next()),n===a&&(a+="`"===t?this._read_string_recursive("}",e,"`"):this._read_string_recursive("`",e,"${"),this._input.hasNext()&&(a+=this._input.next()))),r+=a+=s.read()}return r},t.exports.Tokenizer=x,t.exports.TOKEN=l,t.exports.positionable_operators=g.slice(),t.exports.line_starters=v.slice()},function(t){var e=RegExp.prototype.hasOwnProperty("sticky");function n(t){this.__input=t||"",this.__input_length=this.__input.length,this.__position=0}n.prototype.restart=function(){this.__position=0},n.prototype.back=function(){this.__position>0&&(this.__position-=1)},n.prototype.hasNext=function(){return this.__position=0&&t=0&&e=t.length&&this.__input.substring(e-t.length,e).toLowerCase()===t},t.exports.InputScanner=n},function(t,e,n){var i=n(8).InputScanner,s=n(3).Token,r=n(10).TokenStream,a=n(11).WhitespacePattern,o={START:"TK_START",RAW:"TK_RAW",EOF:"TK_EOF"},_=function(t,e){this._input=new i(t),this._options=e||{},this.__tokens=null,this._patterns={},this._patterns.whitespace=new a(this._input)};_.prototype.tokenize=function(){var t;this._input.restart(),this.__tokens=new r,this._reset();for(var e=new s(o.START,""),n=null,i=[],a=new r;e.type!==o.EOF;){for(t=this._get_next_token(e,n);this._is_comment(t);)a.add(t),t=this._get_next_token(e,n);a.isEmpty()||(t.comments_before=a,a=new r),t.parent=n,this._is_opening(t)?(i.push(n),n=t):n&&this._is_closing(t,n)&&(t.opened=n,n.closed=t,n=i.pop(),t.parent=n),t.previous=e,e.next=t,this.__tokens.add(t),e=t}return this.__tokens},_.prototype._is_first_token=function(){return this.__tokens.isEmpty()},_.prototype._reset=function(){},_.prototype._get_next_token=function(t,e){this._readWhitespace();var n=this._input.read(/.+/g);return n?this._create_token(o.RAW,n):this._create_token(o.EOF,"")},_.prototype._is_comment=function(t){return!1},_.prototype._is_opening=function(t){return!1},_.prototype._is_closing=function(t,e){return!1},_.prototype._create_token=function(t,e){return new s(t,e,this._patterns.whitespace.newline_count,this._patterns.whitespace.whitespace_before_token)},_.prototype._readWhitespace=function(){return this._patterns.whitespace.read()},t.exports.Tokenizer=_,t.exports.TOKEN=o},function(t){function e(t){this.__tokens=[],this.__tokens_length=this.__tokens.length,this.__position=0,this.__parent_token=t}e.prototype.restart=function(){this.__position=0},e.prototype.isEmpty=function(){return 0===this.__tokens_length},e.prototype.hasNext=function(){return this.__position=0&&t/),erb:n.starting_with(/<%[^%]/).until_after(/[^%]%>/),django:n.starting_with(/{%/).until_after(/%}/),django_value:n.starting_with(/{{/).until_after(/}}/),django_comment:n.starting_with(/{#/).until_after(/#}/),smarty:n.starting_with(/{(?=[^}{\s\n])/).until_after(/[^\s\n]}/),smarty_comment:n.starting_with(/{\*/).until_after(/\*}/),smarty_literal:n.starting_with(/{literal}/).until_after(/{\/literal}/)}}r.prototype=new i,r.prototype._create=function(){return new r(this._input,this)},r.prototype._update=function(){this.__set_templated_pattern()},r.prototype.disable=function(t){var e=this._create();return e._disabled[t]=!0,e._update(),e},r.prototype.read_options=function(t){var e=this._create();for(var n in s)e._disabled[n]=-1===t.templating.indexOf(n);return e._update(),e},r.prototype.exclude=function(t){var e=this._create();return e._excluded[t]=!0,e._update(),e},r.prototype.read=function(){var t="";t=this._match_pattern?this._input.read(this._starting_pattern):this._input.read(this._starting_pattern,this.__template_pattern);for(var e=this._read_template();e;)this._match_pattern?e+=this._input.read(this._match_pattern):e+=this._input.readUntil(this.__template_pattern),t+=e,e=this._read_template();return this._until_after&&(t+=this._input.readUntilAfter(this._until_pattern)),t},r.prototype.__set_templated_pattern=function(){var t=[];this._disabled.php||t.push(this.__patterns.php._starting_pattern.source),this._disabled.handlebars||t.push(this.__patterns.handlebars._starting_pattern.source),this._disabled.erb||t.push(this.__patterns.erb._starting_pattern.source),this._disabled.django||(t.push(this.__patterns.django._starting_pattern.source),t.push(this.__patterns.django_value._starting_pattern.source),t.push(this.__patterns.django_comment._starting_pattern.source)),this._disabled.smarty||t.push(this.__patterns.smarty._starting_pattern.source),this._until_pattern&&t.push(this._until_pattern.source),this.__template_pattern=this._input.get_regexp("(?:"+t.join("|")+")")},r.prototype._read_template=function(){var t="",e=this._input.peek();if("<"===e){var n=this._input.peek(1);this._disabled.php||this._excluded.php||"?"!==n||(t=t||this.__patterns.php.read()),this._disabled.erb||this._excluded.erb||"%"!==n||(t=t||this.__patterns.erb.read())}else"{"===e&&(this._disabled.handlebars||this._excluded.handlebars||(t=(t=(t=t||this.__patterns.handlebars_comment.read())||this.__patterns.handlebars_unescaped.read())||this.__patterns.handlebars.read()),this._disabled.django||(this._excluded.django||this._excluded.handlebars||(t=t||this.__patterns.django_value.read()),this._excluded.django||(t=(t=t||this.__patterns.django_comment.read())||this.__patterns.django.read())),this._disabled.smarty||this._disabled.django&&this._disabled.handlebars&&(t=(t=(t=t||this.__patterns.smarty_comment.read())||this.__patterns.smarty_literal.read())||this.__patterns.smarty.read()));return t},t.exports.TemplatablePattern=r}],e={};var n=function n(i){var s=e[i];if(void 0!==s)return s.exports;var r=e[i]={exports:{}};return t[i](r,r.exports,n),r.exports}(0);i=n}();var s=i;void 0===(n=function(){return{js_beautify:s}}.apply(e,[]))||(t.exports=n)}()},167:function(){!function(t){var e="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},i={bash:n,environment:{pattern:RegExp("\\$"+e),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+e),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};t.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+e),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},parameter:{pattern:/(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:i},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:i},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:i.entity}}],environment:{pattern:RegExp("\\$?"+e),alias:"constant"},variable:i.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=t.languages.bash;for(var s=["comment","function-name","for-or-select","assign-left","parameter","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],r=i.variable[1].inside,a=0;a]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}},44:function(t,e,n){var i=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function t(e){return e instanceof r?new r(e.type,t(e.content),e.alias):Array.isArray(e)?e.map(t):e.replace(/&/g,"&").replace(/=l.reach);x+=w.value.length,w=w.next){var S=w.value;if(e.length>t.length)return;if(!(S instanceof r)){var E,O=1;if(y){if(!(E=a(k,x,t,m))||E.index>=t.length)break;var P=E.index,A=E.index+E[0].length,T=x;for(T+=w.value.length;P>=T;)T+=(w=w.next).value.length;if(x=T-=w.value.length,w.value instanceof r)continue;for(var R=w;R!==e.tail&&(Tl.reach&&(l.reach=I);var D=w.prev;if(L&&(D=u(e,D,L),x+=L.length),p(e,D,O),w=u(e,D,new r(h,g?s.tokenize(N,g):N,b,N)),C&&u(e,w,C),O>1){var F={cause:h+","+d,reach:I};o(t,e,n,w.prev,x,F),l&&F.reach>l.reach&&(l.reach=F.reach)}}}}}}function _(){var t={value:null,prev:null,next:null},e={value:null,prev:t,next:null};t.next=e,this.head=t,this.tail=e,this.length=0}function u(t,e,n){var i=e.next,s={value:n,prev:e,next:i};return e.next=s,i.prev=s,t.length++,s}function p(t,e,n){for(var i=e.next,s=0;s"+r.content+""},!t.document)return t.addEventListener?(s.disableWorkerMessageHandler||t.addEventListener("message",(function(e){var n=JSON.parse(e.data),i=n.language,r=n.code,a=n.immediateClose;t.postMessage(s.highlight(r,s.languages[i],i)),a&&t.close()}),!1),s):s;var l=s.util.currentScript();function h(){s.manual||s.highlightAll()}if(l&&(s.filename=l.src,l.hasAttribute("data-manual")&&(s.manual=!0)),!s.manual){var c=document.readyState;"loading"===c||"interactive"===c&&l&&l.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return s}("undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{});t.exports&&(t.exports=i),void 0!==n.g&&(n.g.Prism=i)},165:function(){!function(t){var e,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;t.languages.css.selector={pattern:t.languages.css.selector.pattern,lookbehind:!0,inside:e={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},t.languages.css.atrule.inside["selector-function-argument"].inside=e,t.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var i={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},s={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};t.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|RebeccaPurple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:i,number:s,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:i,number:s})}(Prism)},164:function(){!function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(Prism)},170:function(){!function(t){t.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},t.hooks.add("before-tokenize",(function(e){t.languages["markup-templating"].buildPlaceholders(e,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),t.hooks.add("after-tokenize",(function(e){t.languages["markup-templating"].tokenizePlaceholders(e,"handlebars")})),t.languages.hbs=t.languages.handlebars,t.languages.mustache=t.languages.handlebars}(Prism)},161:function(){Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),Prism.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),Prism.languages.markup&&(Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),Prism.languages.js=Prism.languages.javascript},163:function(){Prism.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},Prism.languages.webmanifest=Prism.languages.json},168:function(){!function(t){var e=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(t){return t=t.replace(//g,(function(){return e})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+t+")")}var i=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,s=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return i})),r=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;t.languages.markdown=t.languages.extend("markup",{}),t.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:t.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+s+r+"(?:"+s+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+s+r+")(?:"+s+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(i),inside:t.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+s+")"+r+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+s+"$"),inside:{"table-header":{pattern:RegExp(i),alias:"important",inside:t.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(e){["url","bold","italic","strike","code-snippet"].forEach((function(n){e!==n&&(t.languages.markdown[e].inside.content.inside[n]=t.languages.markdown[n])}))})),t.hooks.add("after-tokenize",(function(t){"markdown"!==t.language&&"md"!==t.language||function t(e){if(e&&"string"!=typeof e)for(var n=0,i=e.length;n",quot:'"'},_=String.fromCodePoint||String.fromCharCode;t.languages.md=t.languages.markdown}(Prism)},157:function(){!function(t){function e(t,e){return"___"+t.toUpperCase()+e+"___"}Object.defineProperties(t.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,i,s,r){if(n.language===i){var a=n.tokenStack=[];n.code=n.code.replace(s,(function(t){if("function"==typeof r&&!r(t))return t;for(var s,o=a.length;-1!==n.code.indexOf(s=e(i,o));)++o;return a[o]=t,s})),n.grammar=t.languages.markup}}},tokenizePlaceholders:{value:function(n,i){if(n.language===i&&n.tokenStack){n.grammar=t.languages[i];var s=0,r=Object.keys(n.tokenStack);!function a(o){for(var _=0;_=r.length);_++){var u=o[_];if("string"==typeof u||u.content&&"string"==typeof u.content){var p=r[s],l=n.tokenStack[p],h="string"==typeof u?u:u.content,c=e(i,p),d=h.indexOf(c);if(d>-1){++s;var f=h.substring(0,d),g=new t.Token(i,t.tokenize(l,n.grammar),"language-"+i,l),m=h.substring(d+c.length),y=[];f&&y.push.apply(y,a([f])),y.push(g),m&&y.push.apply(y,a([m])),"string"==typeof u?o.splice.apply(o,[_,1].concat(y)):u.content=y}}else u.content&&a(u.content)}return o}(n.tokens)}}}})}(Prism)},158:function(){Prism.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",(function(t){"entity"===t.type&&(t.attributes.title=t.content.replace(/&/,"&"))})),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(t,e){var n={};n["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},n.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:n}};i["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var s={};s[t]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return t})),"i"),lookbehind:!0,greedy:!0,inside:i},Prism.languages.insertBefore("markup","cdata",s)}}),Object.defineProperty(Prism.languages.markup.tag,"addAttribute",{value:function(t,e){Prism.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Prism.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml},166:function(){Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss},159:function(){Prism.languages.twig={comment:/^\{#[\s\S]*?#\}$/,"tag-name":{pattern:/(^\{%-?\s*)\w+/,lookbehind:!0,alias:"keyword"},delimiter:{pattern:/^\{[{%]-?|-?[%}]\}$/,alias:"punctuation"},string:{pattern:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,inside:{punctuation:/^['"]|['"]$/}},keyword:/\b(?:even|if|odd)\b/,boolean:/\b(?:false|null|true)\b/,number:/\b0x[\dA-Fa-f]+|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][-+]?\d+)?/,operator:[{pattern:/(\s)(?:and|b-and|b-or|b-xor|ends with|in|is|matches|not|or|same as|starts with)(?=\s)/,lookbehind:!0},/[=<>]=?|!=|\*\*?|\/\/?|\?:?|[-+~%|]/],punctuation:/[()\[\]{}:.,]/},Prism.hooks.add("before-tokenize",(function(t){if("twig"===t.language){Prism.languages["markup-templating"].buildPlaceholders(t,"twig",/\{(?:#[\s\S]*?#|%[\s\S]*?%|\{[\s\S]*?\})\}/g)}})),Prism.hooks.add("after-tokenize",(function(t){Prism.languages["markup-templating"].tokenizePlaceholders(t,"twig")}))},162:function(){!function(t){t.languages.typescript=t.languages.extend("javascript",{"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|type)\s+)(?!keyof\b)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?:\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),t.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete t.languages.typescript.parameter,delete t.languages.typescript["literal-property"];var e=t.languages.extend("typescript",{});delete e["class-name"],t.languages.typescript["class-name"].inside=e,t.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e}}}}),t.languages.ts=t.languages.typescript}(Prism)},169:function(){!function(t){var e=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,i="(?:"+n.source+"(?:[ \t]+"+e.source+")?|"+e.source+"(?:[ \t]+"+n.source+")?)",s=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),r=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function a(t,e){e=(e||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return t}));return RegExp(n,e)}t.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return i}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return i})).replace(/<>/g,(function(){return"(?:"+s+"|"+r+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:a(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:a(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:a(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:a(r),lookbehind:!0,greedy:!0},number:{pattern:a(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:e,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},t.languages.yml=t.languages.yaml}(Prism)},87:function(t){!function(){if("undefined"!=typeof Prism){var e=Object.assign||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t},n={"remove-trailing":"boolean","remove-indent":"boolean","left-trim":"boolean","right-trim":"boolean","break-lines":"number",indent:"number","remove-initial-line-feed":"boolean","tabs-to-spaces":"number","spaces-to-tabs":"number"};i.prototype={setDefaults:function(t){this.defaults=e(this.defaults,t)},normalize:function(t,n){for(var i in n=e(this.defaults,n)){var s=i.replace(/-(\w)/g,(function(t,e){return e.toUpperCase()}));"normalize"!==i&&"setDefaults"!==s&&n[i]&&this[s]&&(t=this[s].call(this,t,n[i]))}return t},leftTrim:function(t){return t.replace(/^\s+/,"")},rightTrim:function(t){return t.replace(/\s+$/,"")},tabsToSpaces:function(t,e){return e=0|e||4,t.replace(/\t/g,new Array(++e).join(" "))},spacesToTabs:function(t,e){return e=0|e||4,t.replace(RegExp(" {"+e+"}","g"),"\t")},removeTrailing:function(t){return t.replace(/\s*?$/gm,"")},removeInitialLineFeed:function(t){return t.replace(/^(?:\r?\n|\r)/,"")},removeIndent:function(t){var e=t.match(/^[^\S\n\r]*(?=\S)/gm);return e&&e[0].length?(e.sort((function(t,e){return t.length-e.length})),e[0].length?t.replace(RegExp("^"+e[0],"gm"),""):t):t},indent:function(t,e){return t.replace(/^[^\S\n\r]*(?=\S)/gm,new Array(++e).join("\t")+"$&")},breakLines:function(t,e){e=!0===e?80:0|e||80;for(var n=t.split("\n"),i=0;ie&&(r[o]="\n"+r[o],a=_)}n[i]=r.join("")}return n.join("\n")}},t.exports&&(t.exports=i),Prism.plugins.NormalizeWhitespace=new i({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",(function(t){var e=Prism.plugins.NormalizeWhitespace;if((!t.settings||!1!==t.settings["whitespace-normalization"])&&Prism.util.isActive(t.element,"whitespace-normalization",!0))if(t.element&&t.element.parentNode||!t.code){var i=t.element.parentNode;if(t.code&&i&&"pre"===i.nodeName.toLowerCase()){for(var s in null==t.settings&&(t.settings={}),n)if(Object.hasOwnProperty.call(n,s)){var r=n[s];if(i.hasAttribute("data-"+s))try{var a=JSON.parse(i.getAttribute("data-"+s)||"true");typeof a===r&&(t.settings[s]=a)}catch(d){}}for(var o=i.childNodes,_="",u="",p=!1,l=0;l{window.requestAnimationFrame((()=>{const p=Date.now(),l=Math.min(1,(p-r)/o);if(e===i)return u?u():null;!function(t,e){const n=a.getDocument();t===n.body||t===n.documentElement||t instanceof Window?(n.body.scrollTop=e,n.documentElement.scrollTop=e):t.scrollTop=e}(t,_(l)*(i-e)+e),l<1?n(e,i,s,r,o,_,u):u&&u()}))},i=function(t){const e=a.getDocument();return t===e.body||t===e.documentElement||t instanceof Window?e.body.scrollTop||e.documentElement.scrollTop:t.scrollTop}(t),s=function(t){const e={window:{y:"scrollY",x:"scrollX"},element:{y:"scrollTop",x:"scrollLeft"}},n="y";return t instanceof Window?e.window[n]:e.element[n]}(t);return new Promise((t=>{n(i,"number"==typeof e.top?e.top:i,s,Date.now(),e.duration,_(e.easing),t)}))}))}function r(t={}){return"smooth"===t.behavior&&(t.easing="ease-in-out",t.duration=300),"auto"===t.behavior&&(t.duration=0,t.easing="linear"),t}const a={getDocument(){return document}},o={linear(t){return t},"ease-in"(t){return t*t},"ease-out"(t){return t*(2-t)},"ease-in-out"(t){return t<.5?2*t*t:(4-2*t)*t-1}},_=t=>{const e=o[t||"linear"];if(!e){const e=Object.keys(o).join(",");throw new Error(`Scroll error: scroller does not support an easing option of "${t}". Supported options are ${e}`)}return e}}}]); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/4-chunk-efb48caad6ff1a4474f5.modern.js.LICENSE.txt b/version/v2.18.3/styleguide/js/4-chunk-efb48caad6ff1a4474f5.modern.js.LICENSE.txt new file mode 100644 index 0000000000..353a9f05db --- /dev/null +++ b/version/v2.18.3/styleguide/js/4-chunk-efb48caad6ff1a4474f5.modern.js.LICENSE.txt @@ -0,0 +1,92 @@ +/*! + * Determine if an object is a Buffer + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ + +/*! + * condense-newlines + * + * Copyright (c) 2014 Jon Schlinkert, contributors. + * Licensed under the MIT License + */ + +/*! + * is-extendable + * + * Copyright (c) 2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * is-whitespace + * + * Copyright (c) 2014-2015, Jon Schlinkert. + * Licensed under the MIT License. + */ + +/*! + * pretty + * + * Copyright (c) 2013-2015, 2017, Jon Schlinkert. + * Released under the MIT License. + */ + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ + +/** + * Prism: Lightweight, robust, elegant syntax highlighting + * + * @license MIT + * @author Lea Verou + * @namespace + * @public + */ + +/**! + + @license + handlebars v4.7.7 + +Copyright (C) 2011-2019 by Yehuda Katz + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. + +*/ diff --git a/version/v2.18.3/styleguide/js/patternlab-pattern.js b/version/v2.18.3/styleguide/js/patternlab-pattern.js new file mode 100644 index 0000000000..e273acbdeb --- /dev/null +++ b/version/v2.18.3/styleguide/js/patternlab-pattern.js @@ -0,0 +1,2 @@ +/*! For license information please see patternlab-pattern.js.LICENSE.txt */ +!function(){var t={23:function(t,e,n){var r,o,i,a;function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}t=n.nmd(t),a=function(){return function(){var t={686:function(t,e,n){"use strict";n.d(e,{default:function(){return x}});var r=n(279),o=n.n(r),i=n(370),a=n.n(i),c=n(817),l=n.n(c);function u(t){try{return document.execCommand(t)}catch(e){return!1}}var s=function(t){var e=l()(t);return u("cut"),e},f=function(t,e){var n=function(t){var e="rtl"===document.documentElement.getAttribute("dir"),n=document.createElement("textarea");n.style.fontSize="12pt",n.style.border="0",n.style.padding="0",n.style.margin="0",n.style.position="absolute",n.style[e?"right":"left"]="-9999px";var r=window.pageYOffset||document.documentElement.scrollTop;return n.style.top="".concat(r,"px"),n.setAttribute("readonly",""),n.value=t,n}(t);e.container.appendChild(n);var r=l()(n);return u("copy"),n.remove(),r},p=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=f(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=f(t.value,e):(n=l()(t),u("copy")),n};function d(t){return d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},d(t)}var h=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,r=t.container,o=t.target,i=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==o){if(!o||"object"!==d(o)||1!==o.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&o.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(o.hasAttribute("readonly")||o.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return i?p(i,{container:r}):o?"cut"===n?s(o):p(o,{container:r}):void 0};function y(t){return y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},y(t)}function v(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===y(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",r=h({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(r?"success":"error",{action:n,text:r,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return L("action",t)}},{key:"defaultTarget",value:function(t){var e=L("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return L("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],r=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return p(t,e)}},{key:"cut",value:function(t){return s(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&v(e.prototype,n),r&&v(e,r),i}(o()),x=E},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var r=n(828);function o(t,e,n,r,o){var a=i.apply(this,arguments);return t.addEventListener(n,a,o),{destroy:function(){t.removeEventListener(n,a,o)}}}function i(t,e,n,o){return function(n){n.delegateTarget=r(n.target,e),n.delegateTarget&&o.call(t,n)}}t.exports=function(t,e,n,r,i){return"function"==typeof t.addEventListener?o.apply(null,arguments):"function"==typeof n?o.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return o(t,e,n,r,i)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var r=n(879),o=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!r.string(e))throw new TypeError("Second argument must be a String");if(!r.fn(n))throw new TypeError("Third argument must be a Function");if(r.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(r.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(r.string(t))return function(t,e,n){return o(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var r=window.getSelection(),o=document.createRange();o.selectNodeContents(t),r.removeAllRanges(),r.addRange(o),e=r.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var r=this.e||(this.e={});return(r[t]||(r[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var r=this;function o(){r.off(t,o),e.apply(n,arguments)}return o._=e,this.on(t,o,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),r=0,o=n.length;r":".","?":"/","|":"\\"},f={option:"alt",command:"meta",return:"enter",escape:"esc",plus:"+",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},p=1;p<20;++p)l[111+p]="f"+p;for(p=0;p<=9;++p)l[p+96]=p.toString();w.prototype.bind=function(t,e,n){var r=this;return t=t instanceof Array?t:[t],r._bindMultiple.call(r,t,e,n),r},w.prototype.unbind=function(t,e){return this.bind.call(this,t,(function(){}),e)},w.prototype.trigger=function(t,e){var n=this;return n._directMap[t+":"+e]&&n._directMap[t+":"+e]({},t),n},w.prototype.reset=function(){var t=this;return t._callbacks={},t._directMap={},t},w.prototype.stopCallback=function(t,e){if((" "+e.className+" ").indexOf(" mousetrap ")>-1)return!1;if(m(e,this.target))return!1;if("composedPath"in t&&"function"==typeof t.composedPath){var n=t.composedPath()[0];n!==t.target&&(e=n)}return"INPUT"==e.tagName||"SELECT"==e.tagName||"TEXTAREA"==e.tagName||e.isContentEditable},w.prototype.handleKey=function(){var t=this;return t._handleKey.apply(t,arguments)},w.addKeycodes=function(t){for(var e in t)t.hasOwnProperty(e)&&(l[e]=t[e]);c=null},w.init=function(){var t=w(i);for(var e in t)"_"!==e.charAt(0)&&(w[e]=function(e){return function(){return t[e].apply(t,arguments)}}(e))},w.init(),o.Mousetrap=w,t.exports&&(t.exports=w),void 0===(r=function(){return w}.call(e,n,e,t))||(t.exports=r)}function d(t,e,n){t.addEventListener?t.addEventListener(e,n,!1):t.attachEvent("on"+e,n)}function h(t){if("keypress"==t.type){var e=String.fromCharCode(t.which);return t.shiftKey||(e=e.toLowerCase()),e}return l[t.which]?l[t.which]:u[t.which]?u[t.which]:String.fromCharCode(t.which).toLowerCase()}function y(t){return"shift"==t||"ctrl"==t||"alt"==t||"meta"==t}function v(t,e,n){return n||(n=function(){if(!c)for(var t in c={},l)t>95&&t<112||l.hasOwnProperty(t)&&(c[l[t]]=t);return c}()[t]?"keydown":"keypress"),"keypress"==n&&e.length&&(n="keydown"),n}function g(t,e){var n,r,o,i=[];for(n=function(t){return"+"===t?["+"]:(t=t.replace(/\+{2}/g,"+plus")).split("+")}(t),o=0;o1?p(t,c,n,r):(a=g(t,r),e._callbacks[a.key]=e._callbacks[a.key]||[],u(a.key,a.modifiers,{type:a.action},o,t,i),e._callbacks[a.key][o?"unshift":"push"]({callback:n,modifiers:a.modifiers,action:a.action,seq:o,level:i,combo:t}))}e._handleKey=function(t,e,n){var r,o=u(t,e,n),i={},f=0,p=!1;for(r=0;r=0;--i){var a=this.tryEntries[i],c=a.completion;if("root"===a.tryLoc)return r("end");if(a.tryLoc<=this.prev){var l=o.call(a,"catchLoc"),u=o.call(a,"finallyLoc");if(l&&u){if(this.prev=0;--n){var r=this.tryEntries[n];if(r.tryLoc<=this.prev&&o.call(r,"finallyLoc")&&this.prev=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),j(n),v}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var r=n.completion;if("throw"===r.type){var o=r.arg;j(n)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,n,r){return this.delegate={iterator:A(t),resultName:n,nextLoc:r},"next"===this.method&&(this.arg=e),v}},t}("object"===r(t=n.nmd(t))?t.exports:{});try{regeneratorRuntime=o}catch(i){"object"===("undefined"==typeof globalThis?"undefined":r(globalThis))?globalThis.regeneratorRuntime=o:Function("r","regeneratorRuntime = r")(o)}},62:function(t,e,n){var r;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}!function(e){"use strict";function i(){}var a=i.prototype,c=e.EventEmitter;function l(t,e){for(var n=t.length;n--;)if(t[n].listener===e)return n;return-1}function u(t){return function(){return this[t].apply(this,arguments)}}function s(t){return"function"==typeof t||t instanceof RegExp||!(!t||"object"!==o(t))&&s(t.listener)}a.getListeners=function(t){var e,n,r=this._getEvents();if(t instanceof RegExp)for(n in e={},r)r.hasOwnProperty(n)&&t.test(n)&&(e[n]=r[n]);else e=r[t]||(r[t]=[]);return e},a.flattenListeners=function(t){var e,n=[];for(e=0;e1)for(var e,n=0,r=t.substr(1).split("&");n1?unescape(e[1]):""}(window.location.search)},pushPattern:function(t,e){var n=r.getFileName(t),o=window.location.pathname;if(o="file"===window.location.protocol?o.replace("/public/index.html","public/"):o.replace(/\/index\.html/,"/"),e!==window.location.protocol+"//"+window.location.host+o+n){var i=JSON.stringify({event:"patternLab.updatePath",path:n});document.querySelector(".pl-js-iframe").contentWindow.postMessage(i,r.targetOrigin)}},popPattern:function(t){var e,n=t.state;if(null!==n){null!==n&&(e=n.currentPattern);var o="";""===(o=this.getFileName(e))&&(o="styleguide/html/styleguide.html");var i=JSON.stringify({event:"patternLab.updatePath",path:o});document.querySelector(".pl-js-iframe").contentWindow.postMessage(i,r.targetOrigin)}else this.skipBack=!1}};window.onpopstate=function(){r.skipBack=!0};var o=n(62);new(n.n(o)());"attachShadow"in Element.prototype&&"getRootNode"in Element.prototype||window.ShadyDOM;var i="file:"===window.location.protocol?"*":window.location.protocol+"//"+window.location.host;if(window.config){void 0!==window.config.defaultPattern&&"string"==typeof window.config.defaultPattern&&window.config.defaultPattern.trim().length>0?window.config.defaultPattern:"all";var a=r.getRequestVars();void 0===a.p&&void 0===a.pattern||(void 0!==a.p?a.p:a.pattern)}if(void 0!==window.config&&(void 0!==window.config.ishMinimum&&parseInt(window.config.ishMinimum,10),void 0!==window.config.ishMaximum&&parseInt(window.config.ishMaximum,10),void 0!==window.config.ishViewportRange&&(window.config.ishViewportRange.s[0],window.config.ishViewportRange.l[1]),window.config.ishViewportRange&&window.config.ishMaximum)){var c=parseInt(window.config.ishViewportRange.l[1],10),l=parseInt(window.config.ishMaximum,10);c>l?c:l}var u={active:[],targetOrigin:"file:"===window.location.protocol?"*":window.location.protocol+"//"+window.location.host,onReady:function(){for(var t=document.querySelectorAll(".pl-js-pattern-extra-toggle"),e=function(e){t[e].addEventListener("click",(function(n){var r=t[e].getAttribute("data-patternpartial");u.toggle(r)}))},n=0;n0&&r.removeChild(r.childNodes[0]),document.getElementById("pl-pattern-extra-"+e).appendChild(n);var o=document.getElementById("pl-pattern-extra-toggle-"+e);o&&o.classList.add("pl-is-active"),document.getElementById("pl-pattern-extra-"+e).classList.add("pl-is-active")},close:function(t){u.active[t]=!1;var e=document.getElementById("pl-pattern-extra-toggle-"+t);e&&e.classList.remove("pl-is-active"),document.getElementById("pl-pattern-extra-"+t)&&document.getElementById("pl-pattern-extra-"+t).classList.remove("pl-is-active")},collectAndSend:function(t,e,n){if(/\S/.test(t.innerHTML)){var r=JSON.parse(t.innerHTML);if(void 0!==r.patternName){var o=document.querySelector("#"+r.patternPartial+" > .pl-js-pattern-example");r.patternMarkup=null!==o?o.innerHTML:document.querySelector("body").innerHTML,u.patternQueryInfo(r,e,n)}}},highlightsHide:function(t){for(var e=void 0!==t?"#"+t+" > ":"",n=document.querySelectorAll(e+".pl-has-annotation"),r=0;r1,o=0;o0)for(var s=0;s span.pl-c-annotation-tip");null===f?i[s].insertBefore(c,i[s].firstChild):f.hidden=!1,i[s].onclick=function(t){return function(e){e.preventDefault(),e.stopPropagation();var n=JSON.stringify({event:"patternLab.annotationNumberClicked",displayNumber:t.displayNumber});window.parent.postMessage(n,u.targetOrigin)}}(a)}}else if(void 0!==e.event&&"patternLab.annotationsHighlightHide"===e.event)u.highlightsHide();else if(void 0!==e.event&&"patternLab.patternModalClose"===e.event){var p=[];for(var d in u.active)d&&p.push(d);for(var h=0;h1&&void 0!==arguments[1]?arguments[1]:{container:document.body},n="";return"string"==typeof t?n=f(t,e):t instanceof HTMLInputElement&&!["text","search","url","tel","password"].includes(null==t?void 0:t.type)?n=f(t.value,e):(n=l()(t),s("copy")),n};function d(t){return d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},d(t)}var h=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.action,n=void 0===e?"copy":e,o=t.container,r=t.target,i=t.text;if("copy"!==n&&"cut"!==n)throw new Error('Invalid "action" value, use either "copy" or "cut"');if(void 0!==r){if(!r||"object"!==d(r)||1!==r.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===n&&r.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===n&&(r.hasAttribute("readonly")||r.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes')}return i?p(i,{container:o}):r?"cut"===n?u(r):p(r,{container:o}):void 0};function y(t){return y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},y(t)}function g(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof t.action?t.action:this.defaultAction,this.target="function"==typeof t.target?t.target:this.defaultTarget,this.text="function"==typeof t.text?t.text:this.defaultText,this.container="object"===y(t.container)?t.container:document.body}},{key:"listenClick",value:function(t){var e=this;this.listener=a()(t,"click",(function(t){return e.onClick(t)}))}},{key:"onClick",value:function(t){var e=t.delegateTarget||t.currentTarget,n=this.action(e)||"copy",o=h({action:n,container:this.container,target:this.target(e),text:this.text(e)});this.emit(o?"success":"error",{action:n,text:o,trigger:e,clearSelection:function(){e&&e.focus(),window.getSelection().removeAllRanges()}})}},{key:"defaultAction",value:function(t){return E("action",t)}},{key:"defaultTarget",value:function(t){var e=E("target",t);if(e)return document.querySelector(e)}},{key:"defaultText",value:function(t){return E("text",t)}},{key:"destroy",value:function(){this.listener.destroy()}}],o=[{key:"copy",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{container:document.body};return p(t,e)}},{key:"cut",value:function(t){return u(t)}},{key:"isSupported",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],e="string"==typeof t?[t]:t,n=!!document.queryCommandSupported;return e.forEach((function(t){n=n&&!!document.queryCommandSupported(t)})),n}}],n&&g(e.prototype,n),o&&g(e,o),i}(r()),k=L},828:function(t){if("undefined"!=typeof Element&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}t.exports=function(t,e){for(;t&&9!==t.nodeType;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}},438:function(t,e,n){var o=n(828);function r(t,e,n,o,r){var a=i.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function i(t,e,n,r){return function(n){n.delegateTarget=o(n.target,e),n.delegateTarget&&r.call(t,n)}}t.exports=function(t,e,n,o,i){return"function"==typeof t.addEventListener?r.apply(null,arguments):"function"==typeof n?r.bind(null,document).apply(null,arguments):("string"==typeof t&&(t=document.querySelectorAll(t)),Array.prototype.map.call(t,(function(t){return r(t,e,n,o,i)})))}},879:function(t,e){e.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},e.nodeList=function(t){var n=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===n||"[object HTMLCollection]"===n)&&"length"in t&&(0===t.length||e.node(t[0]))},e.string=function(t){return"string"==typeof t||t instanceof String},e.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},370:function(t,e,n){var o=n(879),r=n(438);t.exports=function(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!o.string(e))throw new TypeError("Second argument must be a String");if(!o.fn(n))throw new TypeError("Third argument must be a Function");if(o.node(t))return function(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}(t,e,n);if(o.nodeList(t))return function(t,e,n){return Array.prototype.forEach.call(t,(function(t){t.addEventListener(e,n)})),{destroy:function(){Array.prototype.forEach.call(t,(function(t){t.removeEventListener(e,n)}))}}}(t,e,n);if(o.string(t))return function(t,e,n){return r(document.body,t,e,n)}(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}},817:function(t){t.exports=function(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var o=window.getSelection(),r=document.createRange();r.selectNodeContents(t),o.removeAllRanges(),o.addRange(r),e=o.toString()}return e}},279:function(t){function e(){}e.prototype={on:function(t,e,n){var o=this.e||(this.e={});return(o[t]||(o[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){var o=this;function r(){o.off(t,r),e.apply(n,arguments)}return r._=e,this.on(t,r,n)},emit:function(t){for(var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),o=0,r=n.length;o":".","?":"/","|":"\\"},f={option:"alt",command:"meta",return:"enter",escape:"esc",plus:"+",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},p=1;p<20;++p)l[111+p]="f"+p;for(p=0;p<=9;++p)l[p+96]=p.toString();w.prototype.bind=function(t,e,n){var o=this;return t=t instanceof Array?t:[t],o._bindMultiple.call(o,t,e,n),o},w.prototype.unbind=function(t,e){return this.bind.call(this,t,(function(){}),e)},w.prototype.trigger=function(t,e){var n=this;return n._directMap[t+":"+e]&&n._directMap[t+":"+e]({},t),n},w.prototype.reset=function(){var t=this;return t._callbacks={},t._directMap={},t},w.prototype.stopCallback=function(t,e){if((" "+e.className+" ").indexOf(" mousetrap ")>-1)return!1;if(m(e,this.target))return!1;if("composedPath"in t&&"function"==typeof t.composedPath){var n=t.composedPath()[0];n!==t.target&&(e=n)}return"INPUT"==e.tagName||"SELECT"==e.tagName||"TEXTAREA"==e.tagName||e.isContentEditable},w.prototype.handleKey=function(){var t=this;return t._handleKey.apply(t,arguments)},w.addKeycodes=function(t){for(var e in t)t.hasOwnProperty(e)&&(l[e]=t[e]);c=null},w.init=function(){var t=w(i);for(var e in t)"_"!==e.charAt(0)&&(w[e]=function(e){return function(){return t[e].apply(t,arguments)}}(e))},w.init(),r.Mousetrap=w,t.exports&&(t.exports=w),void 0===(o=function(){return w}.call(e,n,e,t))||(t.exports=o)}function d(t,e,n){t.addEventListener?t.addEventListener(e,n,!1):t.attachEvent("on"+e,n)}function h(t){if("keypress"==t.type){var e=String.fromCharCode(t.which);return t.shiftKey||(e=e.toLowerCase()),e}return l[t.which]?l[t.which]:s[t.which]?s[t.which]:String.fromCharCode(t.which).toLowerCase()}function y(t){return"shift"==t||"ctrl"==t||"alt"==t||"meta"==t}function g(t,e,n){return n||(n=function(){if(!c)for(var t in c={},l)t>95&&t<112||l.hasOwnProperty(t)&&(c[l[t]]=t);return c}()[t]?"keydown":"keypress"),"keypress"==n&&e.length&&(n="keydown"),n}function v(t,e){var n,o,r,i=[];for(n=function(t){return"+"===t?["+"]:(t=t.replace(/\+{2}/g,"+plus")).split("+")}(t),r=0;r1?p(t,c,n,o):(a=v(t,o),e._callbacks[a.key]=e._callbacks[a.key]||[],s(a.key,a.modifiers,{type:a.action},r,t,i),e._callbacks[a.key][r?"unshift":"push"]({callback:n,modifiers:a.modifiers,action:a.action,seq:r,level:i,combo:t}))}e._handleKey=function(t,e,n){var o,r=s(t,e,n),i={},f=0,p=!1;for(o=0;o{t.trigger.classList.remove("is-copied"),t.trigger.querySelector(".pl-c-code-copy-btn__icon-text").textContent="Copy",t.clearSelection(),t.trigger.blur()}),2e3)}));n(25);const o={skipBack:!1,goBack:!1,iframeElement:document.querySelector(".pl-js-iframe"),targetOrigin:"file:"===window.location.protocol?"*":window.location.protocol+"//"+window.location.host,getFileName(t,e){const n="patterns";let o="";if(void 0===t)return o;if(void 0===e&&(e=!0),"all"===t)return"styleguide/html/styleguide.html";if("snapshots"===t)return"snapshots/index.html";const r=-1!==t.indexOf("viewall-")?window.viewAllPaths:window.patternPaths,i=t.replace("viewall-",""),a=this.getPatternInfo(i,r),c=a[0],l=a[1];if(void 0!==r[c]&&void 0!==r[c][l])o=r[c][l];else if(void 0!==r[c])for(const u in r[c])if(-1!==u.indexOf(l)){o=r[c][u];break}if(""===o)return o;const s=/\//g;if(-1!==t.indexOf("viewall-")&&0===t.indexOf("viewall-")&&""!==o)o=n+"/"+o.replace(s,"-")+"/index.html";else if(""!==o&&(o=n+"/"+o.replace(s,"-")+"/"+o.replace(s,"-"),e)){o=o+(void 0!==window.config.outputFileSuffixes&&void 0!==window.config.outputFileSuffixes.rendered?window.config.outputFileSuffixes.rendered:"")+".html"}return o},getPatternInfo(t,e){const n=t.split("-");let o=1;const r=n.length;let i=n[0];for(;void 0===e[i]&&o1)for(let e,n=0,o=t.substr(1).split("&");n1?unescape(e[1]):""}(window.location.search)},pushPattern(t,e){const n=o.getFileName(t);let r=window.location.pathname;r="file"===window.location.protocol?r.replace("/public/index.html","public/"):r.replace(/\/index\.html/,"/");if(e!==window.location.protocol+"//"+window.location.host+r+n){const t=JSON.stringify({event:"patternLab.updatePath",path:n});document.querySelector(".pl-js-iframe").contentWindow.postMessage(t,o.targetOrigin)}},popPattern(t){let e;const n=t.state;if(null===n)return void(this.skipBack=!1);null!==n&&(e=n.currentPattern);let r="";r=this.getFileName(e),""===r&&(r="styleguide/html/styleguide.html");const i=JSON.stringify({event:"patternLab.updatePath",path:r});document.querySelector(".pl-js-iframe").contentWindow.postMessage(i,o.targetOrigin)}};window.onpopstate=function(){o.skipBack=!0};var r=n(24);new(n.n(r)());"attachShadow"in Element.prototype&&"getRootNode"in Element.prototype||window.ShadyDOM;const i="file:"===window.location.protocol?"*":window.location.protocol+"//"+window.location.host;let a="";if(window.config){a=void 0!==window.config.defaultPattern&&"string"==typeof window.config.defaultPattern&&window.config.defaultPattern.trim().length>0?window.config.defaultPattern:"all";const t=o.getRequestVars();void 0===t.p&&void 0===t.pattern||(a=void 0!==t.p?t.p:t.pattern)}let c=240,l=2600;if(void 0!==window.config&&(void 0!==window.config.ishMinimum&&(c=parseInt(window.config.ishMinimum,10)),void 0!==window.config.ishMaximum&&(l=parseInt(window.config.ishMaximum,10)),void 0!==window.config.ishViewportRange&&(c=window.config.ishViewportRange.s[0],l=window.config.ishViewportRange.l[1]),window.config.ishViewportRange&&window.config.ishMaximum)){const t=parseInt(window.config.ishViewportRange.l[1],10),e=parseInt(window.config.ishMaximum,10);l=t>e?t:e}const s={active:[],targetOrigin:"file:"===window.location.protocol?"*":window.location.protocol+"//"+window.location.host,onReady(){const t=document.querySelectorAll(".pl-js-pattern-extra-toggle");for(let e=0;e{const o=t[e].getAttribute("data-patternpartial");s.toggle(o)}))},toggle(t){if(void 0!==s.active[t]&&s.active[t])s.highlightsHide(),s.close(t);else{const e=document.getElementById("pl-pattern-data-"+t);s.collectAndSend(e,!0,!1)}},open(e,n){let o=document.createElement("div");o.innerHTML=n,n=document.createElement("div").appendChild(o).querySelector("div"),n=t.addClickEvents(n,e),s.active[e]=!0,o=document.getElementById("pl-pattern-extra-"+e),o&&o.childNodes&&o.childNodes.length>0&&o.removeChild(o.childNodes[0]),document.getElementById("pl-pattern-extra-"+e).appendChild(n);const r=document.getElementById("pl-pattern-extra-toggle-"+e);r&&r.classList.add("pl-is-active"),document.getElementById("pl-pattern-extra-"+e).classList.add("pl-is-active")},close(t){s.active[t]=!1;const e=document.getElementById("pl-pattern-extra-toggle-"+t);e&&e.classList.remove("pl-is-active"),document.getElementById("pl-pattern-extra-"+t)&&document.getElementById("pl-pattern-extra-"+t).classList.remove("pl-is-active")},collectAndSend(t,e,n){if(/\S/.test(t.innerHTML)){const o=JSON.parse(t.innerHTML);if(void 0!==o.patternName){const t=document.querySelector("#"+o.patternPartial+" > .pl-js-pattern-example");o.patternMarkup=null!==t?t.innerHTML:document.querySelector("body").innerHTML,s.patternQueryInfo(o,e,n)}}},highlightsHide(t){const e=void 0!==t?"#"+t+" > ":"";let n=document.querySelectorAll(e+".pl-has-annotation");for(let o=0;o1;for(let o=0;o0)for(let e=0;e span.pl-c-annotation-tip");null===r?t[e].insertBefore(o,t[e].firstChild):r.hidden=!1,t[e].onclick=function(t){return function(e){e.preventDefault(),e.stopPropagation();const n=JSON.stringify({event:"patternLab.annotationNumberClicked",displayNumber:t.displayNumber});window.parent.postMessage(n,s.targetOrigin)}}(n)}}else if(void 0!==e.event&&"patternLab.annotationsHighlightHide"===e.event)s.highlightsHide();else if(void 0!==e.event&&"patternLab.patternModalClose"===e.event){const t=[];for(const e in s.active)e&&t.push(e);for(let e=0;e{p(t,"iframeKeyDownEvent")})),document.addEventListener("keyup",(t=>{p(t,"iframeKeyUpEvent")})),window.self!==window.top){const t={event:"patternLab.pageLoad",path:window.location.toString().split("?")[0],details:{patternData:window.patternData}};t.patternpartial=void 0!==window.patternData.patternPartial?window.patternData.patternPartial:"all",""!==window.patternData.lineage&&(t.lineage=window.patternData.lineage),window.parent.postMessage(t,i);try{const t=new CustomEvent("patternPartial",{detail:{pattern:window.patternData.patternPartial}});window.parent.document.dispatchEvent(t)}catch(d){}}}()}(); \ No newline at end of file diff --git a/version/v2.18.3/styleguide/js/patternlab-pattern.modern.js.LICENSE.txt b/version/v2.18.3/styleguide/js/patternlab-pattern.modern.js.LICENSE.txt new file mode 100644 index 0000000000..23fa8adb5b --- /dev/null +++ b/version/v2.18.3/styleguide/js/patternlab-pattern.modern.js.LICENSE.txt @@ -0,0 +1,35 @@ +/*! + * Basic postMessage Support + * + * Copyright (c) 2013-2016 Dave Olsen, http://dmolsen.com + * Licensed under the MIT license + * + * Handles the postMessage stuff in the pattern, view-all, and style guide templates. + * + */ + +/*! + * EventEmitter v5.2.9 - git.io/ee + * Unlicense - http://unlicense.org/ + * Oliver Caldwell - https://oli.me.uk/ + * @preserve + */ + +/*! + * URL Handler + * + * Copyright (c) 2013-2014 Dave Olsen, http://dmolsen.com + * Licensed under the MIT license + * + * Helps handle the initial iFrame source. Parses a string to see if it matches + * an expected pattern in Pattern Lab. Supports Pattern Lab's fuzzy pattern partial + * matching style. + * + */ + +/*! + * clipboard.js v2.0.11 + * https://clipboardjs.com/ + * + * Licensed MIT © Zeno Rocha + */ diff --git a/version/v2.18.3/styleguide/js/patternlab-viewer.js b/version/v2.18.3/styleguide/js/patternlab-viewer.js new file mode 100644 index 0000000000..8034d7572c --- /dev/null +++ b/version/v2.18.3/styleguide/js/patternlab-viewer.js @@ -0,0 +1,2 @@ +/*! For license information please see patternlab-viewer.js.LICENSE.txt */ +(function(){var __webpack_modules__=[function(t,e,n){var r,o,i;function a(t){return a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},a(t)}i=function(){"use strict";var t=function(t){var e=t.id,n=t.viewBox,r=t.content;this.id=e,this.viewBox=n,this.content=r};function e(t,e){return t(e={exports:{}},e.exports),e.exports}t.prototype.stringify=function(){return this.content},t.prototype.toString=function(){return this.stringify()},t.prototype.destroy=function(){var t=this;["id","viewBox","content"].forEach((function(e){return delete t[e]}))},"undefined"!=typeof window?window:void 0!==n.g?n.g:"undefined"!=typeof self&&self;var r=e((function(t,e){t.exports=function(){function t(t){return t&&"object"===a(t)&&"[object RegExp]"!==Object.prototype.toString.call(t)&&"[object Date]"!==Object.prototype.toString.call(t)}function e(t){return Array.isArray(t)?[]:{}}function n(n,r){return r&&!0===r.clone&&t(n)?i(e(n),n,r):n}function r(e,r,o){var a=e.slice();return r.forEach((function(r,s){void 0===a[s]?a[s]=n(r,o):t(r)?a[s]=i(e[s],r,o):-1===e.indexOf(r)&&a.push(n(r,o))})),a}function o(e,r,o){var a={};return t(e)&&Object.keys(e).forEach((function(t){a[t]=n(e[t],o)})),Object.keys(r).forEach((function(s){t(r[s])&&e[s]?a[s]=i(e[s],r[s],o):a[s]=n(r[s],o)})),a}function i(t,e,i){var a=Array.isArray(e),s=(i||{arrayMerge:r}).arrayMerge||r;return a?Array.isArray(t)?s(t,e,i):n(e,i):o(t,e,i)}return i.all=function(t,e){if(!Array.isArray(t)||t.length<2)throw new Error("first argument should be an array with at least two elements");return t.reduce((function(t,n){return i(t,n,e)}))},i}()})),o=e((function(t,e){e.default={svg:{name:"xmlns",uri:"http://www.w3.org/2000/svg"},xlink:{name:"xmlns:xlink",uri:"http://www.w3.org/1999/xlink"}},t.exports=e.default})),i=o.svg,s=o.xlink,c={};c[i.name]=i.uri,c[s.name]=s.uri;var l=function(t,e){void 0===t&&(t="");var n=function(t){return Object.keys(t).map((function(e){return e+'="'+t[e].toString().replace(/"/g,""")+'"'})).join(" ")}(r(c,e||{}));return""+t+""},u=function(t){function e(){t.apply(this,arguments)}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var n={isMounted:{}};return n.isMounted.get=function(){return!!this.node},e.createFromExistingNode=function(t){return new e({id:t.getAttribute("id"),viewBox:t.getAttribute("viewBox"),content:t.outerHTML})},e.prototype.destroy=function(){this.isMounted&&this.unmount(),t.prototype.destroy.call(this)},e.prototype.mount=function(t){if(this.isMounted)return this.node;var e="string"==typeof t?document.querySelector(t):t,n=this.render();return this.node=n,e.appendChild(n),n},e.prototype.render=function(){var t=this.stringify();return function(t){var e=!!document.importNode,n=(new DOMParser).parseFromString(t,"image/svg+xml").documentElement;return e?document.importNode(n,!0):n}(l(t)).childNodes[0]},e.prototype.unmount=function(){this.node.parentNode.removeChild(this.node)},Object.defineProperties(e.prototype,n),e}(t);return u},"object"===a(e)?t.exports=i():void 0===(o="function"==typeof(r=i)?r.call(e,n,e,t):r)||(t.exports=o)},function(t,e,n){var r,o,i;function a(t){return a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},a(t)}i=function(){"use strict";function t(t,e){return t(e={exports:{}},e.exports),e.exports}"undefined"!=typeof window?window:void 0!==n.g?n.g:"undefined"!=typeof self&&self;var e=t((function(t,e){t.exports=function(){function t(t){return t&&"object"===a(t)&&"[object RegExp]"!==Object.prototype.toString.call(t)&&"[object Date]"!==Object.prototype.toString.call(t)}function e(t){return Array.isArray(t)?[]:{}}function n(n,r){return r&&!0===r.clone&&t(n)?i(e(n),n,r):n}function r(e,r,o){var a=e.slice();return r.forEach((function(r,s){void 0===a[s]?a[s]=n(r,o):t(r)?a[s]=i(e[s],r,o):-1===e.indexOf(r)&&a.push(n(r,o))})),a}function o(e,r,o){var a={};return t(e)&&Object.keys(e).forEach((function(t){a[t]=n(e[t],o)})),Object.keys(r).forEach((function(s){t(r[s])&&e[s]?a[s]=i(e[s],r[s],o):a[s]=n(r[s],o)})),a}function i(t,e,i){var a=Array.isArray(e),s=(i||{arrayMerge:r}).arrayMerge||r;return a?Array.isArray(t)?s(t,e,i):n(e,i):o(t,e,i)}return i.all=function(t,e){if(!Array.isArray(t)||t.length<2)throw new Error("first argument should be an array with at least two elements");return t.reduce((function(t,n){return i(t,n,e)}))},i}()})),r=t((function(t,e){e.default={svg:{name:"xmlns",uri:"http://www.w3.org/2000/svg"},xlink:{name:"xmlns:xlink",uri:"http://www.w3.org/1999/xlink"}},t.exports=e.default})),o=r.svg,i=r.xlink,s={};s[o.name]=o.uri,s[i.name]=i.uri;var c,l=function(t,n){void 0===t&&(t="");var r=function(t){return Object.keys(t).map((function(e){return e+'="'+t[e].toString().replace(/"/g,""")+'"'})).join(" ")}(e(s,n||{}));return""+t+""},u=r.svg,f=r.xlink,p={attrs:(c={style:["position: absolute","width: 0","height: 0"].join("; "),"aria-hidden":"true"},c[u.name]=u.uri,c[f.name]=f.uri,c)},d=function(t){this.config=e(p,t||{}),this.symbols=[]};d.prototype.add=function(t){var e=this.symbols,n=this.find(t.id);return n?(e[e.indexOf(n)]=t,!1):(e.push(t),!0)},d.prototype.remove=function(t){var e=this.symbols,n=this.find(t);return!!n&&(e.splice(e.indexOf(n),1),n.destroy(),!0)},d.prototype.find=function(t){return this.symbols.filter((function(e){return e.id===t}))[0]||null},d.prototype.has=function(t){return null!==this.find(t)},d.prototype.stringify=function(){var t=this.config.attrs,e=this.symbols.map((function(t){return t.stringify()})).join("");return l(e,t)},d.prototype.toString=function(){return this.stringify()},d.prototype.destroy=function(){this.symbols.forEach((function(t){return t.destroy()}))};var h=function(t){var e=t.id,n=t.viewBox,r=t.content;this.id=e,this.viewBox=n,this.content=r};h.prototype.stringify=function(){return this.content},h.prototype.toString=function(){return this.stringify()},h.prototype.destroy=function(){var t=this;["id","viewBox","content"].forEach((function(e){return delete t[e]}))};var y=function(t){var e=!!document.importNode,n=(new DOMParser).parseFromString(t,"image/svg+xml").documentElement;return e?document.importNode(n,!0):n},m=function(t){function e(){t.apply(this,arguments)}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var n={isMounted:{}};return n.isMounted.get=function(){return!!this.node},e.createFromExistingNode=function(t){return new e({id:t.getAttribute("id"),viewBox:t.getAttribute("viewBox"),content:t.outerHTML})},e.prototype.destroy=function(){this.isMounted&&this.unmount(),t.prototype.destroy.call(this)},e.prototype.mount=function(t){if(this.isMounted)return this.node;var e="string"==typeof t?document.querySelector(t):t,n=this.render();return this.node=n,e.appendChild(n),n},e.prototype.render=function(){var t=this.stringify();return y(l(t)).childNodes[0]},e.prototype.unmount=function(){this.node.parentNode.removeChild(this.node)},Object.defineProperties(e.prototype,n),e}(h),v={autoConfigure:!0,mountTo:"body",syncUrlsWithBaseTag:!1,listenLocationChangeEvent:!0,locationChangeEvent:"locationChange",locationChangeAngularEmitter:!1,usagesToUpdate:"use[*|href]",moveGradientsOutsideSymbol:!1},g=function(t){return Array.prototype.slice.call(t,0)},b=function(){return/firefox/i.test(navigator.userAgent)},_=function(){return/msie/i.test(navigator.userAgent)||/trident/i.test(navigator.userAgent)},A=function(){return/edge/i.test(navigator.userAgent)},w=function(t){return(t||window.location.href).split("#")[0]},C=function(t){angular.module("ng").run(["$rootScope",function(e){e.$on("$locationChangeSuccess",(function(e,n,r){!function(t,e){var n=document.createEvent("CustomEvent");n.initCustomEvent(t,!1,!1,e),window.dispatchEvent(n)}(t,{oldUrl:r,newUrl:n})}))}])},S=function(t,e){return void 0===e&&(e="linearGradient, radialGradient, pattern, mask, clipPath"),g(t.querySelectorAll("symbol")).forEach((function(t){g(t.querySelectorAll(e)).forEach((function(e){t.parentNode.insertBefore(e,t)}))})),t},x=r.xlink.uri,k="xlink:href",E=/[{}|\\\^\[\]`"<>]/g;function O(t){return t.replace(E,(function(t){return"%"+t[0].charCodeAt(0).toString(16).toUpperCase()}))}var B,P=["clipPath","colorProfile","src","cursor","fill","filter","marker","markerStart","markerMid","markerEnd","mask","stroke","style"],j=P.map((function(t){return"["+t+"]"})).join(","),T=function(t,e,n,r){var o=O(n),i=O(r),a=function(t,e){return g(t).reduce((function(t,n){if(!n.attributes)return t;var r=g(n.attributes),o=e?r.filter(e):r;return t.concat(o)}),[])}(t.querySelectorAll(j),(function(t){var e=t.localName,n=t.value;return-1!==P.indexOf(e)&&-1!==n.indexOf("url("+o)}));a.forEach((function(t){return t.value=t.value.replace(new RegExp(o.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),"g"),i)})),function(t,e,n){g(t).forEach((function(t){var r=t.getAttribute(k);if(r&&0===r.indexOf(e)){var o=r.replace(e,n);t.setAttributeNS(x,k,o)}}))}(e,o,i)},N="mount",M="symbol_mount",L=function(t){function n(n){var r=this;void 0===n&&(n={}),t.call(this,e(v,n));var o,i=(o=o||Object.create(null),{on:function(t,e){(o[t]||(o[t]=[])).push(e)},off:function(t,e){o[t]&&o[t].splice(o[t].indexOf(e)>>>0,1)},emit:function(t,e){(o[t]||[]).map((function(t){t(e)})),(o["*"]||[]).map((function(n){n(t,e)}))}});this._emitter=i,this.node=null;var a=this.config;if(a.autoConfigure&&this._autoConfigure(n),a.syncUrlsWithBaseTag){var s=document.getElementsByTagName("base")[0].getAttribute("href");i.on(N,(function(){return r.updateUrls("#",s)}))}var c=this._handleLocationChange.bind(this);this._handleLocationChange=c,a.listenLocationChangeEvent&&window.addEventListener(a.locationChangeEvent,c),a.locationChangeAngularEmitter&&C(a.locationChangeEvent),i.on(N,(function(t){a.moveGradientsOutsideSymbol&&S(t)})),i.on(M,(function(t){var e;a.moveGradientsOutsideSymbol&&S(t.parentNode),(_()||A())&&(e=[],g(t.querySelectorAll("style")).forEach((function(t){t.textContent+="",e.push(t)})))}))}t&&(n.__proto__=t),n.prototype=Object.create(t&&t.prototype),n.prototype.constructor=n;var r={isMounted:{}};return r.isMounted.get=function(){return!!this.node},n.prototype._autoConfigure=function(t){var e=this.config;void 0===t.syncUrlsWithBaseTag&&(e.syncUrlsWithBaseTag=void 0!==document.getElementsByTagName("base")[0]),void 0===t.locationChangeAngularEmitter&&(e.locationChangeAngularEmitter=void 0!==window.angular),void 0===t.moveGradientsOutsideSymbol&&(e.moveGradientsOutsideSymbol=b())},n.prototype._handleLocationChange=function(t){var e=t.detail,n=e.oldUrl,r=e.newUrl;this.updateUrls(n,r)},n.prototype.add=function(e){var n=t.prototype.add.call(this,e);return this.isMounted&&n&&(e.mount(this.node),this._emitter.emit(M,e.node)),n},n.prototype.attach=function(t){var e=this,n=this;if(n.isMounted)return n.node;var r="string"==typeof t?document.querySelector(t):t;return n.node=r,this.symbols.forEach((function(t){t.mount(n.node),e._emitter.emit(M,t.node)})),g(r.querySelectorAll("symbol")).forEach((function(t){var e=m.createFromExistingNode(t);e.node=t,n.add(e)})),this._emitter.emit(N,r),r},n.prototype.destroy=function(){var t=this,e=t.config,n=t.symbols,r=t._emitter;n.forEach((function(t){return t.destroy()})),r.off("*"),window.removeEventListener(e.locationChangeEvent,this._handleLocationChange),this.isMounted&&this.unmount()},n.prototype.mount=function(t,e){void 0===t&&(t=this.config.mountTo),void 0===e&&(e=!1);var n=this;if(n.isMounted)return n.node;var r="string"==typeof t?document.querySelector(t):t,o=n.render();return this.node=o,e&&r.childNodes[0]?r.insertBefore(o,r.childNodes[0]):r.appendChild(o),this._emitter.emit(N,o),o},n.prototype.render=function(){return y(this.stringify())},n.prototype.unmount=function(){this.node.parentNode.removeChild(this.node)},n.prototype.updateUrls=function(t,e){if(!this.isMounted)return!1;var n=document.querySelectorAll(this.config.usagesToUpdate);return T(this.node,n,w(t)+"#",w(e)+"#"),!0},Object.defineProperties(n.prototype,r),n}(d),R=t((function(t){var e,n,r,o,i,a;t.exports=(n=[],r=document,o=r.documentElement.doScroll,i="DOMContentLoaded",(a=(o?/^loaded|^c/:/^loaded|^i|^c/).test(r.readyState))||r.addEventListener(i,e=function(){for(r.removeEventListener(i,e),a=1;e=n.shift();)e()}),function(t){a?setTimeout(t,0):n.push(t)})})),D="__SVG_SPRITE_NODE__",q="__SVG_SPRITE__";window[q]?B=window[q]:(B=new L({attrs:{id:D,"aria-hidden":"true"}}),window[q]=B);var I=function(){var t=document.getElementById(D);t?B.attach(t):B.mount(document.body,!0)};return document.body?I():R(I),B},"object"===a(e)?t.exports=i():void 0===(o="function"==typeof(r=i)?r.call(e,n,e,t):r)||(t.exports=o)},function(t,e,n){var r=n(105),o=r.all;t.exports=r.IS_HTMLDDA?function(t){return"function"==typeof t||t===o}:function(t){return"function"==typeof t}},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}var o=n(4),i=n(79).f,a=n(45),s=n(31),c=n(85),l=n(175),u=n(118);t.exports=function(t,e){var n,f,p,d,h,y=t.target,m=t.global,v=t.stat;if(n=m?o:v?o[y]||c(y,{}):(o[y]||{}).prototype)for(f in e){if(d=e[f],p=t.dontCallGetSet?(h=i(n,f))&&h.value:n[f],!u(m?f:y+(v?".":"#")+f,t.forced)&&void 0!==p){if(r(d)==r(p))continue;l(d,p)}(t.sham||p&&p.sham)&&a(d,"sham",!0),s(n,f,d,t)}}},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}var o=function(t){return t&&t.Math==Math&&t};t.exports=o("object"==("undefined"==typeof globalThis?"undefined":r(globalThis))&&globalThis)||o("object"==("undefined"==typeof window?"undefined":r(window))&&window)||o("object"==("undefined"==typeof self?"undefined":r(self))&&self)||o("object"==(void 0===n.g?"undefined":r(n.g))&&n.g)||function(){return this}()||Function("return this")()},function(t,e,n){var r=n(4),o=n(110),i=n(22),a=n(111),s=n(108),c=n(107),l=o("wks"),u=r.Symbol,f=u&&u.for,p=c?u:u&&u.withoutSetter||a;t.exports=function(t){if(!i(l,t)||!s&&"string"!=typeof l[t]){var e="Symbol."+t;s&&i(u,t)?l[t]=u[t]:l[t]=c&&f?f(e):p(e)}return l[t]}},function(t,e,n){var r=n(63),o=Function.prototype,i=o.call,a=r&&o.bind.bind(i,i);t.exports=r?a:function(t){return function(){return i.apply(t,arguments)}}},function(t){t.exports=function(t){try{return!!t()}catch(e){return!0}}},function(t){"use strict";var e=[];function n(t){for(var n=-1,r=0;r0?" ".concat(o.layer):""," {")),i+=o.css,a&&(i+="}"),o.media&&(i+="}"),o.supports&&(i+="}")}if(t.styleSheet)t.styleSheet.cssText=n(e,i);else{var s=document.createTextNode(i),c=t.childNodes;c[e]&&t.removeChild(c[e]),c.length?t.insertBefore(s,c[e]):t.appendChild(s)}}var o={singleton:null,singletonCounter:0};t.exports=function(t){var e=o.singletonCounter++,n=o.singleton||(o.singleton=t.insertStyleElement(t));return{update:function(t){r(n,e,!1,t)},remove:function(t){r(n,e,!0,t)}}}},function(t){"use strict";var e={};t.exports=function(t,n){var r=function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(r){n=null}e[t]=n}return e[t]}(t);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");r.appendChild(n)}},function(t,e,n){"use strict";t.exports=function(t){var e=n.nc;e&&t.setAttribute("nonce",e)}},function(t){"use strict";t.exports=function(t){var e=document.createElement("style");return t.setAttributes(e,t.attributes),t.insert(e,t.options),e}},function(t){"use strict";t.exports=function(t){var e=t[1],n=t[3];if(!n)return e;if("function"==typeof btoa){var r=btoa(unescape(encodeURIComponent(JSON.stringify(n)))),o="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(r),i="/*# ".concat(o," */");return[e].concat([i]).join("\n")}return[e].join("\n")}},function(t){"use strict";t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",r=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),r&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),r&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,r,o,i){"string"==typeof t&&(t=[[null,t,void 0]]);var a={};if(r)for(var s=0;s0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=i),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),e.push(u))}},e}},function(t,e,n){"use strict";n.d(e,{HY:function(){return v},Tm:function(){return I},Vf:function(){return m},YM:function(){return o},ZB:function(){return q},az:function(){return h},bR:function(){return x},h:function(){return h},kr:function(){return U},sY:function(){return D},wA:function(){return g}});var r,o,i,a,s,c,l={},u=[],f=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;function p(t,e){for(var n in e)t[n]=e[n];return t}function d(t){var e=t.parentNode;e&&e.removeChild(t)}function h(t,e,n){var o,i,a,s={};for(a in e)"key"==a?o=e[a]:"ref"==a?i=e[a]:s[a]=e[a];if(arguments.length>2&&(s.children=arguments.length>3?r.call(arguments,2):n),"function"==typeof t&&null!=t.defaultProps)for(a in t.defaultProps)void 0===s[a]&&(s[a]=t.defaultProps[a]);return y(t,s,o,i,null)}function y(t,e,n,r,a){var s={type:t,props:e,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:null==a?++i:a};return null==a&&null!=o.vnode&&o.vnode(s),s}function m(){return{current:null}}function v(t){return t.children}function g(t,e){this.props=t,this.context=e}function b(t,e){if(null==e)return t.__?b(t.__,t.__.__k.indexOf(t)+1):null;for(var n;e0?y(m.type,m.props,m.key,m.ref?m.ref:null,m.__v):m)){if(m.__=n,m.__b=n.__b+1,null===(h=w[p])||h&&m.key==h.key&&m.type===h.type)w[p]=void 0;else for(d=0;d2&&(s.children=arguments.length>3?r.call(arguments,2):n),y(t.type,s,o||t.key,i||t.ref,null)}function U(t,e){var n={__c:e="__cC"+c++,__:t,Consumer:function(t,e){return t.children(e)},Provider:function(t){var n,r;return this.getChildContext||(n=[],(r={})[e]=this,this.getChildContext=function(){return r},this.shouldComponentUpdate=function(t){this.props.value!==t.value&&n.some(A)},this.sub=function(t){n.push(t);var e=t.componentWillUnmount;t.componentWillUnmount=function(){n.splice(n.indexOf(t),1),e&&e.call(t)}}),t.children}};return n.Provider.__=n.Consumer.contextType=n}r=u.slice,o={__e:function(t,e,n,r){for(var o,i,a;e=e.__;)if((o=e.__c)&&!o.__)try{if((i=o.constructor)&&null!=i.getDerivedStateFromError&&(o.setState(i.getDerivedStateFromError(t)),a=o.__d),null!=o.componentDidCatch&&(o.componentDidCatch(t,r||{}),a=o.__d),a)return o.__E=o}catch(e){t=e}throw t}},i=0,g.prototype.setState=function(t,e){var n;n=null!=this.__s&&this.__s!==this.state?this.__s:this.__s=p({},this.state),"function"==typeof t&&(t=t(p({},n),this.props)),t&&p(n,t),null!=t&&this.__v&&(e&&this._sb.push(e),A(this))},g.prototype.forceUpdate=function(t){this.__v&&(this.__e=!0,t&&this.__h.push(t),A(this))},g.prototype.render=v,a=[],w.__r=0,c=0},function(t,e,n){var r=n(63),o=Function.prototype.call;t.exports=r?o.bind(o):function(){return o.apply(o,arguments)}},function(t,e,n){"use strict";function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}function o(t){var e=function(t,e){if("object"!==r(t)||null===t)return t;var n=t[Symbol.toPrimitive];if(void 0!==n){var o=n.call(t,e||"default");if("object"!==r(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"===r(e)?e:String(e)}function i(t,e,n){return(e=o(e))in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function a(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function s(t){for(var e=1;e0&&void 0!==arguments[0]?arguments[0]:{},e=arguments.length>1?arguments[1]:void 0;switch(e.type){case g.fH:return A(A({},t),{},{layoutMode:e.layoutMode});case g.lW:return A(A({},t),{},{currentUrl:e.currentUrl});case g.IX:return A(A({},t),{},{currentPattern:e.currentPattern});case g.HO:return A(A({},t),{},{viewportPx:e.viewportPx});case g.Yf:return A(A({},t),{},{viewportEm:e.viewportEm});case g.pu:return A(A({},t),{},{themeMode:e.themeMode});case g.c5:return A(A({},t),{},{drawerOpened:e.opened});case g.cf:return A(A({},t),{},{drawerHeight:e.height});case g.y$:return A(A({},t),{},{drawerIsAnimating:e.drawerIsAnimating});case g.aR:return A(A({},t),{},{isViewallPage:e.isViewall});default:return t}},S=window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__||h,x=function t(e,n,r){var o;if("function"==typeof n&&"function"==typeof r||"function"==typeof r&&"function"==typeof arguments[3])throw new Error(l(0));if("function"==typeof n&&void 0===r&&(r=n,n=void 0),void 0!==r){if("function"!=typeof r)throw new Error(l(1));return r(t)(e,n)}if("function"!=typeof e)throw new Error(l(2));var i=e,a=n,s=[],f=s,h=!1;function y(){f===s&&(f=s.slice())}function m(){if(h)throw new Error(l(3));return a}function v(t){if("function"!=typeof t)throw new Error(l(4));if(h)throw new Error(l(5));var e=!0;return y(),f.push(t),function(){if(e){if(h)throw new Error(l(6));e=!1,y();var n=f.indexOf(t);f.splice(n,1),s=null}}}function g(t){if(!d(t))throw new Error(l(7));if(void 0===t.type)throw new Error(l(8));if(h)throw new Error(l(9));try{h=!0,a=i(a,t)}finally{h=!1}for(var e=s=f,n=0;n1?e-1:0),r=1;r":".","?":"/","|":"\\"},f={option:"alt",command:"meta",return:"enter",escape:"esc",plus:"+",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},p=1;p<20;++p)c[111+p]="f"+p;for(p=0;p<=9;++p)c[p+96]=p.toString();b.prototype.bind=function(t,e,n){var r=this;return t=t instanceof Array?t:[t],r._bindMultiple.call(r,t,e,n),r},b.prototype.unbind=function(t,e){return this.bind.call(this,t,(function(){}),e)},b.prototype.trigger=function(t,e){var n=this;return n._directMap[t+":"+e]&&n._directMap[t+":"+e]({},t),n},b.prototype.reset=function(){var t=this;return t._callbacks={},t._directMap={},t},b.prototype.stopCallback=function(t,e){if((" "+e.className+" ").indexOf(" mousetrap ")>-1)return!1;if(g(e,this.target))return!1;if("composedPath"in t&&"function"==typeof t.composedPath){var n=t.composedPath()[0];n!==t.target&&(e=n)}return"INPUT"==e.tagName||"SELECT"==e.tagName||"TEXTAREA"==e.tagName||e.isContentEditable},b.prototype.handleKey=function(){var t=this;return t._handleKey.apply(t,arguments)},b.addKeycodes=function(t){for(var e in t)t.hasOwnProperty(e)&&(c[e]=t[e]);s=null},b.init=function(){var t=b(i);for(var e in t)"_"!==e.charAt(0)&&(b[e]=function(e){return function(){return t[e].apply(t,arguments)}}(e))},b.init(),o.Mousetrap=b,t.exports&&(t.exports=b),void 0===(r=function(){return b}.call(e,n,e,t))||(t.exports=r)}function d(t,e,n){t.addEventListener?t.addEventListener(e,n,!1):t.attachEvent("on"+e,n)}function h(t){if("keypress"==t.type){var e=String.fromCharCode(t.which);return t.shiftKey||(e=e.toLowerCase()),e}return c[t.which]?c[t.which]:l[t.which]?l[t.which]:String.fromCharCode(t.which).toLowerCase()}function y(t){return"shift"==t||"ctrl"==t||"alt"==t||"meta"==t}function m(t,e,n){return n||(n=function(){if(!s)for(var t in s={},c)t>95&&t<112||c.hasOwnProperty(t)&&(s[c[t]]=t);return s}()[t]?"keydown":"keypress"),"keypress"==n&&e.length&&(n="keydown"),n}function v(t,e){var n,r,o,i=[];for(n=function(t){return"+"===t?["+"]:(t=t.replace(/\+{2}/g,"+plus")).split("+")}(t),o=0;o1?p(t,s,n,r):(a=v(t,r),e._callbacks[a.key]=e._callbacks[a.key]||[],l(a.key,a.modifiers,{type:a.action},o,t,i),e._callbacks[a.key][o?"unshift":"push"]({callback:n,modifiers:a.modifiers,action:a.action,seq:o,level:i,combo:t}))}e._handleKey=function(t,e,n){var r,o=l(t,e,n),i={},f=0,p=!1;for(r=0;r=0;--i){var a=this.tryEntries[i],s=a.completion;if("root"===a.tryLoc)return r("end");if(a.tryLoc<=this.prev){var c=o.call(a,"catchLoc"),l=o.call(a,"finallyLoc");if(c&&l){if(this.prev=0;--n){var r=this.tryEntries[n];if(r.tryLoc<=this.prev&&o.call(r,"finallyLoc")&&this.prev=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),B(n),m}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var r=n.completion;if("throw"===r.type){var o=r.arg;B(n)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,n,r){return this.delegate={iterator:j(t),resultName:n,nextLoc:r},"next"===this.method&&(this.arg=e),m}},t}("object"===r(t=n.nmd(t))?t.exports:{});try{regeneratorRuntime=o}catch(i){"object"===("undefined"==typeof globalThis?"undefined":r(globalThis))?globalThis.regeneratorRuntime=o:Function("r","regeneratorRuntime = r")(o)}},function(t,e,n){var r=n(6),o=r({}.toString),i=r("".slice);t.exports=function(t){return i(o(t),8,-1)}},function(t,e,n){var r=n(64),o=TypeError;t.exports=function(t){if(r(t))throw o("Can't call method on "+t);return t}},function(t,e,n){var r=n(126),o=n(30),i=n(63),a=r(r.bind);t.exports=function(t,e){return o(t),void 0===e?t:i?a(t,e):function(){return t.apply(e,arguments)}}},function(t){var e={}.hasOwnProperty;t.exports=function(t,n){return e.call(t,n)}},function(t,e,n){t.exports=!n(75)((function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a}))},function(t,e,n){"use strict";n.d(e,{JG:function(){return E},K1:function(){return j},QG:function(){return S},_l:function(){return x},m:function(){return O},nt:function(){return k},pt:function(){return w},sL:function(){return B}});var r=n(324),o=n(58),i=n(325),a=n(215),s=n(326),c=n(40);function l(){return l="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(t,e,n){var r=u(t,e);if(r){var o=Object.getOwnPropertyDescriptor(r,e);return o.get?o.get.call(arguments.length<3?t:n):o.value}},l.apply(this,arguments)}function u(t,e){for(;!Object.prototype.hasOwnProperty.call(t,e)&&null!==(t=y(t)););return t}function f(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&p(t,e)}function p(t,e){return p=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},p(t,e)}function d(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var n,r=y(t);if(e){var o=y(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return h(this,n)}}function h(t,e){if(e&&("object"===A(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}function y(t){return y=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},y(t)}function m(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(!t)return;if("string"==typeof t)return v(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return v(t,e)}(t))||e&&t&&"number"==typeof t.length){n&&(t=n);var r=0,o=function(){};return{s:o,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,a=!0,s=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return a=t.done,t},e:function(t){s=!0,i=t},f:function(){try{a||null==n.return||n.return()}finally{if(s)throw i}}}}function v(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n0&&void 0!==arguments[0]?arguments[0]:this.startNode;(0,o.r4)(this.startNode.parentNode,t.nextSibling,this.endNode)}}]),t}(),E=function(){function t(e,n,r){if(g(this,t),this.value=void 0,this.__pendingValue=void 0,2!==r.length||""!==r[0]||""!==r[1])throw new Error("Boolean attributes can only contain a single expression");this.element=e,this.name=n,this.strings=r}return _(t,[{key:"setValue",value:function(t){this.__pendingValue=t}},{key:"commit",value:function(){for(;(0,r.w)(this.__pendingValue);){var t=this.__pendingValue;this.__pendingValue=i.J,t(this)}if(this.__pendingValue!==i.J){var e=!!this.__pendingValue;this.value!==e&&(e?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name),this.value=e),this.__pendingValue=i.J}}}]),t}(),O=function(t){f(n,t);var e=d(n);function n(t,r,o){var i;return g(this,n),(i=e.call(this,t,r,o)).single=2===o.length&&""===o[0]&&""===o[1],i}return _(n,[{key:"_createPart",value:function(){return new B(this)}},{key:"_getValue",value:function(){return this.single?this.parts[0].value:l(y(n.prototype),"_getValue",this).call(this)}},{key:"commit",value:function(){this.dirty&&(this.dirty=!1,this.element[this.name]=this._getValue())}}]),n}(S),B=function(t){f(n,t);var e=d(n);function n(){return g(this,n),e.apply(this,arguments)}return _(n)}(x),P=!1;!function(){try{var t={get capture(){return P=!0,!1}};window.addEventListener("test",t,t),window.removeEventListener("test",t,t)}catch(e){}}();var j=function(){function t(e,n,r){var o=this;g(this,t),this.value=void 0,this.__pendingValue=void 0,this.element=e,this.eventName=n,this.eventContext=r,this.__boundHandleEvent=function(t){return o.handleEvent(t)}}return _(t,[{key:"setValue",value:function(t){this.__pendingValue=t}},{key:"commit",value:function(){for(;(0,r.w)(this.__pendingValue);){var t=this.__pendingValue;this.__pendingValue=i.J,t(this)}if(this.__pendingValue!==i.J){var e=this.__pendingValue,n=this.value,o=null==e||null!=n&&(e.capture!==n.capture||e.once!==n.once||e.passive!==n.passive),a=null!=e&&(null==n||o);o&&this.element.removeEventListener(this.eventName,this.__boundHandleEvent,this.__options),a&&(this.__options=T(e),this.element.addEventListener(this.eventName,this.__boundHandleEvent,this.__options)),this.value=e,this.__pendingValue=i.J}}},{key:"handleEvent",value:function(t){"function"==typeof this.value?this.value.call(this.eventContext||this.element,t):this.value.handleEvent(t)}}]),t}(),T=function(t){return t&&(P?{capture:t.capture,passive:t.passive,once:t.once}:t.capture)}},function(t,e,n){"use strict";function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}function o(t,e){for(var n=0;n0;){var w=y[p],C=h.exec(w)[2],S=C.toLowerCase()+l,x=v.getAttribute(S);v.removeAttribute(S);var k=x.split(c);this.parts.push({type:"attribute",index:u,name:C,strings:k}),p+=k.length-1}}"TEMPLATE"===v.tagName&&(o.push(v),i.currentNode=v.content)}else if(3===v.nodeType){var E=v.data;if(E.indexOf(a)>=0){for(var O=v.parentNode,B=E.split(c),P=B.length-1,j=0;j=0&&t.slice(n)===e},p=function(t){return-1!==t.index},d=function(){return document.createComment("")},h=/([ \x09\x0a\x0c\x0d])([^\0-\x1F\x7F-\x9F "'>=/]+)([ \x09\x0a\x0c\x0d]*=[ \x09\x0a\x0c\x0d]*(?:[^ \x09\x0a\x0c\x0d"'`<>=]*|"[^"]*|'[^']*))$/},function(t,e,n){"use strict";n.r(e),n.d(e,{Children:function(){return Y},Component:function(){return s.wA},Fragment:function(){return s.HY},PureComponent:function(){return U},StrictMode:function(){return Ot},Suspense:function(){return Q},SuspenseList:function(){return tt},__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:function(){return bt},cloneElement:function(){return Ct},createContext:function(){return s.kr},createElement:function(){return s.az},createFactory:function(){return At},createPortal:function(){return ot},createRef:function(){return s.Vf},default:function(){return Mt},findDOMNode:function(){return xt},flushSync:function(){return Et},forwardRef:function(){return V},hydrate:function(){return ut},isValidElement:function(){return wt},lazy:function(){return $},memo:function(){return z},render:function(){return lt},startTransition:function(){return Bt},unmountComponentAtNode:function(){return St},unstable_batchedUpdates:function(){return kt},useCallback:function(){return S},useContext:function(){return x},useDebugValue:function(){return k},useDeferredValue:function(){return Pt},useEffect:function(){return b},useErrorBoundary:function(){return E},useId:function(){return O},useImperativeHandle:function(){return w},useInsertionEffect:function(){return Tt},useLayoutEffect:function(){return _},useMemo:function(){return C},useReducer:function(){return g},useRef:function(){return A},useState:function(){return v},useSyncExternalStore:function(){return Nt},useTransition:function(){return jt},version:function(){return _t}});var r,o,i,a,s=n(15),c=0,l=[],u=[],f=s.YM.__b,p=s.YM.__r,d=s.YM.diffed,h=s.YM.__c,y=s.YM.unmount;function m(t,e){s.YM.__h&&s.YM.__h(o,t,c||e),c=0;var n=o.__H||(o.__H={__:[],__h:[]});return t>=n.__.length&&n.__.push({__V:u}),n.__[t]}function v(t){return c=1,g(L,t)}function g(t,e,n){var i=m(r++,2);if(i.t=t,!i.__c&&(i.__=[n?n(e):L(void 0,e),function(t){var e=i.__N?i.__N[0]:i.__[0],n=i.t(e,t);e!==n&&(i.__N=[n,i.__[1]],i.__c.setState({}))}],i.__c=o,!o.u)){o.u=!0;var a=o.shouldComponentUpdate;o.shouldComponentUpdate=function(t,e,n){if(!i.__c.__H)return!0;var r=i.__c.__H.__.filter((function(t){return t.__c}));if(r.every((function(t){return!t.__N})))return!a||a.call(this,t,e,n);var o=!1;return r.forEach((function(t){if(t.__N){var e=t.__[0];t.__=t.__N,t.__N=void 0,e!==t.__[0]&&(o=!0)}})),!(!o&&i.__c.props===t)&&(!a||a.call(this,t,e,n))}}return i.__N||i.__}function b(t,e){var n=m(r++,3);!s.YM.__s&&M(n.__H,e)&&(n.__=t,n.i=e,o.__H.__h.push(n))}function _(t,e){var n=m(r++,4);!s.YM.__s&&M(n.__H,e)&&(n.__=t,n.i=e,o.__h.push(n))}function A(t){return c=5,C((function(){return{current:t}}),[])}function w(t,e,n){c=6,_((function(){return"function"==typeof t?(t(e()),function(){return t(null)}):t?(t.current=e(),function(){return t.current=null}):void 0}),null==n?n:n.concat(t))}function C(t,e){var n=m(r++,7);return M(n.__H,e)?(n.__V=t(),n.i=e,n.__h=t,n.__V):n.__}function S(t,e){return c=8,C((function(){return t}),e)}function x(t){var e=o.context[t.__c],n=m(r++,9);return n.c=t,e?(null==n.__&&(n.__=!0,e.sub(o)),e.props.value):t.__}function k(t,e){s.YM.useDebugValue&&s.YM.useDebugValue(e?e(t):t)}function E(t){var e=m(r++,10),n=v();return e.__=t,o.componentDidCatch||(o.componentDidCatch=function(t,r){e.__&&e.__(t,r),n[1](t)}),[n[0],function(){n[1](void 0)}]}function O(){var t=m(r++,11);if(!t.__){for(var e=o.__v;null!==e&&!e.__m&&null!==e.__;)e=e.__;var n=e.__m||(e.__m=[0,0]);t.__="P"+n[0]+"-"+n[1]++}return t.__}function B(){for(var t;t=l.shift();)if(t.__P&&t.__H)try{t.__H.__h.forEach(T),t.__H.__h.forEach(N),t.__H.__h=[]}catch(o){t.__H.__h=[],s.YM.__e(o,t.__v)}}s.YM.__b=function(t){o=null,f&&f(t)},s.YM.__r=function(t){p&&p(t),r=0;var e=(o=t.__c).__H;e&&(i===o?(e.__h=[],o.__h=[],e.__.forEach((function(t){t.__N&&(t.__=t.__N),t.__V=u,t.__N=t.i=void 0}))):(e.__h.forEach(T),e.__h.forEach(N),e.__h=[])),i=o},s.YM.diffed=function(t){d&&d(t);var e=t.__c;e&&e.__H&&(e.__H.__h.length&&(1!==l.push(e)&&a===s.YM.requestAnimationFrame||((a=s.YM.requestAnimationFrame)||j)(B)),e.__H.__.forEach((function(t){t.i&&(t.__H=t.i),t.__V!==u&&(t.__=t.__V),t.i=void 0,t.__V=u}))),i=o=null},s.YM.__c=function(t,e){e.some((function(t){try{t.__h.forEach(T),t.__h=t.__h.filter((function(t){return!t.__||N(t)}))}catch(i){e.some((function(t){t.__h&&(t.__h=[])})),e=[],s.YM.__e(i,t.__v)}})),h&&h(t,e)},s.YM.unmount=function(t){y&&y(t);var e,n=t.__c;n&&n.__H&&(n.__H.__.forEach((function(t){try{T(t)}catch(t){e=t}})),n.__H=void 0,e&&s.YM.__e(e,n.__v))};var P="function"==typeof requestAnimationFrame;function j(t){var e,n=function(){clearTimeout(r),P&&cancelAnimationFrame(e),setTimeout(t)},r=setTimeout(n,100);P&&(e=requestAnimationFrame(n))}function T(t){var e=o,n=t.__c;"function"==typeof n&&(t.__c=void 0,n()),o=e}function N(t){var e=o;t.__c=t.__(),o=e}function M(t,e){return!t||t.length!==e.length||e.some((function(e,n){return e!==t[n]}))}function L(t,e){return"function"==typeof e?e(t):e}function R(t){return R="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},R(t)}function D(t,e){for(var n in e)t[n]=e[n];return t}function q(t,e){for(var n in t)if("__source"!==n&&!(n in e))return!0;for(var r in e)if("__source"!==r&&t[r]!==e[r])return!0;return!1}function I(t,e){return t===e&&(0!==t||1/t==1/e)||t!=t&&e!=e}function U(t){this.props=t}function z(t,e){function n(t){var n=this.props.ref,r=n==t.ref;return!r&&n&&(n.call?n(null):n.current=null),e?!e(this.props,t)||!r:q(this.props,t)}function r(e){return this.shouldComponentUpdate=n,(0,s.az)(t,e)}return r.displayName="Memo("+(t.displayName||t.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r}(U.prototype=new s.wA).isPureReactComponent=!0,U.prototype.shouldComponentUpdate=function(t,e){return q(this.props,t)||q(this.state,e)};var H=s.YM.__b;s.YM.__b=function(t){t.type&&t.type.__f&&t.ref&&(t.props.ref=t.ref,t.ref=null),H&&H(t)};var F="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.forward_ref")||3911;function V(t){function e(e){var n=D({},e);return delete n.ref,t(n,e.ref||null)}return e.$$typeof=F,e.render=e,e.prototype.isReactComponent=e.__f=!0,e.displayName="ForwardRef("+(t.displayName||t.name)+")",e}var W=function(t,e){return null==t?null:(0,s.bR)((0,s.bR)(t).map(e))},Y={map:W,forEach:W,count:function(t){return t?(0,s.bR)(t).length:0},only:function(t){var e=(0,s.bR)(t);if(1!==e.length)throw"Children.only";return e[0]},toArray:s.bR},Z=s.YM.__e;s.YM.__e=function(t,e,n,r){if(t.then)for(var o,i=e;i=i.__;)if((o=i.__c)&&o.__c)return null==e.__e&&(e.__e=n.__e,e.__k=n.__k),o.__c(t,e);Z(t,e,n,r)};var G=s.YM.unmount;function K(t,e,n){return t&&(t.__c&&t.__c.__H&&(t.__c.__H.__.forEach((function(t){"function"==typeof t.__c&&t.__c()})),t.__c.__H=null),null!=(t=D({},t)).__c&&(t.__c.__P===n&&(t.__c.__P=e),t.__c=null),t.__k=t.__k&&t.__k.map((function(t){return K(t,e,n)}))),t}function J(t,e,n){return t&&(t.__v=null,t.__k=t.__k&&t.__k.map((function(t){return J(t,e,n)})),t.__c&&t.__c.__P===e&&(t.__e&&n.insertBefore(t.__e,t.__d),t.__c.__e=!0,t.__c.__P=n)),t}function Q(){this.__u=0,this.t=null,this.__b=null}function X(t){var e=t.__.__c;return e&&e.__a&&e.__a(t)}function $(t){var e,n,r;function o(o){if(e||(e=t()).then((function(t){n=t.default||t}),(function(t){r=t})),r)throw r;if(!n)throw e;return(0,s.az)(n,o)}return o.displayName="Lazy",o.__f=!0,o}function tt(){this.u=null,this.o=null}s.YM.unmount=function(t){var e=t.__c;e&&e.__R&&e.__R(),e&&!0===t.__h&&(t.type=null),G&&G(t)},(Q.prototype=new s.wA).__c=function(t,e){var n=e.__c,r=this;null==r.t&&(r.t=[]),r.t.push(n);var o=X(r.__v),i=!1,a=function(){i||(i=!0,n.__R=null,o?o(s):s())};n.__R=a;var s=function(){if(!--r.__u){if(r.state.__a){var t=r.state.__a;r.__v.__k[0]=J(t,t.__c.__P,t.__c.__O)}var e;for(r.setState({__a:r.__b=null});e=r.t.pop();)e.forceUpdate()}},c=!0===e.__h;r.__u++||c||r.setState({__a:r.__b=r.__v.__k[0]}),t.then(a,a)},Q.prototype.componentWillUnmount=function(){this.t=[]},Q.prototype.render=function(t,e){if(this.__b){if(this.__v.__k){var n=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=K(this.__b,n,r.__O=r.__P)}this.__b=null}var o=e.__a&&(0,s.az)(s.HY,null,t.fallback);return o&&(o.__h=null),[(0,s.az)(s.HY,null,e.__a?null:t.children),o]};var et=function(t,e,n){if(++n[1]===n[0]&&t.o.delete(e),t.props.revealOrder&&("t"!==t.props.revealOrder[0]||!t.o.size))for(n=t.u;n;){for(;n.length>3;)n.pop()();if(n[1]>>1,1),e.i.removeChild(t)}}),(0,s.sY)((0,s.az)(nt,{context:e.context},t.__v),e.l)):e.l&&e.componentWillUnmount()}function ot(t,e){var n=(0,s.az)(rt,{__v:t,i:e});return n.containerInfo=e,n}(tt.prototype=new s.wA).__a=function(t){var e=this,n=X(e.__v),r=e.o.get(t);return r[0]++,function(o){var i=function(){e.props.revealOrder?(r.push(o),et(e,t,r)):o()};n?n(i):i()}},tt.prototype.render=function(t){this.u=null,this.o=new Map;var e=(0,s.bR)(t.children);t.revealOrder&&"b"===t.revealOrder[0]&&e.reverse();for(var n=e.length;n--;)this.o.set(e[n],this.u=[1,0,this.u]);return t.children},tt.prototype.componentDidUpdate=tt.prototype.componentDidMount=function(){var t=this;this.o.forEach((function(e,n){et(t,n,e)}))};var it="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,at=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,st="undefined"!=typeof document,ct=function(t){return("undefined"!=typeof Symbol&&"symbol"==R(Symbol())?/fil|che|rad/i:/fil|che|ra/i).test(t)};function lt(t,e,n){return null==e.__k&&(e.textContent=""),(0,s.sY)(t,e),"function"==typeof n&&n(),t?t.__c:null}function ut(t,e,n){return(0,s.ZB)(t,e),"function"==typeof n&&n(),t?t.__c:null}s.wA.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach((function(t){Object.defineProperty(s.wA.prototype,t,{configurable:!0,get:function(){return this["UNSAFE_"+t]},set:function(e){Object.defineProperty(this,t,{configurable:!0,writable:!0,value:e})}})}));var ft=s.YM.event;function pt(){}function dt(){return this.cancelBubble}function ht(){return this.defaultPrevented}s.YM.event=function(t){return ft&&(t=ft(t)),t.persist=pt,t.isPropagationStopped=dt,t.isDefaultPrevented=ht,t.nativeEvent=t};var yt,mt={configurable:!0,get:function(){return this.class}},vt=s.YM.vnode;s.YM.vnode=function(t){var e=t.type,n=t.props,r=n;if("string"==typeof e){var o=-1===e.indexOf("-");for(var i in r={},n){var a=n[i];st&&"children"===i&&"noscript"===e||"value"===i&&"defaultValue"in n&&null==a||("defaultValue"===i&&"value"in n&&null==n.value?i="value":"download"===i&&!0===a?a="":/ondoubleclick/i.test(i)?i="ondblclick":/^onchange(textarea|input)/i.test(i+e)&&!ct(n.type)?i="oninput":/^onfocus$/i.test(i)?i="onfocusin":/^onblur$/i.test(i)?i="onfocusout":/^on(Ani|Tra|Tou|BeforeInp|Compo)/.test(i)?i=i.toLowerCase():o&&at.test(i)?i=i.replace(/[A-Z0-9]/g,"-$&").toLowerCase():null===a&&(a=void 0),/^oninput$/i.test(i)&&(i=i.toLowerCase(),r[i]&&(i="oninputCapture")),r[i]=a)}"select"==e&&r.multiple&&Array.isArray(r.value)&&(r.value=(0,s.bR)(n.children).forEach((function(t){t.props.selected=-1!=r.value.indexOf(t.props.value)}))),"select"==e&&null!=r.defaultValue&&(r.value=(0,s.bR)(n.children).forEach((function(t){t.props.selected=r.multiple?-1!=r.defaultValue.indexOf(t.props.value):r.defaultValue==t.props.value}))),t.props=r,n.class!=n.className&&(mt.enumerable="className"in n,null!=n.className&&(r.class=n.className),Object.defineProperty(r,"className",mt))}t.$$typeof=it,vt&&vt(t)};var gt=s.YM.__r;s.YM.__r=function(t){gt&>(t),yt=t.__c};var bt={ReactCurrentDispatcher:{current:{readContext:function(t){return yt.__n[t.__c].props.value}}}},_t="17.0.2";function At(t){return s.az.bind(null,t)}function wt(t){return!!t&&t.$$typeof===it}function Ct(t){return wt(t)?s.Tm.apply(null,arguments):t}function St(t){return!!t.__k&&((0,s.sY)(null,t),!0)}function xt(t){return t&&(t.base||1===t.nodeType&&t)||null}var kt=function(t,e){return t(e)},Et=function(t,e){return t(e)},Ot=s.HY;function Bt(t){t()}function Pt(t){return t}function jt(){return[!1,Bt]}var Tt=_;function Nt(t,e){var n=e(),r=v({h:{__:n,v:e}}),o=r[0].h,i=r[1];return _((function(){o.__=n,o.v=e,I(o.__,e())||i({h:o})}),[t,n,e]),b((function(){return I(o.__,o.v())||i({h:o}),t((function(){I(o.__,o.v())||i({h:o})}))}),[t]),n}var Mt={useState:v,useId:O,useReducer:g,useEffect:b,useLayoutEffect:_,useInsertionEffect:Tt,useTransition:jt,useDeferredValue:Pt,useSyncExternalStore:Nt,startTransition:Bt,useRef:A,useImperativeHandle:w,useMemo:C,useCallback:S,useContext:x,useDebugValue:k,version:"17.0.2",Children:Y,render:lt,hydrate:ut,unmountComponentAtNode:St,createPortal:ot,createElement:s.az,createContext:s.kr,createFactory:At,cloneElement:Ct,createRef:s.Vf,Fragment:s.HY,isValidElement:wt,findDOMNode:xt,Component:s.wA,PureComponent:U,memo:z,forwardRef:V,flushSync:Et,unstable_batchedUpdates:kt,StrictMode:Ot,Suspense:Q,SuspenseList:tt,lazy:$,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:bt}},function(t){t.exports=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}}},function(t,e,n){var r=n(80),o=n(35);t.exports=function(t){return r(o(t))}},function(t,e,n){var r=n(35),o=Object;t.exports=function(t){return o(r(t))}},function(t,e,n){var r=n(19),o=n(28),i=n(42);t.exports=r?function(t,e,n){return o.f(t,e,i(1,n))}:function(t,e,n){return t[e]=n,t}},function(t,e,n){var r=n(117);t.exports=function(t){return r(t.length)}},function(t,e,n){var r=n(69),o=String;t.exports=function(t){if("Symbol"===r(t))throw TypeError("Cannot convert a Symbol value to a string");return o(t)}},function(t){t.exports={}},function(t,e,n){var r=n(4);t.exports=r.Promise},function(t,e,n){var r=n(4),o=n(49),i=n(2),a=n(118),s=n(87),c=n(5),l=n(199),u=n(139),f=n(25),p=n(109),d=o&&o.prototype,h=c("species"),y=!1,m=i(r.PromiseRejectionEvent),v=a("Promise",(function(){var t=s(o),e=t!==String(o);if(!e&&66===p)return!0;if(f&&(!d.catch||!d.finally))return!0;if(!p||p<51||!/native code/.test(t)){var n=new o((function(t){t(1)})),r=function(t){t((function(){}),(function(){}))};if((n.constructor={})[h]=r,!(y=n.then((function(){}))instanceof r))return!0}return!e&&(l||u)&&!m}));t.exports={CONSTRUCTOR:v,REJECTION_EVENT:m,SUBCLASSING:y}},function(t){var e=t.exports={version:"2.6.12"};"number"==typeof __e&&(__e=e)},function(t,e,n){var r=n(76),o=n(148),i=n(97),a=Object.defineProperty;e.f=n(38)?Object.defineProperty:function(t,e,n){if(r(t),e=i(e,!0),r(n),o)try{return a(t,e,n)}catch(s){}if("get"in n||"set"in n)throw TypeError("Accessors not supported!");return"value"in n&&(t[e]=n.value),t}},function(t){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},e(t)}t.exports=function(t){return"object"===e(t)?null!==t:"function"==typeof t}},function(t){var e=0,n=Math.random();t.exports=function(t){return"Symbol(".concat(void 0===t?"":t,")_",(++e+n).toString(36))}},function(t,e,n){var r=n(77)("wks"),o=n(54),i=n(29).Symbol,a="function"==typeof i;(t.exports=function(t){return r[t]||(r[t]=a&&i[t]||(a?i:o)("Symbol."+t))}).store=r},function(t,e,n){var r=n(236),o=n(151);t.exports=function(t){return r(o(t))}},function(t,e,n){var r;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}!function(){"use strict";var i={}.hasOwnProperty;function a(){for(var t=[],e=0;e2&&void 0!==arguments[2]?arguments[2]:null;e!==n;){var r=e.nextSibling;t.removeChild(e),e=r}}},function(t){t.exports={Text:"text",Directive:"directive",Comment:"comment",Script:"script",Style:"style",Tag:"tag",CDATA:"cdata",Doctype:"doctype",isTag:function(t){return"tag"===t.type||"script"===t.type||"style"===t.type}}},function(t,e,n){t.exports=n(262)()},function(t){"function"==typeof Object.create?t.exports=function(t,e){e&&(t.super_=e,t.prototype=Object.create(e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}))}:t.exports=function(t,e){if(e){t.super_=e;var n=function(){};n.prototype=e.prototype,t.prototype=new n,t.prototype.constructor=t}}},function(t,e,n){var r;function o(t){return o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},o(t)}!function(e){"use strict";function i(){}var a=i.prototype,s=e.EventEmitter;function c(t,e){for(var n=t.length;n--;)if(t[n].listener===e)return n;return-1}function l(t){return function(){return this[t].apply(this,arguments)}}function u(t){return"function"==typeof t||t instanceof RegExp||!(!t||"object"!==o(t))&&u(t.listener)}a.getListeners=function(t){var e,n,r=this._getEvents();if(t instanceof RegExp)for(n in e={},r)r.hasOwnProperty(n)&&t.test(n)&&(e[n]=r[n]);else e=r[t]||(r[t]=[]);return e},a.flattenListeners=function(t){var e,n=[];for(e=0;e"+t+""},m=function(t){t.write(y("")),t.close();var e=t.parentWindow.Object;return t=null,e},v=function(){try{r=new ActiveXObject("htmlfile")}catch(i){}var t,e,n;v="undefined"!=typeof document?document.domain&&r?m(r):(e=l("iframe"),n="java"+p+":",e.style.display="none",c.appendChild(e),e.src=String(n),(t=e.contentWindow.document).open(),t.write(y("document.F=Object")),t.close(),t.F):m(r);for(var o=a.length;o--;)delete v[f][a[o]];return v()};s[d]=!0,t.exports=Object.create||function(t,e){var n;return null!==t?(h[f]=o(t),n=new h,h[f]=null,n[d]=t):n=v(),void 0===e?n:i.f(n,e)}},function(t,e,n){var r=n(69),o=n(83),i=n(64),a=n(48),s=n(5)("iterator");t.exports=function(t){if(!i(t))return o(t,s)||o(t,"@@iterator")||a[r(t)]}},function(t,e,n){var r=n(34),o=n(4);t.exports="process"==r(o.process)},function(t,e,n){var r=n(28).f,o=n(22),i=n(5)("toStringTag");t.exports=function(t,e,n){t&&!n&&(t=t.prototype),t&&!o(t,i)&&r(t,i,{configurable:!0,value:e})}},function(t,e,n){"use strict";var r=n(30),o=TypeError,i=function(t){var e,n;this.promise=new t((function(t,r){if(void 0!==e||void 0!==n)throw o("Bad Promise constructor");e=t,n=r})),this.resolve=r(e),this.reject=r(n)};t.exports.f=function(t){return new i(t)}},function(t){t.exports=function(t){try{return!!t()}catch(e){return!0}}},function(t,e,n){var r=n(53);t.exports=function(t){if(!r(t))throw TypeError(t+" is not an object!");return t}},function(t,e,n){var r=n(51),o=n(29),i="__core-js_shared__",a=o[i]||(o[i]={});(t.exports=function(t,e){return a[t]||(a[t]=void 0!==e?e:{})})("versions",[]).push({version:r.version,mode:n(100)?"pure":"global",copyright:"© 2020 Denis Pushkarev (zloirock.ru)"})},,function(t,e,n){var r=n(19),o=n(16),i=n(170),a=n(42),s=n(43),c=n(81),l=n(22),u=n(112),f=Object.getOwnPropertyDescriptor;e.f=r?f:function(t,e){if(t=s(t),e=c(e),u)try{return f(t,e)}catch(n){}if(l(t,e))return a(!o(i.f,t,e),t[e])}},function(t,e,n){var r=n(6),o=n(7),i=n(34),a=Object,s=r("".split);t.exports=o((function(){return!a("z").propertyIsEnumerable(0)}))?function(t){return"String"==i(t)?s(t,""):a(t)}:a},function(t,e,n){var r=n(171),o=n(106);t.exports=function(t){var e=r(t,"string");return o(e)?e:e+""}},function(t,e,n){var r=n(6);t.exports=r({}.isPrototypeOf)},function(t,e,n){var r=n(30),o=n(64);t.exports=function(t,e){var n=t[e];return o(n)?void 0:r(n)}},function(t,e,n){var r=n(4),o=n(85),i="__core-js_shared__",a=r[i]||o(i,{});t.exports=a},function(t,e,n){var r=n(4),o=Object.defineProperty;t.exports=function(t,e){try{o(r,t,{value:e,configurable:!0,writable:!0})}catch(n){r[t]=e}return e}},function(t,e,n){var r=n(19),o=n(22),i=Function.prototype,a=r&&Object.getOwnPropertyDescriptor,s=o(i,"name"),c=s&&"something"===function(){}.name,l=s&&(!r||r&&a(i,"name").configurable);t.exports={EXISTS:s,PROPER:c,CONFIGURABLE:l}},function(t,e,n){var r=n(6),o=n(2),i=n(84),a=r(Function.toString);o(i.inspectSource)||(i.inspectSource=function(t){return a(t)}),t.exports=i.inspectSource},function(t,e,n){var r=n(110),o=n(111),i=r("keys");t.exports=function(t){return i[t]||(i[t]=o(t))}},function(t){t.exports={}},function(t,e,n){var r=n(177);t.exports=function(t){var e=+t;return e!=e||0===e?0:r(e)}},function(t){t.exports=["constructor","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","toLocaleString","toString","valueOf"]},function(t,e,n){var r=n(6),o=n(7),i=n(2),a=n(69),s=n(27),c=n(87),l=function(){},u=[],f=s("Reflect","construct"),p=/^\s*(?:class|function)\b/,d=r(p.exec),h=!p.exec(l),y=function(t){if(!i(t))return!1;try{return f(l,u,t),!0}catch(e){return!1}},m=function(t){if(!i(t))return!1;switch(a(t)){case"AsyncFunction":case"GeneratorFunction":case"AsyncGeneratorFunction":return!1}try{return h||!!d(p,c(t))}catch(e){return!0}};m.sham=!0,t.exports=!f||o((function(){var t;return y(y.call)||!y(Object)||!y((function(){t=!0}))||t}))?m:y},function(t,e,n){var r=n(5),o=n(70),i=n(28).f,a=r("unscopables"),s=Array.prototype;null==s[a]&&i(s,a,{configurable:!0,value:o(null)}),t.exports=function(t){s[a][t]=!0}},function(t,e,n){var r=n(16),o=n(30),i=n(20),a=n(66),s=n(71),c=TypeError;t.exports=function(t,e){var n=arguments.length<2?s(t):e;if(o(n))return i(r(n,t));throw c(a(t)+" is not iterable")}},function(t){t.exports=function(t){try{return{error:!1,value:t()}}catch(e){return{error:!0,value:e}}}},function(t,e,n){var r=n(52),o=n(98);t.exports=n(38)?function(t,e,n){return r.f(t,e,o(1,n))}:function(t,e,n){return t[e]=n,t}},function(t,e,n){var r=n(53);t.exports=function(t,e){if(!r(t))return t;var n,o;if(e&&"function"==typeof(n=t.toString)&&!r(o=n.call(t)))return o;if("function"==typeof(n=t.valueOf)&&!r(o=n.call(t)))return o;if(!e&&"function"==typeof(n=t.toString)&&!r(o=n.call(t)))return o;throw TypeError("Can't convert object to primitive value")}},function(t){t.exports=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}}},function(t,e,n){var r=n(29),o=n(96),i=n(37),a=n(54)("src"),s=n(228),c="toString",l=(""+s).split(c);n(51).inspectSource=function(t){return s.call(t)},(t.exports=function(t,e,n,s){var c="function"==typeof n;c&&(i(n,"name")||o(n,"name",e)),t[e]!==n&&(c&&(i(n,a)||o(n,a,t[e]?""+t[e]:l.join(String(e)))),t===r?t[e]=n:s?t[e]?t[e]=n:o(t,e,n):(delete t[e],o(t,e,n)))})(Function.prototype,c,(function(){return"function"==typeof this&&this[a]||s.call(this)}))},function(t){t.exports=!1},function(t,e,n){var r=n(150),o=n(103);t.exports=Object.keys||function(t){return r(t,o)}},function(t){var e={}.toString;t.exports=function(t){return e.call(t).slice(8,-1)}},function(t){t.exports="constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf".split(",")},function(){if(window.self!==window.top)for(var t=document.getElementsByTagName("a"),e=0;e0&&r[0]<4?1:+(r[0]+r[1])),!o&&a&&(!(r=a.match(/Edge\/(\d+)/))||r[1]>=74)&&(r=a.match(/Chrome\/(\d+)/))&&(o=+r[1]),t.exports=o},function(t,e,n){var r=n(25),o=n(84);(t.exports=function(t,e){return o[t]||(o[t]=void 0!==e?e:{})})("versions",[]).push({version:"3.27.1",mode:r?"pure":"global",copyright:"© 2014-2022 Denis Pushkarev (zloirock.ru)",license:"https://github.com/zloirock/core-js/blob/v3.27.1/LICENSE",source:"https://github.com/zloirock/core-js"})},function(t,e,n){var r=n(6),o=0,i=Math.random(),a=r(1..toString);t.exports=function(t){return"Symbol("+(void 0===t?"":t)+")_"+a(++o+i,36)}},function(t,e,n){var r=n(19),o=n(7),i=n(67);t.exports=!r&&!o((function(){return 7!=Object.defineProperty(i("div"),"a",{get:function(){return 7}}).a}))},function(t,e,n){var r=n(19),o=n(7);t.exports=r&&o((function(){return 42!=Object.defineProperty((function(){}),"prototype",{value:42,writable:!1}).prototype}))},function(t,e,n){var r=n(6),o=n(22),i=n(43),a=n(115).indexOf,s=n(89),c=r([].push);t.exports=function(t,e){var n,r=i(t),l=0,u=[];for(n in r)!o(s,n)&&o(r,n)&&c(u,n);for(;e.length>l;)o(r,n=e[l++])&&(~a(u,n)||c(u,n));return u}},function(t,e,n){var r=n(43),o=n(116),i=n(46),a=function(t){return function(e,n,a){var s,c=r(e),l=i(c),u=o(a,l);if(t&&n!=n){for(;l>u;)if((s=c[u++])!=s)return!0}else for(;l>u;u++)if((t||u in c)&&c[u]===n)return t||u||0;return!t&&-1}};t.exports={includes:a(!0),indexOf:a(!1)}},function(t,e,n){var r=n(90),o=Math.max,i=Math.min;t.exports=function(t,e){var n=r(t);return n<0?o(n+e,0):i(n,e)}},function(t,e,n){var r=n(90),o=Math.min;t.exports=function(t){return t>0?o(r(t),9007199254740991):0}},function(t,e,n){var r=n(7),o=n(2),i=/#|\.prototype\./,a=function(t,e){var n=c[s(t)];return n==u||n!=l&&(o(e)?r(e):!!e)},s=a.normalize=function(t){return String(t).replace(i,".").toLowerCase()},c=a.data={},l=a.NATIVE="N",u=a.POLYFILL="P";t.exports=a},function(t,e,n){var r=n(179),o=TypeError;t.exports=function(t){if(r(t))throw o("The method doesn't accept regular expressions");return t}},function(t,e,n){var r=n(5)("match");t.exports=function(t){var e=/./;try{"/./"[t](e)}catch(n){try{return e[r]=!1,"/./"[t](e)}catch(o){}}return!1}},function(t,e,n){"use strict";var r=n(122).end,o=n(124);t.exports=o("trimEnd")?function(){return r(this)}:"".trimEnd},function(t,e,n){var r=n(6),o=n(35),i=n(47),a=n(123),s=r("".replace),c="["+a+"]",l=RegExp("^"+c+c+"*"),u=RegExp(c+c+"*$"),f=function(t){return function(e){var n=i(o(e));return 1&t&&(n=s(n,l,"")),2&t&&(n=s(n,u,"")),n}};t.exports={start:f(1),end:f(2),trim:f(3)}},function(t){t.exports="\t\n\v\f\r                　\u2028\u2029\ufeff"},function(t,e,n){var r=n(86).PROPER,o=n(7),i=n(123);t.exports=function(t){return o((function(){return!!i[t]()||"​…᠎"!=="​…᠎"[t]()||r&&i[t].name!==t}))}},function(t,e,n){"use strict";var r=n(122).start,o=n(124);t.exports=o("trimStart")?function(){return r(this)}:"".trimStart},function(t,e,n){var r=n(34),o=n(6);t.exports=function(t){if("Function"===r(t))return o(t)}},function(t,e,n){var r=n(36),o=n(6),i=n(80),a=n(44),s=n(46),c=n(182),l=o([].push),u=function(t){var e=1==t,n=2==t,o=3==t,u=4==t,f=6==t,p=7==t,d=5==t||f;return function(h,y,m,v){for(var g,b,_=a(h),A=i(_),w=r(y,m),C=s(A),S=0,x=v||c,k=e?x(h,C):n||p?x(h,0):void 0;C>S;S++)if((d||S in A)&&(b=w(g=A[S],S,_),t))if(e)k[S]=b;else if(b)switch(t){case 3:return!0;case 5:return g;case 6:return S;case 2:l(k,g)}else switch(t){case 4:return!1;case 7:l(k,g)}return f?-1:o||u?u:k}};t.exports={forEach:u(0),map:u(1),filter:u(2),some:u(3),every:u(4),find:u(5),findIndex:u(6),filterReject:u(7)}},function(t,e,n){var r=n(114),o=n(91);t.exports=Object.keys||function(t){return r(t,o)}},function(t,e,n){var r=n(27);t.exports=r("document","documentElement")},function(t,e,n){var r=n(16),o=n(20),i=n(83);t.exports=function(t,e,n){var a,s;o(t);try{if(!(a=i(t,"return"))){if("throw"===e)throw n;return n}a=r(a,t)}catch(c){s=!0,a=c}if("throw"===e)throw n;if(s)throw a;return o(a),n}},function(t,e,n){var r=n(5),o=n(48),i=r("iterator"),a=Array.prototype;t.exports=function(t){return void 0!==t&&(o.Array===t||a[i]===t)}},function(t,e,n){"use strict";var r=n(81),o=n(28),i=n(42);t.exports=function(t,e,n){var a=r(e);a in t?o.f(t,a,i(0,n)):t[a]=n}},function(t,e,n){var r=n(5)("iterator"),o=!1;try{var i=0,a={next:function(){return{done:!!i++}},return:function(){o=!0}};a[r]=function(){return this},Array.from(a,(function(){throw 2}))}catch(s){}t.exports=function(t,e){if(!e&&!o)return!1;var n=!1;try{var i={};i[r]=function(){return{next:function(){return{done:n=!0}}}},t(i)}catch(s){}return n}},function(t,e,n){var r=n(6),o=n(20),i=n(188);t.exports=Object.setPrototypeOf||("__proto__"in{}?function(){var t,e=!1,n={};try{(t=r(Object.getOwnPropertyDescriptor(Object.prototype,"__proto__").set))(n,[]),e=n instanceof Array}catch(a){}return function(n,r){return o(n),i(r),e?t(n,r):n.__proto__=r,n}}():void 0)},function(t,e,n){var r=n(82),o=TypeError;t.exports=function(t,e){if(r(e,t))return t;throw o("Incorrect invocation")}},function(t,e,n){var r,o,i,a,s=n(4),c=n(192),l=n(36),u=n(2),f=n(22),p=n(7),d=n(129),h=n(193),y=n(67),m=n(137),v=n(138),g=n(72),b=s.setImmediate,_=s.clearImmediate,A=s.process,w=s.Dispatch,C=s.Function,S=s.MessageChannel,x=s.String,k=0,E={},O="onreadystatechange";try{r=s.location}catch(N){}var B=function(t){if(f(E,t)){var e=E[t];delete E[t],e()}},P=function(t){return function(){B(t)}},j=function(t){B(t.data)},T=function(t){s.postMessage(x(t),r.protocol+"//"+r.host)};b&&_||(b=function(t){m(arguments.length,1);var e=u(t)?t:C(t),n=h(arguments,1);return E[++k]=function(){c(e,void 0,n)},o(k),k},_=function(t){delete E[t]},g?o=function(t){A.nextTick(P(t))}:w&&w.now?o=function(t){w.now(P(t))}:S&&!v?(a=(i=new S).port2,i.port1.onmessage=j,o=l(a.postMessage,a)):s.addEventListener&&u(s.postMessage)&&!s.importScripts&&r&&"file:"!==r.protocol&&!p(T)?(o=T,s.addEventListener("message",j,!1)):o=O in y("script")?function(t){d.appendChild(y("script"))[O]=function(){d.removeChild(this),B(t)}}:function(t){setTimeout(P(t),0)}),t.exports={set:b,clear:_}},function(t){var e=TypeError;t.exports=function(t,n){if(tb;b++)if((A=j(t[b]))&&u(m,A))return A;return new y(!1)}v=f(t,g)}for(w=k?t.next:v.next;!(C=i(w,v)).done;){try{A=j(C.value)}catch(T){d(v,"throw",T)}if("object"==r(A)&&A&&u(m,A))return A}return new y(!1)}},function(t,e,n){var r=n(49),o=n(133),i=n(50).CONSTRUCTOR;t.exports=i||!o((function(t){r.all(t).then(void 0,(function(){}))}))},function(t){t.exports={CSSRuleList:0,CSSStyleDeclaration:0,CSSValueList:0,ClientRectList:0,DOMRectList:0,DOMStringList:0,DOMTokenList:1,DataTransferItemList:0,FileList:0,HTMLAllCollection:0,HTMLCollection:0,HTMLFormElement:0,HTMLSelectElement:0,MediaList:0,MimeTypeArray:0,NamedNodeMap:0,NodeList:1,PaintRequestList:0,Plugin:0,PluginArray:0,SVGLengthList:0,SVGNumberList:0,SVGPathSegList:0,SVGPointList:0,SVGStringList:0,SVGTransformList:0,SourceBufferList:0,StyleSheetList:0,TextTrackCueList:0,TextTrackList:0,TouchList:0}},function(t,e,n){var r=n(67)("span").classList,o=r&&r.constructor&&r.constructor.prototype;t.exports=o===Object.prototype?void 0:o},function(t,e,n){"use strict";var r=n(43),o=n(93),i=n(48),a=n(68),s=n(28).f,c=n(203),l=n(205),u=n(25),f=n(19),p="Array Iterator",d=a.set,h=a.getterFor(p);t.exports=c(Array,"Array",(function(t,e){d(this,{type:p,target:r(t),index:0,kind:e})}),(function(){var t=h(this),e=t.target,n=t.kind,r=t.index++;return!e||r>=e.length?(t.target=void 0,l(void 0,!0)):l("keys"==n?r:"values"==n?e[r]:[r,e[r]],!1)}),"values");var y=i.Arguments=i.Array;if(o("keys"),o("values"),o("entries"),!u&&f&&"values"!==y.name)try{s(y,"name",{value:"values"})}catch(m){}},function(t,e,n){"use strict";var r=n(146).IteratorPrototype,o=n(70),i=n(42),a=n(73),s=n(48),c=function(){return this};t.exports=function(t,e,n,l){var u=e+" Iterator";return t.prototype=o(r,{next:i(+!l,n)}),a(t,u,!1,!0),s[u]=c,t}},function(t,e,n){"use strict";var r,o,i,a=n(7),s=n(2),c=n(21),l=n(70),u=n(147),f=n(31),p=n(5),d=n(25),h=p("iterator"),y=!1;[].keys&&("next"in(i=[].keys())?(o=u(u(i)))!==Object.prototype&&(r=o):y=!0),!c(r)||a((function(){var t={};return r[h].call(t)!==t}))?r={}:d&&(r=l(r)),s(r[h])||f(r,h,(function(){return this})),t.exports={IteratorPrototype:r,BUGGY_SAFARI_ITERATORS:y}},function(t,e,n){var r=n(22),o=n(2),i=n(44),a=n(88),s=n(204),c=a("IE_PROTO"),l=Object,u=l.prototype;t.exports=s?l.getPrototypeOf:function(t){var e=i(t);if(r(e,c))return e[c];var n=e.constructor;return o(n)&&e instanceof n?n.prototype:e instanceof l?u:null}},function(t,e,n){t.exports=!n(38)&&!n(75)((function(){return 7!=Object.defineProperty(n(149)("div"),"a",{get:function(){return 7}}).a}))},function(t,e,n){var r=n(53),o=n(29).document,i=r(o)&&r(o.createElement);t.exports=function(t){return i?o.createElement(t):{}}},function(t,e,n){var r=n(37),o=n(56),i=n(237)(!1),a=n(153)("IE_PROTO");t.exports=function(t,e){var n,s=o(t),c=0,l=[];for(n in s)n!=a&&r(s,n)&&l.push(n);for(;e.length>c;)r(s,n=e[c++])&&(~i(l,n)||l.push(n));return l}},function(t){t.exports=function(t){if(null==t)throw TypeError("Can't call method on "+t);return t}},function(t){var e=Math.ceil,n=Math.floor;t.exports=function(t){return isNaN(t=+t)?0:(t>0?n:e)(t)}},function(t,e,n){var r=n(77)("keys"),o=n(54);t.exports=function(t){return r[t]||(r[t]=o(t))}},function(t,e){e.f={}.propertyIsEnumerable},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default=function(t,e){return t.filter((function(t){return!(0,r.default)(t)})).map((function(t,n){var r=void 0;return"function"!=typeof e||null!==(r=e(t,n))&&!r?(0,o.default)(t,n,e):r}))};var r=i(n(328)),o=i(n(212));function i(t){return t&&t.__esModule?t:{default:t}}},function(t,e,n){var r=n(157),o={input:!0,option:!0,optgroup:!0,select:!0,button:!0,datalist:!0,textarea:!0},i={tr:{tr:!0,th:!0,td:!0},th:{th:!0},td:{thead:!0,th:!0,td:!0},body:{head:!0,link:!0,script:!0},li:{li:!0},p:{p:!0},h1:{p:!0},h2:{p:!0},h3:{p:!0},h4:{p:!0},h5:{p:!0},h6:{p:!0},select:o,input:o,output:o,button:o,datalist:o,textarea:o,option:{option:!0},optgroup:{optgroup:!0}},a={__proto__:null,area:!0,base:!0,basefont:!0,br:!0,col:!0,command:!0,embed:!0,frame:!0,hr:!0,img:!0,input:!0,isindex:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0},s={__proto__:null,math:!0,svg:!0},c={__proto__:null,mi:!0,mo:!0,mn:!0,ms:!0,mtext:!0,"annotation-xml":!0,foreignObject:!0,desc:!0,title:!0},l=/\s|\//;function u(t,e){this._options=e||{},this._cbs=t||{},this._tagname="",this._attribname="",this._attribvalue="",this._attribs=null,this._stack=[],this._foreignContext=[],this.startIndex=0,this.endIndex=null,this._lowerCaseTagNames="lowerCaseTags"in this._options?!!this._options.lowerCaseTags:!this._options.xmlMode,this._lowerCaseAttributeNames="lowerCaseAttributeNames"in this._options?!!this._options.lowerCaseAttributeNames:!this._options.xmlMode,this._options.Tokenizer&&(r=this._options.Tokenizer),this._tokenizer=new r(this._options,this),this._cbs.onparserinit&&this._cbs.onparserinit(this)}n(61)(u,n(249).EventEmitter),u.prototype._updatePosition=function(t){null===this.endIndex?this._tokenizer._sectionStart<=t?this.startIndex=0:this.startIndex=this._tokenizer._sectionStart-t:this.startIndex=this.endIndex+1,this.endIndex=this._tokenizer.getAbsoluteIndex()},u.prototype.ontext=function(t){this._updatePosition(1),this.endIndex--,this._cbs.ontext&&this._cbs.ontext(t)},u.prototype.onopentagname=function(t){if(this._lowerCaseTagNames&&(t=t.toLowerCase()),this._tagname=t,!this._options.xmlMode&&t in i)for(var e;(e=this._stack[this._stack.length-1])in i[t];this.onclosetag(e));!this._options.xmlMode&&t in a||(this._stack.push(t),t in s?this._foreignContext.push(!0):t in c&&this._foreignContext.push(!1)),this._cbs.onopentagname&&this._cbs.onopentagname(t),this._cbs.onopentag&&(this._attribs={})},u.prototype.onopentagend=function(){this._updatePosition(1),this._attribs&&(this._cbs.onopentag&&this._cbs.onopentag(this._tagname,this._attribs),this._attribs=null),!this._options.xmlMode&&this._cbs.onclosetag&&this._tagname in a&&this._cbs.onclosetag(this._tagname),this._tagname=""},u.prototype.onclosetag=function(t){if(this._updatePosition(1),this._lowerCaseTagNames&&(t=t.toLowerCase()),(t in s||t in c)&&this._foreignContext.pop(),!this._stack.length||t in a&&!this._options.xmlMode)this._options.xmlMode||"br"!==t&&"p"!==t||(this.onopentagname(t),this._closeCurrentTag());else{var e=this._stack.lastIndexOf(t);if(-1!==e)if(this._cbs.onclosetag)for(e=this._stack.length-e;e--;)this._cbs.onclosetag(this._stack.pop());else this._stack.length=e;else"p"!==t||this._options.xmlMode||(this.onopentagname(t),this._closeCurrentTag())}},u.prototype.onselfclosingtag=function(){this._options.xmlMode||this._options.recognizeSelfClosing||this._foreignContext[this._foreignContext.length-1]?this._closeCurrentTag():this.onopentagend()},u.prototype._closeCurrentTag=function(){var t=this._tagname;this.onopentagend(),this._stack[this._stack.length-1]===t&&(this._cbs.onclosetag&&this._cbs.onclosetag(t),this._stack.pop())},u.prototype.onattribname=function(t){this._lowerCaseAttributeNames&&(t=t.toLowerCase()),this._attribname=t},u.prototype.onattribdata=function(t){this._attribvalue+=t},u.prototype.onattribend=function(){this._cbs.onattribute&&this._cbs.onattribute(this._attribname,this._attribvalue),this._attribs&&!Object.prototype.hasOwnProperty.call(this._attribs,this._attribname)&&(this._attribs[this._attribname]=this._attribvalue),this._attribname="",this._attribvalue=""},u.prototype._getInstructionName=function(t){var e=t.search(l),n=e<0?t:t.substr(0,e);return this._lowerCaseTagNames&&(n=n.toLowerCase()),n},u.prototype.ondeclaration=function(t){if(this._cbs.onprocessinginstruction){var e=this._getInstructionName(t);this._cbs.onprocessinginstruction("!"+e,"!"+t)}},u.prototype.onprocessinginstruction=function(t){if(this._cbs.onprocessinginstruction){var e=this._getInstructionName(t);this._cbs.onprocessinginstruction("?"+e,"?"+t)}},u.prototype.oncomment=function(t){this._updatePosition(4),this._cbs.oncomment&&this._cbs.oncomment(t),this._cbs.oncommentend&&this._cbs.oncommentend()},u.prototype.oncdata=function(t){this._updatePosition(1),this._options.xmlMode||this._options.recognizeCDATA?(this._cbs.oncdatastart&&this._cbs.oncdatastart(),this._cbs.ontext&&this._cbs.ontext(t),this._cbs.oncdataend&&this._cbs.oncdataend()):this.oncomment("[CDATA["+t+"]]")},u.prototype.onerror=function(t){this._cbs.onerror&&this._cbs.onerror(t)},u.prototype.onend=function(){if(this._cbs.onclosetag)for(var t=this._stack.length;t>0;this._cbs.onclosetag(this._stack[--t]));this._cbs.onend&&this._cbs.onend()},u.prototype.reset=function(){this._cbs.onreset&&this._cbs.onreset(),this._tokenizer.reset(),this._tagname="",this._attribname="",this._attribs=null,this._stack=[],this._cbs.onparserinit&&this._cbs.onparserinit(this)},u.prototype.parseComplete=function(t){this.reset(),this.end(t)},u.prototype.write=function(t){this._tokenizer.write(t)},u.prototype.end=function(t){this._tokenizer.end(t)},u.prototype.pause=function(){this._tokenizer.pause()},u.prototype.resume=function(){this._tokenizer.resume()},u.prototype.parseChunk=u.prototype.write,u.prototype.done=u.prototype.end,t.exports=u},function(t,e,n){t.exports=mt;var r=n(248),o=n(351),i=n(352),a=n(353),s=0,c=s++,l=s++,u=s++,f=s++,p=s++,d=s++,h=s++,y=s++,m=s++,v=s++,g=s++,b=s++,_=s++,A=s++,w=s++,C=s++,S=s++,x=s++,k=s++,E=s++,O=s++,B=s++,P=s++,j=s++,T=s++,N=s++,M=s++,L=s++,R=s++,D=s++,q=s++,I=s++,U=s++,z=s++,H=s++,F=s++,V=s++,W=s++,Y=s++,Z=s++,G=s++,K=s++,J=s++,Q=s++,X=s++,$=s++,tt=s++,et=s++,nt=s++,rt=s++,ot=s++,it=s++,at=s++,st=s++,ct=s++,lt=0,ut=lt++,ft=lt++,pt=lt++;function dt(t){return" "===t||"\n"===t||"\t"===t||"\f"===t||"\r"===t}function ht(t,e,n){var r=t.toLowerCase();return t===r?function(t){t===r?this._state=e:(this._state=n,this._index--)}:function(o){o===r||o===t?this._state=e:(this._state=n,this._index--)}}function yt(t,e){var n=t.toLowerCase();return function(r){r===n||r===t?this._state=e:(this._state=u,this._index--)}}function mt(t,e){this._state=c,this._buffer="",this._sectionStart=0,this._index=0,this._bufferOffset=0,this._baseState=c,this._special=ut,this._cbs=e,this._running=!0,this._ended=!1,this._xmlMode=!(!t||!t.xmlMode),this._decodeEntities=!(!t||!t.decodeEntities)}mt.prototype._stateText=function(t){"<"===t?(this._index>this._sectionStart&&this._cbs.ontext(this._getSection()),this._state=l,this._sectionStart=this._index):this._decodeEntities&&this._special===ut&&"&"===t&&(this._index>this._sectionStart&&this._cbs.ontext(this._getSection()),this._baseState=c,this._state=ot,this._sectionStart=this._index)},mt.prototype._stateBeforeTagName=function(t){"/"===t?this._state=p:"<"===t?(this._cbs.ontext(this._getSection()),this._sectionStart=this._index):">"===t||this._special!==ut||dt(t)?this._state=c:"!"===t?(this._state=w,this._sectionStart=this._index+1):"?"===t?(this._state=S,this._sectionStart=this._index+1):(this._state=this._xmlMode||"s"!==t&&"S"!==t?u:q,this._sectionStart=this._index)},mt.prototype._stateInTagName=function(t){("/"===t||">"===t||dt(t))&&(this._emitToken("onopentagname"),this._state=y,this._index--)},mt.prototype._stateBeforeCloseingTagName=function(t){dt(t)||(">"===t?this._state=c:this._special!==ut?"s"===t||"S"===t?this._state=I:(this._state=c,this._index--):(this._state=d,this._sectionStart=this._index))},mt.prototype._stateInCloseingTagName=function(t){(">"===t||dt(t))&&(this._emitToken("onclosetag"),this._state=h,this._index--)},mt.prototype._stateAfterCloseingTagName=function(t){">"===t&&(this._state=c,this._sectionStart=this._index+1)},mt.prototype._stateBeforeAttributeName=function(t){">"===t?(this._cbs.onopentagend(),this._state=c,this._sectionStart=this._index+1):"/"===t?this._state=f:dt(t)||(this._state=m,this._sectionStart=this._index)},mt.prototype._stateInSelfClosingTag=function(t){">"===t?(this._cbs.onselfclosingtag(),this._state=c,this._sectionStart=this._index+1):dt(t)||(this._state=y,this._index--)},mt.prototype._stateInAttributeName=function(t){("="===t||"/"===t||">"===t||dt(t))&&(this._cbs.onattribname(this._getSection()),this._sectionStart=-1,this._state=v,this._index--)},mt.prototype._stateAfterAttributeName=function(t){"="===t?this._state=g:"/"===t||">"===t?(this._cbs.onattribend(),this._state=y,this._index--):dt(t)||(this._cbs.onattribend(),this._state=m,this._sectionStart=this._index)},mt.prototype._stateBeforeAttributeValue=function(t){'"'===t?(this._state=b,this._sectionStart=this._index+1):"'"===t?(this._state=_,this._sectionStart=this._index+1):dt(t)||(this._state=A,this._sectionStart=this._index,this._index--)},mt.prototype._stateInAttributeValueDoubleQuotes=function(t){'"'===t?(this._emitToken("onattribdata"),this._cbs.onattribend(),this._state=y):this._decodeEntities&&"&"===t&&(this._emitToken("onattribdata"),this._baseState=this._state,this._state=ot,this._sectionStart=this._index)},mt.prototype._stateInAttributeValueSingleQuotes=function(t){"'"===t?(this._emitToken("onattribdata"),this._cbs.onattribend(),this._state=y):this._decodeEntities&&"&"===t&&(this._emitToken("onattribdata"),this._baseState=this._state,this._state=ot,this._sectionStart=this._index)},mt.prototype._stateInAttributeValueNoQuotes=function(t){dt(t)||">"===t?(this._emitToken("onattribdata"),this._cbs.onattribend(),this._state=y,this._index--):this._decodeEntities&&"&"===t&&(this._emitToken("onattribdata"),this._baseState=this._state,this._state=ot,this._sectionStart=this._index)},mt.prototype._stateBeforeDeclaration=function(t){this._state="["===t?B:"-"===t?x:C},mt.prototype._stateInDeclaration=function(t){">"===t&&(this._cbs.ondeclaration(this._getSection()),this._state=c,this._sectionStart=this._index+1)},mt.prototype._stateInProcessingInstruction=function(t){">"===t&&(this._cbs.onprocessinginstruction(this._getSection()),this._state=c,this._sectionStart=this._index+1)},mt.prototype._stateBeforeComment=function(t){"-"===t?(this._state=k,this._sectionStart=this._index+1):this._state=C},mt.prototype._stateInComment=function(t){"-"===t&&(this._state=E)},mt.prototype._stateAfterComment1=function(t){this._state="-"===t?O:k},mt.prototype._stateAfterComment2=function(t){">"===t?(this._cbs.oncomment(this._buffer.substring(this._sectionStart,this._index-2)),this._state=c,this._sectionStart=this._index+1):"-"!==t&&(this._state=k)},mt.prototype._stateBeforeCdata1=ht("C",P,C),mt.prototype._stateBeforeCdata2=ht("D",j,C),mt.prototype._stateBeforeCdata3=ht("A",T,C),mt.prototype._stateBeforeCdata4=ht("T",N,C),mt.prototype._stateBeforeCdata5=ht("A",M,C),mt.prototype._stateBeforeCdata6=function(t){"["===t?(this._state=L,this._sectionStart=this._index+1):(this._state=C,this._index--)},mt.prototype._stateInCdata=function(t){"]"===t&&(this._state=R)},mt.prototype._stateAfterCdata1=function(t){this._state="]"===t?D:L},mt.prototype._stateAfterCdata2=function(t){">"===t?(this._cbs.oncdata(this._buffer.substring(this._sectionStart,this._index-2)),this._state=c,this._sectionStart=this._index+1):"]"!==t&&(this._state=L)},mt.prototype._stateBeforeSpecial=function(t){"c"===t||"C"===t?this._state=U:"t"===t||"T"===t?this._state=J:(this._state=u,this._index--)},mt.prototype._stateBeforeSpecialEnd=function(t){this._special!==ft||"c"!==t&&"C"!==t?this._special!==pt||"t"!==t&&"T"!==t?this._state=c:this._state=tt:this._state=W},mt.prototype._stateBeforeScript1=yt("R",z),mt.prototype._stateBeforeScript2=yt("I",H),mt.prototype._stateBeforeScript3=yt("P",F),mt.prototype._stateBeforeScript4=yt("T",V),mt.prototype._stateBeforeScript5=function(t){("/"===t||">"===t||dt(t))&&(this._special=ft),this._state=u,this._index--},mt.prototype._stateAfterScript1=ht("R",Y,c),mt.prototype._stateAfterScript2=ht("I",Z,c),mt.prototype._stateAfterScript3=ht("P",G,c),mt.prototype._stateAfterScript4=ht("T",K,c),mt.prototype._stateAfterScript5=function(t){">"===t||dt(t)?(this._special=ut,this._state=d,this._sectionStart=this._index-6,this._index--):this._state=c},mt.prototype._stateBeforeStyle1=yt("Y",Q),mt.prototype._stateBeforeStyle2=yt("L",X),mt.prototype._stateBeforeStyle3=yt("E",$),mt.prototype._stateBeforeStyle4=function(t){("/"===t||">"===t||dt(t))&&(this._special=pt),this._state=u,this._index--},mt.prototype._stateAfterStyle1=ht("Y",et,c),mt.prototype._stateAfterStyle2=ht("L",nt,c),mt.prototype._stateAfterStyle3=ht("E",rt,c),mt.prototype._stateAfterStyle4=function(t){">"===t||dt(t)?(this._special=ut,this._state=d,this._sectionStart=this._index-5,this._index--):this._state=c},mt.prototype._stateBeforeEntity=ht("#",it,at),mt.prototype._stateBeforeNumericEntity=ht("X",ct,st),mt.prototype._parseNamedEntityStrict=function(){if(this._sectionStart+16&&(e=6);e>=2;){var n=this._buffer.substr(t,e);if(i.hasOwnProperty(n))return this._emitPartial(i[n]),void(this._sectionStart+=e+1);e--}},mt.prototype._stateInNamedEntity=function(t){";"===t?(this._parseNamedEntityStrict(),this._sectionStart+1"z")&&(t<"A"||t>"Z")&&(t<"0"||t>"9")&&(this._xmlMode||this._sectionStart+1===this._index||(this._baseState!==c?"="!==t&&this._parseNamedEntityStrict():this._parseLegacyEntity()),this._state=this._baseState,this._index--)},mt.prototype._decodeNumericEntity=function(t,e){var n=this._sectionStart+t;if(n!==this._index){var o=this._buffer.substring(n,this._index),i=parseInt(o,e);this._emitPartial(r(i)),this._sectionStart=this._index}else this._sectionStart--;this._state=this._baseState},mt.prototype._stateInNumericEntity=function(t){";"===t?(this._decodeNumericEntity(2,10),this._sectionStart++):(t<"0"||t>"9")&&(this._xmlMode?this._state=this._baseState:this._decodeNumericEntity(2,10),this._index--)},mt.prototype._stateInHexEntity=function(t){";"===t?(this._decodeNumericEntity(3,16),this._sectionStart++):(t<"a"||t>"f")&&(t<"A"||t>"F")&&(t<"0"||t>"9")&&(this._xmlMode?this._state=this._baseState:this._decodeNumericEntity(3,16),this._index--)},mt.prototype._cleanup=function(){this._sectionStart<0?(this._buffer="",this._bufferOffset+=this._index,this._index=0):this._running&&(this._state===c?(this._sectionStart!==this._index&&this._cbs.ontext(this._buffer.substr(this._sectionStart)),this._buffer="",this._bufferOffset+=this._index,this._index=0):this._sectionStart===this._index?(this._buffer="",this._bufferOffset+=this._index,this._index=0):(this._buffer=this._buffer.substr(this._sectionStart),this._index-=this._sectionStart,this._bufferOffset+=this._sectionStart),this._sectionStart=0)},mt.prototype.write=function(t){this._ended&&this._cbs.onerror(Error(".write() after done!")),this._buffer+=t,this._parse()},mt.prototype._parse=function(){for(;this._indexs)throw new RangeError('The value "'+t+'" is invalid for option "size"');var e=new Uint8Array(t);return Object.setPrototypeOf(e,l.prototype),e}function l(t,e,n){if("number"==typeof t){if("string"==typeof e)throw new TypeError('The "string" argument must be of type string. Received type number');return p(t)}return u(t,e,n)}function u(t,e,n){if("string"==typeof t)return function(t,e){"string"==typeof e&&""!==e||(e="utf8");if(!l.isEncoding(e))throw new TypeError("Unknown encoding: "+e);var n=0|m(t,e),r=c(n),o=r.write(t,e);o!==n&&(r=r.slice(0,o));return r}(t,e);if(ArrayBuffer.isView(t))return function(t){if(H(t,Uint8Array)){var e=new Uint8Array(t);return h(e.buffer,e.byteOffset,e.byteLength)}return d(t)}(t);if(null==t)throw new TypeError("The first argument must be one of type string, Buffer, ArrayBuffer, Array, or Array-like Object. Received type "+r(t));if(H(t,ArrayBuffer)||t&&H(t.buffer,ArrayBuffer))return h(t,e,n);if("undefined"!=typeof SharedArrayBuffer&&(H(t,SharedArrayBuffer)||t&&H(t.buffer,SharedArrayBuffer)))return h(t,e,n);if("number"==typeof t)throw new TypeError('The "value" argument must not be of type number. Received type number');var o=t.valueOf&&t.valueOf();if(null!=o&&o!==t)return l.from(o,e,n);var i=function(t){if(l.isBuffer(t)){var e=0|y(t.length),n=c(e);return 0===n.length||t.copy(n,0,0,e),n}if(void 0!==t.length)return"number"!=typeof t.length||F(t.length)?c(0):d(t);if("Buffer"===t.type&&Array.isArray(t.data))return d(t.data)}(t);if(i)return i;if("undefined"!=typeof Symbol&&null!=Symbol.toPrimitive&&"function"==typeof t[Symbol.toPrimitive])return l.from(t[Symbol.toPrimitive]("string"),e,n);throw new TypeError("The first argument must be one of type string, Buffer, ArrayBuffer, Array, or Array-like Object. Received type "+r(t))}function f(t){if("number"!=typeof t)throw new TypeError('"size" argument must be of type number');if(t<0)throw new RangeError('The value "'+t+'" is invalid for option "size"')}function p(t){return f(t),c(t<0?0:0|y(t))}function d(t){for(var e=t.length<0?0:0|y(t.length),n=c(e),r=0;r=s)throw new RangeError("Attempt to allocate Buffer larger than maximum size: 0x"+s.toString(16)+" bytes");return 0|t}function m(t,e){if(l.isBuffer(t))return t.length;if(ArrayBuffer.isView(t)||H(t,ArrayBuffer))return t.byteLength;if("string"!=typeof t)throw new TypeError('The "string" argument must be one of type string, Buffer, or ArrayBuffer. Received type '+r(t));var n=t.length,o=arguments.length>2&&!0===arguments[2];if(!o&&0===n)return 0;for(var i=!1;;)switch(e){case"ascii":case"latin1":case"binary":return n;case"utf8":case"utf-8":return I(t).length;case"ucs2":case"ucs-2":case"utf16le":case"utf-16le":return 2*n;case"hex":return n>>>1;case"base64":return U(t).length;default:if(i)return o?-1:I(t).length;e=(""+e).toLowerCase(),i=!0}}function v(t,e,n){var r=!1;if((void 0===e||e<0)&&(e=0),e>this.length)return"";if((void 0===n||n>this.length)&&(n=this.length),n<=0)return"";if((n>>>=0)<=(e>>>=0))return"";for(t||(t="utf8");;)switch(t){case"hex":return j(this,e,n);case"utf8":case"utf-8":return E(this,e,n);case"ascii":return B(this,e,n);case"latin1":case"binary":return P(this,e,n);case"base64":return k(this,e,n);case"ucs2":case"ucs-2":case"utf16le":case"utf-16le":return T(this,e,n);default:if(r)throw new TypeError("Unknown encoding: "+t);t=(t+"").toLowerCase(),r=!0}}function g(t,e,n){var r=t[e];t[e]=t[n],t[n]=r}function b(t,e,n,r,o){if(0===t.length)return-1;if("string"==typeof n?(r=n,n=0):n>2147483647?n=2147483647:n<-2147483648&&(n=-2147483648),F(n=+n)&&(n=o?0:t.length-1),n<0&&(n=t.length+n),n>=t.length){if(o)return-1;n=t.length-1}else if(n<0){if(!o)return-1;n=0}if("string"==typeof e&&(e=l.from(e,r)),l.isBuffer(e))return 0===e.length?-1:_(t,e,n,r,o);if("number"==typeof e)return e&=255,"function"==typeof Uint8Array.prototype.indexOf?o?Uint8Array.prototype.indexOf.call(t,e,n):Uint8Array.prototype.lastIndexOf.call(t,e,n):_(t,[e],n,r,o);throw new TypeError("val must be string, number or Buffer")}function _(t,e,n,r,o){var i,a=1,s=t.length,c=e.length;if(void 0!==r&&("ucs2"===(r=String(r).toLowerCase())||"ucs-2"===r||"utf16le"===r||"utf-16le"===r)){if(t.length<2||e.length<2)return-1;a=2,s/=2,c/=2,n/=2}function l(t,e){return 1===a?t[e]:t.readUInt16BE(e*a)}if(o){var u=-1;for(i=n;is&&(n=s-c),i=n;i>=0;i--){for(var f=!0,p=0;po&&(r=o):r=o;var i=e.length;r>i/2&&(r=i/2);for(var a=0;a>8,o=n%256,i.push(o),i.push(r);return i}(e,t.length-n),t,n,r)}function k(t,e,n){return 0===e&&n===t.length?o.fromByteArray(t):o.fromByteArray(t.slice(e,n))}function E(t,e,n){n=Math.min(t.length,n);for(var r=[],o=e;o239?4:l>223?3:l>191?2:1;if(o+f<=n)switch(f){case 1:l<128&&(u=l);break;case 2:128==(192&(i=t[o+1]))&&(c=(31&l)<<6|63&i)>127&&(u=c);break;case 3:i=t[o+1],a=t[o+2],128==(192&i)&&128==(192&a)&&(c=(15&l)<<12|(63&i)<<6|63&a)>2047&&(c<55296||c>57343)&&(u=c);break;case 4:i=t[o+1],a=t[o+2],s=t[o+3],128==(192&i)&&128==(192&a)&&128==(192&s)&&(c=(15&l)<<18|(63&i)<<12|(63&a)<<6|63&s)>65535&&c<1114112&&(u=c)}null===u?(u=65533,f=1):u>65535&&(u-=65536,r.push(u>>>10&1023|55296),u=56320|1023&u),r.push(u),o+=f}return function(t){var e=t.length;if(e<=O)return String.fromCharCode.apply(String,t);var n="",r=0;for(;rr.length?l.from(i).copy(r,o):Uint8Array.prototype.set.call(r,i,o);else{if(!l.isBuffer(i))throw new TypeError('"list" argument must be an Array of Buffers');i.copy(r,o)}o+=i.length}return r},l.byteLength=m,l.prototype._isBuffer=!0,l.prototype.swap16=function(){var t=this.length;if(t%2!=0)throw new RangeError("Buffer size must be a multiple of 16-bits");for(var e=0;en&&(t+=" ... "),""},a&&(l.prototype[a]=l.prototype.inspect),l.prototype.compare=function(t,e,n,o,i){if(H(t,Uint8Array)&&(t=l.from(t,t.offset,t.byteLength)),!l.isBuffer(t))throw new TypeError('The "target" argument must be one of type Buffer or Uint8Array. Received type '+r(t));if(void 0===e&&(e=0),void 0===n&&(n=t?t.length:0),void 0===o&&(o=0),void 0===i&&(i=this.length),e<0||n>t.length||o<0||i>this.length)throw new RangeError("out of range index");if(o>=i&&e>=n)return 0;if(o>=i)return-1;if(e>=n)return 1;if(this===t)return 0;for(var a=(i>>>=0)-(o>>>=0),s=(n>>>=0)-(e>>>=0),c=Math.min(a,s),u=this.slice(o,i),f=t.slice(e,n),p=0;p>>=0,isFinite(n)?(n>>>=0,void 0===r&&(r="utf8")):(r=n,n=void 0)}var o=this.length-e;if((void 0===n||n>o)&&(n=o),t.length>0&&(n<0||e<0)||e>this.length)throw new RangeError("Attempt to write outside buffer bounds");r||(r="utf8");for(var i=!1;;)switch(r){case"hex":return A(this,t,e,n);case"utf8":case"utf-8":return w(this,t,e,n);case"ascii":case"latin1":case"binary":return C(this,t,e,n);case"base64":return S(this,t,e,n);case"ucs2":case"ucs-2":case"utf16le":case"utf-16le":return x(this,t,e,n);default:if(i)throw new TypeError("Unknown encoding: "+r);r=(""+r).toLowerCase(),i=!0}},l.prototype.toJSON=function(){return{type:"Buffer",data:Array.prototype.slice.call(this._arr||this,0)}};var O=4096;function B(t,e,n){var r="";n=Math.min(t.length,n);for(var o=e;or)&&(n=r);for(var o="",i=e;in)throw new RangeError("Trying to access beyond buffer length")}function M(t,e,n,r,o,i){if(!l.isBuffer(t))throw new TypeError('"buffer" argument must be a Buffer instance');if(e>o||et.length)throw new RangeError("Index out of range")}function L(t,e,n,r,o,i){if(n+r>t.length)throw new RangeError("Index out of range");if(n<0)throw new RangeError("Index out of range")}function R(t,e,n,r,o){return e=+e,n>>>=0,o||L(t,0,n,4),i.write(t,e,n,r,23,4),n+4}function D(t,e,n,r,o){return e=+e,n>>>=0,o||L(t,0,n,8),i.write(t,e,n,r,52,8),n+8}l.prototype.slice=function(t,e){var n=this.length;(t=~~t)<0?(t+=n)<0&&(t=0):t>n&&(t=n),(e=void 0===e?n:~~e)<0?(e+=n)<0&&(e=0):e>n&&(e=n),e>>=0,e>>>=0,n||N(t,e,this.length);for(var r=this[t],o=1,i=0;++i>>=0,e>>>=0,n||N(t,e,this.length);for(var r=this[t+--e],o=1;e>0&&(o*=256);)r+=this[t+--e]*o;return r},l.prototype.readUint8=l.prototype.readUInt8=function(t,e){return t>>>=0,e||N(t,1,this.length),this[t]},l.prototype.readUint16LE=l.prototype.readUInt16LE=function(t,e){return t>>>=0,e||N(t,2,this.length),this[t]|this[t+1]<<8},l.prototype.readUint16BE=l.prototype.readUInt16BE=function(t,e){return t>>>=0,e||N(t,2,this.length),this[t]<<8|this[t+1]},l.prototype.readUint32LE=l.prototype.readUInt32LE=function(t,e){return t>>>=0,e||N(t,4,this.length),(this[t]|this[t+1]<<8|this[t+2]<<16)+16777216*this[t+3]},l.prototype.readUint32BE=l.prototype.readUInt32BE=function(t,e){return t>>>=0,e||N(t,4,this.length),16777216*this[t]+(this[t+1]<<16|this[t+2]<<8|this[t+3])},l.prototype.readIntLE=function(t,e,n){t>>>=0,e>>>=0,n||N(t,e,this.length);for(var r=this[t],o=1,i=0;++i=(o*=128)&&(r-=Math.pow(2,8*e)),r},l.prototype.readIntBE=function(t,e,n){t>>>=0,e>>>=0,n||N(t,e,this.length);for(var r=e,o=1,i=this[t+--r];r>0&&(o*=256);)i+=this[t+--r]*o;return i>=(o*=128)&&(i-=Math.pow(2,8*e)),i},l.prototype.readInt8=function(t,e){return t>>>=0,e||N(t,1,this.length),128&this[t]?-1*(255-this[t]+1):this[t]},l.prototype.readInt16LE=function(t,e){t>>>=0,e||N(t,2,this.length);var n=this[t]|this[t+1]<<8;return 32768&n?4294901760|n:n},l.prototype.readInt16BE=function(t,e){t>>>=0,e||N(t,2,this.length);var n=this[t+1]|this[t]<<8;return 32768&n?4294901760|n:n},l.prototype.readInt32LE=function(t,e){return t>>>=0,e||N(t,4,this.length),this[t]|this[t+1]<<8|this[t+2]<<16|this[t+3]<<24},l.prototype.readInt32BE=function(t,e){return t>>>=0,e||N(t,4,this.length),this[t]<<24|this[t+1]<<16|this[t+2]<<8|this[t+3]},l.prototype.readFloatLE=function(t,e){return t>>>=0,e||N(t,4,this.length),i.read(this,t,!0,23,4)},l.prototype.readFloatBE=function(t,e){return t>>>=0,e||N(t,4,this.length),i.read(this,t,!1,23,4)},l.prototype.readDoubleLE=function(t,e){return t>>>=0,e||N(t,8,this.length),i.read(this,t,!0,52,8)},l.prototype.readDoubleBE=function(t,e){return t>>>=0,e||N(t,8,this.length),i.read(this,t,!1,52,8)},l.prototype.writeUintLE=l.prototype.writeUIntLE=function(t,e,n,r){(t=+t,e>>>=0,n>>>=0,r)||M(this,t,e,n,Math.pow(2,8*n)-1,0);var o=1,i=0;for(this[e]=255&t;++i>>=0,n>>>=0,r)||M(this,t,e,n,Math.pow(2,8*n)-1,0);var o=n-1,i=1;for(this[e+o]=255&t;--o>=0&&(i*=256);)this[e+o]=t/i&255;return e+n},l.prototype.writeUint8=l.prototype.writeUInt8=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,1,255,0),this[e]=255&t,e+1},l.prototype.writeUint16LE=l.prototype.writeUInt16LE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,2,65535,0),this[e]=255&t,this[e+1]=t>>>8,e+2},l.prototype.writeUint16BE=l.prototype.writeUInt16BE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,2,65535,0),this[e]=t>>>8,this[e+1]=255&t,e+2},l.prototype.writeUint32LE=l.prototype.writeUInt32LE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,4,4294967295,0),this[e+3]=t>>>24,this[e+2]=t>>>16,this[e+1]=t>>>8,this[e]=255&t,e+4},l.prototype.writeUint32BE=l.prototype.writeUInt32BE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,4,4294967295,0),this[e]=t>>>24,this[e+1]=t>>>16,this[e+2]=t>>>8,this[e+3]=255&t,e+4},l.prototype.writeIntLE=function(t,e,n,r){if(t=+t,e>>>=0,!r){var o=Math.pow(2,8*n-1);M(this,t,e,n,o-1,-o)}var i=0,a=1,s=0;for(this[e]=255&t;++i>0)-s&255;return e+n},l.prototype.writeIntBE=function(t,e,n,r){if(t=+t,e>>>=0,!r){var o=Math.pow(2,8*n-1);M(this,t,e,n,o-1,-o)}var i=n-1,a=1,s=0;for(this[e+i]=255&t;--i>=0&&(a*=256);)t<0&&0===s&&0!==this[e+i+1]&&(s=1),this[e+i]=(t/a>>0)-s&255;return e+n},l.prototype.writeInt8=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,1,127,-128),t<0&&(t=255+t+1),this[e]=255&t,e+1},l.prototype.writeInt16LE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,2,32767,-32768),this[e]=255&t,this[e+1]=t>>>8,e+2},l.prototype.writeInt16BE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,2,32767,-32768),this[e]=t>>>8,this[e+1]=255&t,e+2},l.prototype.writeInt32LE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,4,2147483647,-2147483648),this[e]=255&t,this[e+1]=t>>>8,this[e+2]=t>>>16,this[e+3]=t>>>24,e+4},l.prototype.writeInt32BE=function(t,e,n){return t=+t,e>>>=0,n||M(this,t,e,4,2147483647,-2147483648),t<0&&(t=4294967295+t+1),this[e]=t>>>24,this[e+1]=t>>>16,this[e+2]=t>>>8,this[e+3]=255&t,e+4},l.prototype.writeFloatLE=function(t,e,n){return R(this,t,e,!0,n)},l.prototype.writeFloatBE=function(t,e,n){return R(this,t,e,!1,n)},l.prototype.writeDoubleLE=function(t,e,n){return D(this,t,e,!0,n)},l.prototype.writeDoubleBE=function(t,e,n){return D(this,t,e,!1,n)},l.prototype.copy=function(t,e,n,r){if(!l.isBuffer(t))throw new TypeError("argument should be a Buffer");if(n||(n=0),r||0===r||(r=this.length),e>=t.length&&(e=t.length),e||(e=0),r>0&&r=this.length)throw new RangeError("Index out of range");if(r<0)throw new RangeError("sourceEnd out of bounds");r>this.length&&(r=this.length),t.length-e>>=0,n=void 0===n?this.length:n>>>0,t||(t=0),"number"==typeof t)for(i=e;i55295&&n<57344){if(!o){if(n>56319){(e-=3)>-1&&i.push(239,191,189);continue}if(a+1===r){(e-=3)>-1&&i.push(239,191,189);continue}o=n;continue}if(n<56320){(e-=3)>-1&&i.push(239,191,189),o=n;continue}n=65536+(o-55296<<10|n-56320)}else o&&(e-=3)>-1&&i.push(239,191,189);if(o=null,n<128){if((e-=1)<0)break;i.push(n)}else if(n<2048){if((e-=2)<0)break;i.push(n>>6|192,63&n|128)}else if(n<65536){if((e-=3)<0)break;i.push(n>>12|224,n>>6&63|128,63&n|128)}else{if(!(n<1114112))throw new Error("Invalid code point");if((e-=4)<0)break;i.push(n>>18|240,n>>12&63|128,n>>6&63|128,63&n|128)}}return i}function U(t){return o.toByteArray(function(t){if((t=(t=t.split("=")[0]).trim().replace(q,"")).length<2)return"";for(;t.length%4!=0;)t+="=";return t}(t))}function z(t,e,n,r){for(var o=0;o=e.length||o>=t.length);++o)e[o+n]=t[o];return o}function H(t,e){return t instanceof e||null!=t&&null!=t.constructor&&null!=t.constructor.name&&t.constructor.name===e.name}function F(t){return t!=t}var V=function(){for(var t="0123456789abcdef",e=new Array(256),n=0;n<16;++n)for(var r=16*n,o=0;o<16;++o)e[r+o]=t[n]+t[o];return e}()},function(t,e){"use strict";function n(t){return n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},n(t)}Object.defineProperty(e,"__esModule",{value:!0});var r="function"==typeof Symbol&&"symbol"===n(Symbol.iterator)?function(t){return n(t)}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":n(t)};e.default=function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[];if(t===e)return!1;var o=Object.keys(t),i=Object.keys(e);if(o.length!==i.length)return!0;var a={},s=void 0,c=void 0;for(s=0,c=n.length;s1?d(t):t.charCodeAt(0)).toString(16).toUpperCase()+";"}var y=new RegExp(i.source+"|"+p.source,"g");function m(t){return function(e){return e.replace(y,(function(e){return t[e]||h(e)}))}}e.escape=function(t){return t.replace(y,h)},e.escapeUTF8=function(t){return t.replace(i,h)}},function(t,e,n){"use strict";var r=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(e,"__esModule",{value:!0});var o=r(n(356)),i=String.fromCodePoint||function(t){var e="";return t>65535&&(t-=65536,e+=String.fromCharCode(t>>>10&1023|55296),t=56320|1023&t),e+=String.fromCharCode(t)};e.default=function(t){return t>=55296&&t<=57343||t>1114111?"�":(t in o.default&&(t=o.default[t]),i(t))}},function(t,e,n){var r=n(162),o=r.Buffer;function i(t,e){for(var n in t)e[n]=t[n]}function a(t,e,n){return o(t,e,n)}o.from&&o.alloc&&o.allocUnsafe&&o.allocUnsafeSlow?t.exports=r:(i(r,e),e.Buffer=a),a.prototype=Object.create(o.prototype),i(o,a),a.from=function(t,e,n){if("number"==typeof t)throw new TypeError("Argument must not be a number");return o(t,e,n)},a.alloc=function(t,e,n){if("number"!=typeof t)throw new TypeError("Argument must be a number");var r=o(t);return void 0!==e?"string"==typeof n?r.fill(e,n):r.fill(e):r.fill(0),r},a.allocUnsafe=function(t){if("number"!=typeof t)throw new TypeError("Argument must be a number");return o(t)},a.allocUnsafeSlow=function(t){if("number"!=typeof t)throw new TypeError("Argument must be a number");return r.SlowBuffer(t)}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=function(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return function(t,e){var n=[],r=!0,o=!1,i=void 0;try{for(var a,s=t[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!e||n.length!==e);r=!0);}catch(c){o=!0,i=c}finally{try{!r&&s.return&&s.return()}finally{if(o)throw i}}return n}(t,e);throw new TypeError("Invalid attempt to destructure non-iterable instance")};function o(t){if(Array.isArray(t)){for(var e=0,n=Array(t.length);e1?e-1:0),r=1;r0?n:e)(r)}},function(t,e){e.f=Object.getOwnPropertySymbols},function(t,e,n){var r=n(21),o=n(34),i=n(5)("match");t.exports=function(t){var e;return r(t)&&(void 0!==(e=t[i])?!!e:"RegExp"==o(t))}},function(t,e,n){var r={};r[n(5)("toStringTag")]="z",t.exports="[object z]"===String(r)},function(t,e,n){var r=n(6),o=n(90),i=n(47),a=n(35),s=r("".charAt),c=r("".charCodeAt),l=r("".slice),u=function(t){return function(e,n){var r,u,f=i(a(e)),p=o(n),d=f.length;return p<0||p>=d?t?"":void 0:(r=c(f,p))<55296||r>56319||p+1===d||(u=c(f,p+1))<56320||u>57343?t?s(f,p):r:t?l(f,p,p+2):u-56320+(r-55296<<10)+65536}};t.exports={codeAt:u(!1),charAt:u(!0)}},function(t,e,n){var r=n(183);t.exports=function(t,e){return new(r(t))(0===e?0:e)}},function(t,e,n){var r=n(184),o=n(92),i=n(21),a=n(5)("species"),s=Array;t.exports=function(t){var e;return r(t)&&(e=t.constructor,(o(e)&&(e===s||r(e.prototype))||i(e)&&null===(e=e[a]))&&(e=void 0)),void 0===e?s:e}},function(t,e,n){var r=n(34);t.exports=Array.isArray||function(t){return"Array"==r(t)}},function(t,e,n){"use strict";var r=n(36),o=n(16),i=n(44),a=n(186),s=n(131),c=n(92),l=n(46),u=n(132),f=n(94),p=n(71),d=Array;t.exports=function(t){var e=i(t),n=c(this),h=arguments.length,y=h>1?arguments[1]:void 0,m=void 0!==y;m&&(y=r(y,h>2?arguments[2]:void 0));var v,g,b,_,A,w,C=p(e),S=0;if(!C||this===d&&s(C))for(v=l(e),g=n?new this(v):d(v);v>S;S++)w=m?y(e[S],S):e[S],u(g,S,w);else for(A=(_=f(e,C)).next,g=n?new this:[];!(b=o(A,_)).done;S++)w=m?a(_,y,[b.value,S],!0):b.value,u(g,S,w);return g.length=S,g}},function(t,e,n){var r=n(20),o=n(130);t.exports=function(t,e,n,i){try{return i?e(r(n)[0],n[1]):e(n)}catch(a){o(t,"throw",a)}}},function(t,e,n){"use strict";var r=n(19),o=n(6),i=n(16),a=n(7),s=n(128),c=n(178),l=n(170),u=n(44),f=n(80),p=Object.assign,d=Object.defineProperty,h=o([].concat);t.exports=!p||a((function(){if(r&&1!==p({b:1},p(d({},"a",{enumerable:!0,get:function(){d(this,"b",{value:3,enumerable:!1})}}),{b:2})).b)return!0;var t={},e={},n=Symbol(),o="abcdefghijklmnopqrst";return t[n]=7,o.split("").forEach((function(t){e[t]=t})),7!=p({},t)[n]||s(p({},e)).join("")!=o}))?function(t,e){for(var n=u(t),o=arguments.length,a=1,p=c.f,d=l.f;o>a;)for(var y,m=f(arguments[a++]),v=p?h(s(m),p(m)):s(m),g=v.length,b=0;g>b;)y=v[b++],r&&!i(d,m,y)||(n[y]=m[y]);return n}:p},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}var o=n(2),i=String,a=TypeError;t.exports=function(t){if("object"==r(t)||o(t))return t;throw a("Can't set "+i(t)+" as a prototype")}},function(t,e,n){"use strict";var r=n(27),o=n(28),i=n(5),a=n(19),s=i("species");t.exports=function(t){var e=r(t),n=o.f;a&&e&&!e[s]&&n(e,s,{configurable:!0,get:function(){return this}})}},function(t,e,n){var r=n(20),o=n(191),i=n(64),a=n(5)("species");t.exports=function(t,e){var n,s=r(t).constructor;return void 0===s||i(n=r(s)[a])?e:o(n)}},function(t,e,n){var r=n(92),o=n(66),i=TypeError;t.exports=function(t){if(r(t))return t;throw i(o(t)+" is not a constructor")}},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}var o=n(63),i=Function.prototype,a=i.apply,s=i.call;t.exports="object"==("undefined"==typeof Reflect?"undefined":r(Reflect))&&Reflect.apply||(o?s.bind(a):function(){return s.apply(a,arguments)})},function(t,e,n){var r=n(6);t.exports=r([].slice)},function(t,e,n){var r,o,i,a,s,c,l,u,f=n(4),p=n(36),d=n(79).f,h=n(136).set,y=n(138),m=n(195),v=n(196),g=n(72),b=f.MutationObserver||f.WebKitMutationObserver,_=f.document,A=f.process,w=f.Promise,C=d(f,"queueMicrotask"),S=C&&C.value;S||(r=function(){var t,e;for(g&&(t=A.domain)&&t.exit();o;){e=o.fn,o=o.next;try{e()}catch(n){throw o?a():i=void 0,n}}i=void 0,t&&t.enter()},y||g||v||!b||!_?!m&&w&&w.resolve?((l=w.resolve(void 0)).constructor=w,u=p(l.then,l),a=function(){u(r)}):g?a=function(){A.nextTick(r)}:(h=p(h,f),a=function(){h(r)}):(s=!0,c=_.createTextNode(""),new b(r).observe(c,{characterData:!0}),a=function(){c.data=s=!s})),t.exports=S||function(t){var e={fn:t,next:void 0};i&&(i.next=e),o||(o=e,a()),i=e}},function(t,e,n){var r=n(65),o=n(4);t.exports=/ipad|iphone|ipod/i.test(r)&&void 0!==o.Pebble},function(t,e,n){var r=n(65);t.exports=/web0s(?!.*chrome)/i.test(r)},function(t,e,n){var r=n(4);t.exports=function(t,e){var n=r.console;n&&n.error&&(1==arguments.length?n.error(t):n.error(t,e))}},function(t){var e=function(){this.head=null,this.tail=null};e.prototype={add:function(t){var e={item:t,next:null};this.head?this.tail.next=e:this.head=e,this.tail=e},get:function(){var t=this.head;if(t)return this.head=t.next,this.tail===t&&(this.tail=null),t.item}},t.exports=e},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}var o=n(139),i=n(72);t.exports=!o&&!i&&"object"==("undefined"==typeof window?"undefined":r(window))&&"object"==("undefined"==typeof document?"undefined":r(document))},function(t,e,n){var r=n(20),o=n(21),i=n(74);t.exports=function(t,e){if(r(t),o(e)&&e.constructor===t)return e;var n=i.f(t);return(0,n.resolve)(e),n.promise}},function(t,e,n){"use strict";var r=n(127).forEach,o=n(202)("forEach");t.exports=o?[].forEach:function(t){return r(this,t,arguments.length>1?arguments[1]:void 0)}},function(t,e,n){"use strict";var r=n(7);t.exports=function(t,e){var n=[][t];return!!n&&r((function(){n.call(null,e||function(){return 1},1)}))}},function(t,e,n){"use strict";var r=n(3),o=n(16),i=n(25),a=n(86),s=n(2),c=n(145),l=n(147),u=n(134),f=n(73),p=n(45),d=n(31),h=n(5),y=n(48),m=n(146),v=a.PROPER,g=a.CONFIGURABLE,b=m.IteratorPrototype,_=m.BUGGY_SAFARI_ITERATORS,A=h("iterator"),w="keys",C="values",S="entries",x=function(){return this};t.exports=function(t,e,n,a,h,m,k){c(n,e,a);var E,O,B,P=function(t){if(t===h&&L)return L;if(!_&&t in N)return N[t];switch(t){case w:case C:case S:return function(){return new n(this,t)}}return function(){return new n(this)}},j=e+" Iterator",T=!1,N=t.prototype,M=N[A]||N["@@iterator"]||h&&N[h],L=!_&&M||P(h),R="Array"==e&&N.entries||M;if(R&&(E=l(R.call(new t)))!==Object.prototype&&E.next&&(i||l(E)===b||(u?u(E,b):s(E[A])||d(E,A,x)),f(E,j,!0,!0),i&&(y[j]=x)),v&&h==C&&M&&M.name!==C&&(!i&&g?p(N,"name",C):(T=!0,L=function(){return o(M,this)})),h)if(O={values:P(C),keys:m?L:P(w),entries:P(S)},k)for(B in O)(_||T||!(B in N))&&d(N,B,O[B]);else r({target:e,proto:!0,forced:_||T},O);return i&&!k||N[A]===L||d(N,A,L,{name:h}),y[e]=L,O}},function(t,e,n){var r=n(7);t.exports=!r((function(){function t(){}return t.prototype.constructor=null,Object.getPrototypeOf(new t)!==t.prototype}))},function(t){t.exports=function(t,e){return{value:t,done:e}}},function(t,e,n){"use strict";n(144);var r=n(3),o=n(4),i=n(16),a=n(6),s=n(19),c=n(207),l=n(31),u=n(208),f=n(73),p=n(145),d=n(68),h=n(135),y=n(2),m=n(22),v=n(36),g=n(69),b=n(20),_=n(21),A=n(47),w=n(70),C=n(42),S=n(94),x=n(71),k=n(137),E=n(5),O=n(209),B=E("iterator"),P="URLSearchParams",j=P+"Iterator",T=d.set,N=d.getterFor(P),M=d.getterFor(j),L=Object.getOwnPropertyDescriptor,R=function(t){if(!s)return o[t];var e=L(o,t);return e&&e.value},D=R("fetch"),q=R("Request"),I=R("Headers"),U=q&&q.prototype,z=I&&I.prototype,H=o.RegExp,F=o.TypeError,V=o.decodeURIComponent,W=o.encodeURIComponent,Y=a("".charAt),Z=a([].join),G=a([].push),K=a("".replace),J=a([].shift),Q=a([].splice),X=a("".split),$=a("".slice),tt=/\+/g,et=Array(4),nt=function(t){return et[t-1]||(et[t-1]=H("((?:%[\\da-f]{2}){"+t+"})","gi"))},rt=function(t){try{return V(t)}catch(e){return t}},ot=function(t){var e=K(t,tt," "),n=4;try{return V(e)}catch(r){for(;n;)e=K(e,nt(n--),rt);return e}},it=/[!'()~]|%20/g,at={"!":"%21","'":"%27","(":"%28",")":"%29","~":"%7E","%20":"+"},st=function(t){return at[t]},ct=function(t){return K(W(t),it,st)},lt=p((function(t,e){T(this,{type:j,iterator:S(N(t).entries),kind:e})}),"Iterator",(function(){var t=M(this),e=t.kind,n=t.iterator.next(),r=n.value;return n.done||(n.value="keys"===e?r.key:"values"===e?r.value:[r.key,r.value]),n}),!0),ut=function(t){this.entries=[],this.url=null,void 0!==t&&(_(t)?this.parseObject(t):this.parseQuery("string"==typeof t?"?"===Y(t,0)?$(t,1):t:A(t)))};ut.prototype={type:P,bindURL:function(t){this.url=t,this.update()},parseObject:function(t){var e,n,r,o,a,s,c,l=x(t);if(l)for(n=(e=S(t,l)).next;!(r=i(n,e)).done;){if(a=(o=S(b(r.value))).next,(s=i(a,o)).done||(c=i(a,o)).done||!i(a,o).done)throw F("Expected sequence with length 2");G(this.entries,{key:A(s.value),value:A(c.value)})}else for(var u in t)m(t,u)&&G(this.entries,{key:u,value:A(t[u])})},parseQuery:function(t){if(t)for(var e,n,r=X(t,"&"),o=0;o0?arguments[0]:void 0;T(this,new ut(t))},pt=ft.prototype;if(u(pt,{append:function(t,e){k(arguments.length,2);var n=N(this);G(n.entries,{key:A(t),value:A(e)}),n.updateURL()},delete:function(t){k(arguments.length,1);for(var e=N(this),n=e.entries,r=A(t),o=0;oe.key?1:-1})),t.updateURL()},forEach:function(t){for(var e,n=N(this).entries,r=v(t,arguments.length>1?arguments[1]:void 0),o=0;o1?yt(arguments[1]):{})}}),y(q)){var mt=function(t){return h(this,U),new q(t,arguments.length>1?yt(arguments[1]):{})};U.constructor=mt,mt.prototype=U,r({global:!0,constructor:!0,dontCallGetSet:!0,forced:!0},{Request:mt})}}t.exports={URLSearchParams:ft,getState:N}},function(t,e,n){var r=n(7),o=n(5),i=n(25),a=o("iterator");t.exports=!r((function(){var t=new URL("b?a=1&b=2&c=3","http://a"),e=t.searchParams,n="";return t.pathname="c%20d",e.forEach((function(t,r){e.delete("b"),n+=r+t})),i&&!t.toJSON||!e.sort||"http://a/c%20d?a=1&c=3"!==t.href||"3"!==e.get("c")||"a=1"!==String(new URLSearchParams("?a=1"))||!e[a]||"a"!==new URL("https://a@b").username||"b"!==new URLSearchParams(new URLSearchParams("a=b")).get("a")||"xn--e1aybc"!==new URL("http://тест").host||"#%D0%B1"!==new URL("http://a#б").hash||"a1c3"!==n||"x"!==new URL("http://x",void 0).host}))},function(t,e,n){var r=n(31);t.exports=function(t,e,n){for(var o in e)r(t,o,e[o],n);return t}},function(t,e,n){var r=n(210),o=Math.floor,i=function(t,e){for(var n,r,o=t.length,i=1;i0;)t[r]=t[--r];r!==i++&&(t[r]=n)}return t},a=function(t,e,n,r){for(var o=e.length,i=n.length,a=0,s=0;aa?i:a}var s=r,c=o},function(t,e,n){"use strict";n.d(e,{R:function(){return f}});var r=n(58),o=n(40);function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}function a(t){return function(t){if(Array.isArray(t))return l(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||c(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function s(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=c(t))||e&&t&&"number"==typeof t.length){n&&(t=n);var r=0,o=function(){};return{s:o,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,a=!0,s=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return a=t.done,t},e:function(t){s=!0,i=t},f:function(){try{a||null==n.return||n.return()}finally{if(s)throw i}}}}function c(t,e){if(t){if("string"==typeof t)return l(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?l(t,e):void 0}}function l(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n1)for(var e,n=0,r=t.substr(1).split("&");n1?unescape(e[1]):""}(window.location.search)},pushPattern:function(t,e){var n=r.getFileName(t),o=window.location.pathname;if(o="file"===window.location.protocol?o.replace("/public/index.html","public/"):o.replace(/\/index\.html/,"/"),e!==window.location.protocol+"//"+window.location.host+o+n){var i=JSON.stringify({event:"patternLab.updatePath",path:n});document.querySelector(".pl-js-iframe").contentWindow.postMessage(i,r.targetOrigin)}},popPattern:function(t){var e,n=t.state;if(null!==n){null!==n&&(e=n.currentPattern);var o="";""===(o=this.getFileName(e))&&(o="styleguide/html/styleguide.html");var i=JSON.stringify({event:"patternLab.updatePath",path:o});document.querySelector(".pl-js-iframe").contentWindow.postMessage(i,r.targetOrigin)}else this.skipBack=!1}};window.onpopstate=function(){r.skipBack=!0}},function(t,e,n){"use strict";n.d(e,{U:function(){return o}});var r=n(62),o=new(n.n(r)())},function(t,e,n){"use strict";"file:"===window.location.protocol||(window.location.protocol,window.location.host)},function(t,e,n){"use strict";n.d(e,{s:function(){return o}});var r=n(26),o="";if(window.config){o=void 0!==window.config.defaultPattern&&"string"==typeof window.config.defaultPattern&&window.config.defaultPattern.trim().length>0?window.config.defaultPattern:"all";var i=r.I.getRequestVars();void 0===i.p&&void 0===i.pattern||(o=void 0!==i.p?i.p:i.pattern)}},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}!function(t,e){"use strict";if(!(e in t)){var o,i=(void 0===n.g?"undefined":r(n.g))===r(i)?window:n.g,a=0,s=String(Math.random()),c="__symbol:",l=c.length,u="__symbol@@"+s,f="defineProperty",p="defineProperties",d="getOwnPropertyNames",h="getOwnPropertyDescriptor",y="propertyIsEnumerable",m=t[d],v=t[h],g=t.create,b=t.keys,_=t.freeze||t,A=t[f],w=t[p],C=v(t,d),S=t.prototype,x=S.hasOwnProperty,k=S[y],E=S.toString,O=function(t,e,n){x.call(t,u)||A(t,u,{enumerable:!1,configurable:!1,writable:!1,value:{}}),t[u]["@@"+e]=n},B=function(t,e){var n=g(t);return m(e).forEach((function(t){N.call(e,t)&&I(n,t,e[t])})),n},P=function(){},j=function(t){return t!=u&&!x.call(R,t)},T=function(t){return t!=u&&x.call(R,t)},N=function(t){var e=String(t);return T(e)?x.call(this,e)&&!!this[u]&&this[u]["@@"+e]:k.call(this,t)},M=function(e){return A(S,e,{enumerable:!1,configurable:!0,get:P,set:function(t){o(this,e,{enumerable:!1,configurable:!0,writable:!0,value:t}),O(this,e,!0)}}),R[e]=A(t(e),"constructor",D),_(R[e])},L=function t(e){if(this instanceof t)throw new TypeError("Symbol is not a constructor");return M(c.concat(e||"",s,++a))},R=g(null),D={value:L},q=function(t){return R[t]},I=function(t,e,n){var r=String(e);return T(r)?(o(t,r,n.enumerable?function(t){var e=g(t);return e.enumerable=!1,e}(n):n),O(t,r,!!n.enumerable)):A(t,e,n),t},U=function(t){return m(t).filter(T).map(q)};C.value=I,A(t,f,C),C.value=U,A(t,e,C),C.value=function(t){return m(t).filter(j)},A(t,d,C),C.value=function(t,e){var n=U(e);return n.length?b(e).concat(n).forEach((function(n){N.call(e,n)&&I(t,n,e[n])})):w(t,e),t},A(t,p,C),C.value=N,A(S,y,C),C.value=L,A(i,"Symbol",C),C.value=function(t){var e=c.concat(c,t,s);return e in S?R[e]:M(e)},A(L,"for",C),C.value=function(t){if(j(t))throw new TypeError(t+" is not a symbol");if(x.call(R,t)){var e=t.slice(l);if(e.slice(0,l)===c&&(e=e.slice(l))!==s)return(e=e.slice(0,e.length-s.length)).length>0?e:void 0}},A(L,"keyFor",C),C.value=function(t,e){var n=v(t,e);return n&&T(e)&&(n.enumerable=N.call(t,e)),n},A(t,h,C),C.value=function(t,e){return 1===arguments.length||void 0===e?g(t):B(t,e)},A(t,"create",C),C.value=function(){var t=E.call(this);return"[object String]"===t&&T(this)?"[object Symbol]":t},A(S,"toString",C);try{if(!0!==g(A({},c,{get:function(){return A(this,c,{value:!0})[c]}}))[c])throw"IE11";o=A}catch(z){o=function(t,e,n){var r=v(S,e);delete S[e],A(t,e,n),A(S,e,r)}}}}(Object,"getOwnPropertySymbols"),function(t,e){"use strict";var n,r=t.defineProperty,o=t.prototype,i=o.toString,a="toStringTag";["iterator","match","replace","search","split","hasInstance","isConcatSpreadable","unscopables","species","toPrimitive",a].forEach((function(s){s in e||(r(e,s,{value:e(s)}),s===a&&((n=t.getOwnPropertyDescriptor(o,"toString")).value=function(){var t=i.call(this),n=null==this?this:this[e.toStringTag];return null==n?t:"[object "+n+"]"},r(o,"toString",n)))}))}(Object,Symbol),function(t,e,n){function r(){return this}e[t]||(e[t]=function(){var e=0,n=this,o={next:function(){var t=n.length<=e;return t?{done:t}:{done:t,value:n[e++]}}};return o[t]=r,o}),n[t]||(n[t]=function(){var e=String.fromCodePoint,n=this,o=0,i=n.length,a={next:function(){var t=i<=o,r=t?"":e(n.codePointAt(o));return o+=r.length,t?{done:t}:{done:t,value:r}}};return a[t]=r,a})}(Symbol.iterator,Array.prototype,String.prototype),t.exports=Object.getOwnPropertySymbols},function(t,e,n){function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}(function(){"use strict";var t;function e(t){var e=0;return function(){return e\x20\t\r\n\f]+)/i.exec(e)||["",""])[1].toLowerCase()];if(n)for(var r=0;r"+e+"";for(g.body.innerHTML=e,t.bootstrap(g);this.content.firstChild;)c.call(this.content,this.content.firstChild);if(e=g.body,n)for(r=0;r"+this.innerHTML+""},set:function(t){if(!this.parentNode)throw Error("Failed to set the 'outerHTML' property on 'Element': This element has no parent node.");for(g.body.innerHTML=t,t=this.ownerDocument.createDocumentFragment();g.body.firstChild;)l.call(t,g.body.firstChild);u.call(this.parentNode,t,this)},configurable:!0})};S(t.prototype),x(t.prototype),t.bootstrap=function(n){for(var r,o=0,i=(n=e(n,"template")).length;o]/g,O=function(t){switch(t){case"&":return"&";case"<":return"<";case">":return">";case'"':return""";case" ":return" "}},B=(_=function(t){for(var e={},n=0;n";break t;case Node.TEXT_NODE:c=c.data,c=l&&P[l.localName]?c:c.replace(E,O);break t;case Node.COMMENT_NODE:c="\x3c!--"+c.data+"--\x3e";break t;default:throw window.console.error(c),Error("not implemented")}}o+=c}return o}}if(n||v){t.va=function(t,e){var n=i.call(t,!1);return this.Z&&this.Z(n),e&&(l.call(n.content,i.call(t.content,!0)),T(n.content,t.content)),n};var T=function(n,r){if(r.querySelectorAll&&0!==(r=e(r,"template")).length)for(var o,i,a=0,s=(n=e(n,"template")).length;a]/g;function Ke(t){switch(t){case"&":return"&";case"<":return"<";case">":return">";case'"':return""";case" ":return" "}}function Je(t){for(var e={},n=0;n";break t;case Node.TEXT_NODE:s=s.data,s=c&&Xe[c.localName]?s:s.replace(Ge,Ke);break t;case Node.COMMENT_NODE:s="\x3c!--"+s.data+"--\x3e";break t;default:throw window.console.error(s),Error("not implemented")}}n+=s}return n}var tn=ye.D,en={querySelector:function(t){return this.__shady_native_querySelector(t)},querySelectorAll:function(t){return this.__shady_native_querySelectorAll(t)}},nn={};function rn(t){nn[t]=function(e){return e["__shady_native_"+t]}}function on(t,e){for(var n in Le(t,e,"__shady_native_"),e)rn(n)}function an(t,e){e=void 0===e?[]:e;for(var n=0;n","+","~"]),s=a===o?t[o]:t.substring(o,a);","===s?e():-1!==[void 0," ",">","+","~"].indexOf(i)&&" "===s||(" "===i&&-1!==[">","+","~"].indexOf(s)?r[r.length-1]=s:r.push(s)),o=a+(a===o?1:0)}return e(),n}(e);if(1>r.length)return[];for(e=ze(gr(t,(function(){return!0})).map((function(t){return ze(r.map((function(e){var r=e.La,o=r.length-1;return n(t,r[o])?{target:t,da:e,fa:t,index:o}:[]})))})));e.some((function(t){return 0=t.index)return t;var e=t.target,r=t.fa,o=t.da;t=t.index-1;var i=o.Za[t],a=o.La[t];if(" "===i){for(i=[],r=r.__shady_parentElement;r;r=r.__shady_parentElement)n(r,a)&&i.push({target:e,da:o,fa:r,index:t});return i}if(">"===i)return n(r=r.__shady_parentElement,a)?{target:e,da:o,fa:r,index:t}:[];if("+"===i)return(r=r.__shady_previousElementSibling)&&n(r,a)?{target:e,da:o,fa:r,index:t}:[];if("~"===i){for(i=[],r=r.__shady_previousElementSibling;r;r=r.__shady_previousElementSibling)n(r,a)&&i.push({target:e,da:o,fa:r,index:t});return i}throw Error("Unrecognized combinator: '"+i+"'.")})));return function(t){for(var e=[],n=new Set,r=(t=l(t)).next();!r.done;r=t.next())r=r.value,n.has(r)||(e.push(r),n.add(r));return e}(e.map((function(t){return t.target})))}var Cr=ye.querySelectorImplementation,Sr=De({querySelector:function(t){if("native"===Cr){for(var e=Array.prototype.slice.call((this instanceof ShadowRoot?this.host:this).__shady_native_querySelectorAll(t)),n=this.__shady_getRootNode(),r=(e=l(e)).next();!r.done;r=e.next())if((r=r.value).__shady_getRootNode()==n)return r;return null}if("selectorEngine"===Cr)return wr(this,t)[0]||null;if(void 0===Cr)return gr(this,(function(e){return Se.call(e,t)}),(function(t){return!!t}))[0]||null;throw Error("Unrecognized value of ShadyDOM.querySelectorImplementation: '"+Cr+"'")},querySelectorAll:function(t,e){if(e||"native"===Cr){e=Array.prototype.slice.call((this instanceof ShadowRoot?this.host:this).__shady_native_querySelectorAll(t));var n=this.__shady_getRootNode();return je(e.filter((function(t){return t.__shady_getRootNode()==n})))}if("selectorEngine"===Cr)return je(wr(this,t));if(void 0===Cr)return je(gr(this,(function(e){return Se.call(e,t)})));throw Error("Unrecognized value of ShadyDOM.querySelectorImplementation: '"+Cr+"'")}}),xr=ye.ha&&!ye.J?qe({},Ar):Ar;qe(Ar,Sr);var kr=De({after:function(t){for(var e=[],n=0;no.assignedNodes.length&&(o.Aa=!0)}o.Aa&&(o.Aa=!1,fo(this,e))}for(e=this.g,n=[],o=0;on.indexOf(r))||n.push(r);for(e=0;e "+e})))}return{value:t,Ya:e,stop:i}}(i,o,e,n),r=r||t.stop,o=t.Ya,i=t.value),o+i})),i&&(t=function(t,e){var n=t.split("");return e.reduce((function(t,e,r){return t+e+n[r+1]}),n[0])}(t,a)),o&&(t=Ra(t)),t.replace(Wa,(function(t,e,n,r){return'[dir="'+n+'"] '+e+r+", "+e+'[dir="'+n+'"]'+r}))},Oa.prototype.i=function(t){return t.match(":host")?"":t.match("::slotted")?this.h(t,":not(.style-scope)"):Da(t.trim(),":not(.style-scope)")},a.Object.defineProperties(Oa.prototype,{g:{configurable:!0,enumerable:!0,get:function(){return"style-scope"}}});var Ia=/:(nth[-\w]+)\(([^)]+)\)/,Ua=/(^|[\s>+~]+)((?:\[.+?\]|[^\s>+~=[])+)/g,za=/[[.:#*]/,Ha=/^(::slotted)/,Fa=/(:host)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))/,Va=/(?:::slotted)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))/,Wa=/(.*):dir\((?:(ltr|rtl))\)(.*)/,Ya=/:(?:matches|any|-(?:webkit|moz)-any)/,Za=new Oa;function Ga(t,e,n,r,o){this.M=t||null,this.h=e||null,this.Ca=n||[],this.K=null,this.cssBuild=o||"",this.ja=r||"",this.g=this.L=this.R=null}function Ka(t){return t?t.__styleInfo:null}function Ja(t,e){return t.__styleInfo=e}function Qa(t){var e=this.matches||this.matchesSelector||this.mozMatchesSelector||this.msMatchesSelector||this.oMatchesSelector||this.webkitMatchesSelector;return e&&e.call(this,t)}Ga.prototype.i=function(){return this.M},Ga.prototype._getStyleRules=Ga.prototype.i;var Xa=/:host\s*>\s*/,$a=navigator.userAgent.match("Trident");function ts(){}function es(t){if(!t.F){var e={},n={};ns(t,n)&&(e.P=n,t.rules=null),e.cssText=t.parsedCssText.replace(ua,"").replace(ia,""),t.F=e}}function ns(t,e){var n=t.F;if(!n){n=t.parsedCssText;for(var r;t=ia.exec(n);)"inherit"===(r=(t[2]||t[3]).trim())&&"unset"===r||(e[t[1].trim()]=r),r=!0;return r}if(n.P)return Object.assign(e,n.P),!0}function rs(t,e,n){return e&&(e=0<=e.indexOf(";")?os(t,e,n):Aa(e,(function(e,r,o,i){return r?((r=rs(t,n[r],n))&&"initial"!==r?"apply-shim-inherit"===r&&(r="inherit"):r=rs(t,n[o]||o,n)||o,e+(r||"")+i):e+i}))),e&&e.trim()||""}function os(t,e,n){e=e.split(";");for(var r,o,i=0;i *."+o||-1!==i.indexOf("html"))&&0===i.indexOf(o)),(a||s)&&(n=o,s&&(e.G||(e.G=La(Za,e,Za.h,t?"."+t:"",o)),n=e.G||o),a&&"html"===o&&(n=e.G||e.O),r({Ea:n,gb:s,vb:a}))}}(t,e,n,(function(n){Qa.call(t._element||t,n.Ea)&&(n.gb?ns(e,r):ns(e,o))}))}),null,!0),{mb:o,eb:r}}function as(t,e,n,r){var o=Sa(e),i=Ma(o.is,o.ja),a=new RegExp("(?:^|[^.#[:])"+(e.extends?"\\"+i.slice(0,-1)+"\\]":i)+"($|[.:[\\s>+~])"),s=Ka(e);o=s.M,s=s.cssBuild;var c=function(t,e){t=t.h;var n={};if(!ea&&t)for(var r=0,o=t[r];r=l._useCount&&l.parentNode&&l.parentNode.removeChild(l)),ea?c.g?(c.g.textContent=s,a=c.g):s&&(a=ma(s,i,t.shadowRoot,c.h)):a?a.parentNode||($a&&-1e&&-1==[34,35,60,62,63,96].indexOf(e)?t:encodeURIComponent(t)}function r(t){var e=t.charCodeAt(0);return 32e&&-1==[34,35,60,62,96].indexOf(e)?t:encodeURIComponent(t)}function o(t,o,a){function s(t){v.push(t)}var c=o||"scheme start",d=0,h="",y=!1,m=!1,v=[];t:for(;(null!=t[d-1]||0==d)&&!this.m;){var g=t[d];switch(c){case"scheme start":if(!g||!f.test(g)){if(o){s("Invalid scheme.");break t}h="",c="no scheme";continue}h+=g.toLowerCase(),c="scheme";break;case"scheme":if(g&&p.test(g))h+=g.toLowerCase();else{if(":"!=g){if(o){null!=g&&s("Code point not allowed in scheme: "+g);break t}h="",d=0,c="no scheme";continue}if(this.l=h,h="",o)break t;void 0!==l[this.l]&&(this.H=!0),c="file"==this.l?"relative":this.H&&a&&a.l==this.l?"relative or authority":this.H?"authority first slash":"scheme data"}break;case"scheme data":"?"==g?(this.A="?",c="query"):"#"==g?(this.C="#",c="fragment"):null!=g&&"\t"!=g&&"\n"!=g&&"\r"!=g&&(this.ya+=n(g));break;case"no scheme":if(a&&void 0!==l[a.l]){c="relative";continue}s("Missing scheme."),i.call(this),this.m=!0;break;case"relative or authority":if("/"!=g||"/"!=t[d+1]){s("Expected /, got: "+g),c="relative";continue}c="authority ignore slashes";break;case"relative":if(this.H=!0,"file"!=this.l&&(this.l=a.l),null==g){this.o=a.o,this.v=a.v,this.s=a.s.slice(),this.A=a.A,this.B=a.B,this.j=a.j;break t}if("/"==g||"\\"==g)"\\"==g&&s("\\ is an invalid code point."),c="relative slash";else if("?"==g)this.o=a.o,this.v=a.v,this.s=a.s.slice(),this.A="?",this.B=a.B,this.j=a.j,c="query";else{if("#"!=g){c=t[d+1];var b=t[d+2];("file"!=this.l||!f.test(g)||":"!=c&&"|"!=c||null!=b&&"/"!=b&&"\\"!=b&&"?"!=b&&"#"!=b)&&(this.o=a.o,this.v=a.v,this.B=a.B,this.j=a.j,this.s=a.s.slice(),this.s.pop()),c="relative path";continue}this.o=a.o,this.v=a.v,this.s=a.s.slice(),this.A=a.A,this.C="#",this.B=a.B,this.j=a.j,c="fragment"}break;case"relative slash":if("/"!=g&&"\\"!=g){"file"!=this.l&&(this.o=a.o,this.v=a.v,this.B=a.B,this.j=a.j),c="relative path";continue}"\\"==g&&s("\\ is an invalid code point."),c="file"==this.l?"file host":"authority ignore slashes";break;case"authority first slash":if("/"!=g){s("Expected '/', got: "+g),c="authority ignore slashes";continue}c="authority second slash";break;case"authority second slash":if(c="authority ignore slashes","/"!=g){s("Expected '/', got: "+g);continue}break;case"authority ignore slashes":if("/"!=g&&"\\"!=g){c="authority";continue}s("Expected authority, got: "+g);break;case"authority":if("@"==g){for(y&&(s("@ already seen."),h+="%40"),y=!0,g=0;gl;)c.call(t,a=s[l++])&&e.push(a);return e}},function(t,e,n){var r=n(102);t.exports=Object("z").propertyIsEnumerable(0)?Object:function(t){return"String"==r(t)?t.split(""):Object(t)}},function(t,e,n){var r=n(56),o=n(238),i=n(239);t.exports=function(t){return function(e,n,a){var s,c=r(e),l=o(c.length),u=i(a,l);if(t&&n!=n){for(;l>u;)if((s=c[u++])!=s)return!0}else for(;l>u;u++)if((t||u in c)&&c[u]===n)return t||u||0;return!t&&-1}}},function(t,e,n){var r=n(152),o=Math.min;t.exports=function(t){return t>0?o(r(t),9007199254740991):0}},function(t,e,n){var r=n(152),o=Math.max,i=Math.min;t.exports=function(t,e){return(t=r(t))<0?o(t+e,0):i(t,e)}},function(t,e){e.f=Object.getOwnPropertySymbols},function(t,e,n){var r=n(102);t.exports=Array.isArray||function(t){return"Array"==r(t)}},function(t,e,n){var r=n(151);t.exports=function(t){return Object(r(t))}},function(t,e,n){var r=n(76),o=n(244),i=n(103),a=n(153)("IE_PROTO"),s=function(){},c="prototype",l=function(){var t,e=n(149)("iframe"),r=i.length;for(e.style.display="none",n(245).appendChild(e),e.src="javascript:",(t=e.contentWindow.document).open(),t.write("