From 40be2ac9e13eafe797595029645280440c35a988 Mon Sep 17 00:00:00 2001 From: HerrHase Date: Mon, 6 Feb 2023 10:55:03 +0100 Subject: [PATCH] adding --- example/example.css | 14830 +---------------------------------------- example/example.js | 6766 +------------------ example/index.html | 4 +- example/spritemap.js | 14 +- src/mixin.js | 32 +- webpack.mix.js | 1 + 6 files changed, 84 insertions(+), 21563 deletions(-) diff --git a/example/example.css b/example/example.css index 7758d73..3a27e3f 100644 --- a/example/example.css +++ b/example/example.css @@ -1,14829 +1 @@ -@charset "UTF-8"; -@font-face { - font-family: "IBM Plex Mono"; - src: url("IBMPlexMono.eot"); - src: url("IBMPlexMono.eot?#iefix") format("embedded-opentype"), url("IBMPlexMono.woff2") format("woff2"), url("IBMPlexMono.woff") format("woff"), url("IBMPlexMono.ttf") format("truetype"); - font-weight: normal; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "IBM Plex Mono"; - src: url("IBMPlexMono-Bold.eot"); - src: url("IBMPlexMono-Bold.eot?#iefix") format("embedded-opentype"), url("IBMPlexMono-Bold.woff2") format("woff2"), url("IBMPlexMono-Bold.woff") format("woff"), url("IBMPlexMono-Bold.ttf") format("truetype"); - font-weight: bold; - font-style: normal; - font-display: swap; -} -/** - * functions - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * strip unit from value - * - * @param {mixed} $value - * @return {number} - * - */ -/** - * - * - * https://css-tricks.com/snippets/sass/str-replace-function/ - * - */ -/** - * get value of key "default" in map - * - * @param {map} $value - * @return {boolean|unit} - * - */ -/** - * factor - * - * - * - * @param {integer} $x - * @return {float} - * - */ -/** - * mixins - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * Clear Floats - * - * - * - */ -/** - * clear styles from list - * - * - */ -/** - * media-queries as mixins - * based on breakpoints from variables - * - * - * - */ -/** - * Set property and his value for each Breakpoint - * - * ( - * $md: 10px - * ) - * - * - * @param {css} $property - * @param {map} $breakpoints - * @param {Boolean} $important [false] - * - */ -/** - * Set property and his value with an factor for each Breakpoint - * - * ( - * $md: 10px - * ) - * - * @param {css} $property - * @param {number} $factor - * @param {map} $breakpoints - * @param {Boolean} $important [false] - * - */ -/** - * Set font-size from Breakpoints, use for calculating difference from font-size and default font-size - * - * ( - * $md: 1rem - * ) - * - * @param {map} $breakpoints - * @param {unit} $font-size - * @param {unit} $default - * @param {Boolean} $important [false] - * - */ -/** - * adding overlay with z-index and color - * - * @param {z-index} - * @param {color} - * - */ -/** - * variables - * - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * grid - * - */ -:root { - --grid-columns: 12; - --grid-grid-spacing: 15px; - --grid-xs: 576px; - --grid-sm: 768px; - --grid-md: 992px; - --grid-lg: 1200px; - --grid-xlg: 1600px; - --grid-xxs-max: 575px; - --grid-xs-max: 767px; - --grid-sm-max: 991px; - --grid-md-max: 1199px; - --grid-lg-max: 1599px; -} - -/** - * fonts - * - */ -/** - * colors - * - * - */ -/** - * margin - * - */ -/** - * padding - * - */ -/** - * border - * - */ -/** - * normalize - * - * Thanks to https://necolas.github.io/normalize.css/, use a lot from them - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -:root { - --body: #f9f9f9; - --text: #363636; - --text-contrast: #ffffff; - --primary: #3e3e3e; - --primary-contrast: #3e3e3e; - --active: #717171; - --active-contrast: #ffffff; - --link: #363636; - --link-hover: #d95959; - --danger: #d95959; - --danger-contrast: #ecacac; - --info: #0090d4; - --info-constrast: #3bc0ff; - --success: #64ac64; - --success-contrast: #a6d0a6; - --warning: #f0ad4e; - --warning-contrast: #f8d9ac; - --background: #3e3e3e; - --background-contrast: #ffffff; - --background-alpha: rgba(0, 0, 0, 0.7); - --border: #3e3e3e; - --border-contrast: #ffffff; - --font-family: IBM Plex Mono, sans-serif; -} - -html { - font-size: 100%; - line-height: 1.15; - -webkit-text-size-adjust: 100%; -} - -body, -html { - margin: 0; - height: 100%; -} - -html, -legend { - box-sizing: border-box; -} - -body { - font-family: var(--font-family); - color: var(--text); - background-color: var(--body); - direction: ltr; - font-size: 0.9rem; - line-height: 1.618; -} -@media only screen and (min-width: 992px) { - body { - font-size: 1rem; - } -} - -a { - color: var(--link); - transition: color 0.5s; - text-decoration: none; -} -a:hover { - color: var(--link-hover); -} -a:focus { - outline: none; -} - -main { - display: block; -} - -*, -*::after, -*::before { - box-sizing: inherit; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -figure { - margin: 0; -} - -figcaption { - margin: 0; -} - -p { - margin: 0; -} - -/** - * form elements - * - * - */ -button, -input, -optgroup, -select, -textarea { - margin: 0; -} - -fieldset { - margin: 0 0 1rem; -} - -button, -select { - text-transform: none; -} - -[type=button], -[type=reset], -[type=submit], -button { - -webkit-appearance: button; -} - -[type=button]::-moz-focus-inner, -[type=reset]::-moz-focus-inner, -[type=submit]::-moz-focus-inner, -button::-moz-focus-inner { - border-style: none; - padding: 0; -} - -[type=button]:-moz-focusring, -[type=reset]:-moz-focusring, -[type=submit]:-moz-focusring, -button:-moz-focusring { - outline: 1px dotted ButtonText; -} - -legend { - box-sizing: border-box; - display: table; - max-width: 100%; - padding: 0; - white-space: normal; -} - -[type=number]::-webkit-inner-spin-button, -[type=number]::-webkit-outer-spin-button { - height: auto; -} - -[type=search] { - -webkit-appearance: textfield; - outline-offset: -2px; -} - -[type=search]::-webkit-search-decoration { - -webkit-appearance: none; -} - -::-webkit-file-upload-button { - -webkit-appearance: button; - font: inherit; -} - -/** - * hr - * - */ -hr { - box-sizing: content-box; - height: 0; - overflow: visible; - border: 0; - border-top: 1px solid var(--border); - margin: 0 0 1rem; -} - -progress { - vertical-align: baseline; -} - -details { - display: block; -} - -summary { - display: list-item; -} - -code, -kbd, -pre, -samp { - font-family: var(--font-family); - font-size: 0.9rem; -} - -/** - * Content - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.content { - /** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - /** - * blockquote - * - * - */ - /** - * lists - * - */ -} -.content p { - margin: 0 0 1rem; -} -@media only screen and (min-width: 992px) { - .content p { - margin: 0 0 1.2rem; - } -} -.content a, -.content ins, -.content u { - -webkit-text-decoration-skip: ink edges; - text-decoration-skip: ink edges; -} -.content a { - text-decoration: underline; -} -.content b, -.content strong { - font-weight: bolder; -} -.content small { - font-size: 80%; -} -.content sub, -.content sup { - font-size: 70%; - line-height: 0; - position: relative; - vertical-align: baseline; -} -.content sub { - bottom: -0.25em; -} -.content sup { - top: -0.5em; -} -.content abbr[title] { - border-bottom: 1px dotted; - cursor: help; - text-decoration: none; -} -.content mark { - padding: 0.25rem; - background-color: var(--warning); -} -.content blockquote { - border-left: 1px solid var(--border); - margin-left: 0; - padding: 0.6rem 0.8rem; -} -.content blockquote p:last-child { - margin-bottom: 0; -} -.content dl, -.content ol, -.content ul { - padding: 0; - margin: 0 0 1rem; -} -@media only screen and (min-width: 992px) { - .content dl, - .content ol, - .content ul { - margin: 0 0 1.2rem; - } -} -.content ul { - margin-left: 1.5rem; -} -.content ol { - margin-left: 2.5rem; -} -.content ol ol, -.content ul ul { - margin-top: 0; - margin-left: 1.5rem; -} -.content ol { - list-style: decimal outside; -} -.content ul { - list-style: square outside; -} -.content dl { - margin-left: 0.5rem; -} -.content dd, -.content dt { - margin: 0; -} -.content dt { - font-weight: bold; -} -.content code { - white-space: pre; - display: block; - color: var(--text-contrast); - overflow-y: hidden; - overflow-x: auto; - border: 1px solid var(--border); - border-radius: 2px; - background-color: var(--background); - margin: 0 0 1rem; - padding: 0.6rem 0.8rem; -} -@media only screen and (min-width: 992px) { - .content code { - margin: 0 0 1.2rem; - } -} -@media only screen and (min-width: 992px) { - .content code { - padding: 0.7rem 1rem 0.9rem; - } -} - -.highlight { - padding: 0.15rem 0.4rem 0.25rem; - background: var(--primary); - color: var(--text-contrast); - border-radius: 2px; -} - -/** - * Heading - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * add font-size for heading as class and element - * - * - */ -h1, .h1, -h2, .h2, -h3, .h3, -h4, .h4, -h5, .h5, -h6, .h6 { - font-family: "IBM Plex Mono", sans-serif; - font-weight: bold; - line-height: 1.2; - margin: 0 0 1rem; -} -h1.highlight, .h1.highlight, -h2.highlight, .h2.highlight, -h3.highlight, .h3.highlight, -h4.highlight, .h4.highlight, -h5.highlight, .h5.highlight, -h6.highlight, .h6.highlight { - display: table; -} - -h1, .h1 { - font-size: 2.5rem; -} - -h2, .h2 { - font-size: 2rem; -} - -h3, .h3 { - font-size: 1.75rem; -} - -h4, .h4 { - font-size: 1.5rem; -} - -h5, .h5 { - font-size: 1.25rem; -} - -h6, .h6 { - font-size: 1rem; -} - -@media only screen and (min-width: 992px) { - h1, .h1 { - font-size: 2.75rem; - } - h2, .h2 { - font-size: 2.5rem; - } - h3, .h3 { - font-size: 2rem; - } - h4, .h4 { - font-size: 1.75rem; - } - h5, .h5 { - font-size: 1.5rem; - } - h6, .h6 { - font-size: 1.2rem; - } -} -/** - * - * A - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.badge { - display: inline-block; - background-color: var(--background); - color: var(--text-contrast); - font-size: 0.85rem; - padding: 0.4rem 0.8rem; - border: 1px solid var(--border); - border-radius: 2px; -} -.badge--round { - display: inline-flex; - justify-content: center; - border-radius: 50%; - width: 2.8em; -} - -/** - * Button - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * - * - */ -/** - * - * - */ -/** - * - * - */ -.button { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - position: relative; - display: inline-flex; - align-items: center; - text-decoration: none; - font-family: var(--font-family); - font-size: 1rem; - border: 1px solid var(--border); - background-color: var(--background-contrast); - color: var(--text); - border-radius: 2px; - transition: background-color 0.1s; - margin: 0 0 1rem; - padding: 0.5rem 1.3rem; - width: 100%; -} -@media only screen and (min-width: 768px) { - .button { - width: auto; - } -} -.button--small { - padding: 0.3rem 1.1rem; - font-size: 0.8rem; -} -.button:hover, .button--selected { - cursor: pointer; - text-decoration: none; - color: white; - background-color: var(--active); -} -.button:focus, .button:active { - outline: 1px solid var(--active); -} -.button:disabled { - opacity: 0.5; -} -.button:disabled:hover { - cursor: not-allowed; - border: 1px solid var(--border); - background-color: var(--background-contrast); - color: var(--border); -} -.button--transparent { - margin: 0; - padding: 0; - border: none; - background: transparent; - border-radius: 0; -} -.button--transparent:focus, .button--transparent:active { - outline: none; -} -.button--danger { - border-color: var(--danger); -} -.button--danger:hover { - background-color: var(--danger); -} -.button--danger:focus, .button--danger:active { - outline: 2px solid var(--danger); -} -.button--info { - border-color: var(--info); -} -.button--info:hover { - background-color: var(--info); -} -.button--info:focus, .button--info:active { - outline: 2px solid var(--info); -} -.button--warning { - border-color: var(--warning); -} -.button--warning:hover { - background-color: var(--warning); -} -.button--warning:focus, .button--warning:active { - outline: 2px solid var(--warning); -} -.button--success { - border-color: var(--success); -} -.button--success:hover { - background-color: var(--success); -} -.button--success:focus, .button--success:active { - outline: 2px solid var(--success); -} -.button--outline { - background-color: transparent; -} -.button--outline:hover { - color: var(--border); - border-color: #a4a4a4; - background-color: transparent; -} -.button--danger.button--outline:hover { - border-color: #ecacac; -} -.button--info.button--outline:hover { - border-color: #3bc0ff; -} -.button--warning.button--outline:hover { - border-color: #f8d9ac; -} -.button--success.button--outline:hover { - border-color: #a6d0a6; -} -.button--full { - background-color: var(--active); - color: white; -} -.button--full:hover { - background-color: var(--background-contrast); - color: var(--text); -} -.button--danger.button--full { - background-color: var(--danger); -} -.button--danger.button--full:hover { - background-color: var(--background-contrast); - border-color: var(--danger); -} -.button--danger.button--full:focus, .button--danger.button--full:active { - outline: 2px solid var(--danger); -} -.button--info.button--full { - background-color: var(--info); -} -.button--info.button--full:hover { - background-color: var(--background-contrast); - border-color: var(--info); -} -.button--info.button--full:focus, .button--info.button--full:active { - outline: 2px solid var(--info); -} -.button--warning.button--full { - background-color: var(--warning); -} -.button--warning.button--full:hover { - background-color: var(--background-contrast); - border-color: var(--warning); -} -.button--warning.button--full:focus, .button--warning.button--full:active { - outline: 2px solid var(--warning); -} -.button--success.button--full { - background-color: var(--success); -} -.button--success.button--full:hover { - background-color: var(--background-contrast); - border-color: var(--success); -} -.button--success.button--full:focus, .button--success.button--full:active { - outline: 2px solid var(--success); -} - -/** - * - * fields - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.field-group { - margin: 0 0 1rem; -} -.field-group--valid .field-text { - border-color: var(--success); -} -.field-group--valid .icon { - fill: var(--success); -} -.field-group--error .field-text { - border-color: var(--danger); -} -.field-group--error .icon { - fill: var(--danger); -} - -.field-label { - font-size: 1rem; - font-family: var(--font-family); -} -.field-label .icon { - vertical-align: text-bottom; -} -.field-label:hover { - cursor: pointer; -} - -.field-text, .field-choice { - font-family: var(--font-family); - font-size: 0.95rem; - width: 100%; - border: 1px solid #a4a4a4; - border-radius: 2px; - margin: 0.7rem 0 0; -} -.field-text:focus, .field-text:active, .field-choice:focus, .field-choice:active { - outline: 0; - border-color: var(--border); -} - -.field-text { - padding: 0.8em 1.1em; -} - -textarea.field-text { - height: 180px; -} - -/** - * field-choice - * - * - */ -.field-choice { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - padding: 0.8em; - background-image: linear-gradient(to right, #717171, #717171); - background-position: 100%; - background-size: 1.5rem 100%; - background-repeat: no-repeat; -} -.field-choice:active, .field-choice:focus { - background-image: linear-gradient(to right, #3e3e3e, #3e3e3e); -} - -/** - * radio & checkbox - * - *
- * - *
- * - */ -[type=checkbox].field-choice, -[type=radio].field-choice { - position: relative; - display: none; -} -[type=checkbox].field-choice ~ .field-choice__checked, -[type=radio].field-choice ~ .field-choice__checked { - display: none; -} -[type=checkbox].field-choice:checked ~ .field-choice__checked, -[type=radio].field-choice:checked ~ .field-choice__checked { - display: inline-block; -} -[type=checkbox].field-choice:checked ~ .field-choice__unchecked, -[type=radio].field-choice:checked ~ .field-choice__unchecked { - display: none; -} - -svg.field-choice__unchecked { - fill: var(--active); -} - -svg.field-choice__checked { - fill: var(--success); -} - -.field-help, .field-error { - display: inline-block; - width: 100%; - padding: 0.6em 0.5em; - font-size: 0.8rem; -} - -/** - * - * - */ -.field-switch { - position: relative; - display: inline-block; - width: 75px; - height: 35px; - border: 1px solid var(--border); - border-radius: 2px; -} -.field-switch:after { - position: absolute; - top: 0; - left: 0; - width: 50%; - height: 100%; - content: ""; - border: 1px solid var(--border); - border-color: var(--border-contrast); - border-radius: 2px; - background-color: var(--active); - transition: transform 0.25s; -} - -[type=checkbox].field-choice ~ .field-switch:after { - left: 0; -} -[type=checkbox].field-choice:checked ~ .field-switch { - border-color: var(--success); -} -[type=checkbox].field-choice:checked ~ .field-switch:after { - background-color: var(--success); - transform: translateX(100%); -} - -/** - * display error for fields - * - */ -.field-error { - color: var(--danger); -} - -/** - * - *
- * - * A - * - *
- * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.group__item { - width: auto; - display: inline-block; - margin: 0 0 1rem; - margin-right: 0.25rem; -} -.group__item:last-child { - margin-right: 0; -} - -/** - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.icon { - width: 1em; - height: 1em; - max-height: 100%; - max-width: 100%; - vertical-align: middle; - overflow: hidden; - font-size: 1.4rem; - fill: var(--text); -} - -/** - *
- * image - *
- * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.hero { - position: relative; -} -.hero img { - width: 100%; - -o-object-fit: cover; - object-fit: cover; - -o-object-position: 50% 50%; - object-position: 50% 50%; -} - -/** - * - * tabs - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.tabs { - display: flex; - flex-direction: column; - width: 100%; - border-bottom: 1px solid var(--border); -} -@media only screen and (min-width: 768px) { - .tabs { - width: auto; - flex-direction: row; - } -} -.tabs__item { - min-height: 2.8em; - display: flex; - align-items: center; - padding: 0 1em; - color: var(--text); - transition: background-color 0.1s; - border-bottom: 3px solid transparent; - background-color: transparent; - width: 100%; -} -@media only screen and (min-width: 768px) { - .tabs__item { - width: auto; - display: inline-flex; - } -} -.tabs__item:hover { - cursor: pointer; - background-color: var(--active); - color: var(--text-contrast); - border-top-left-radius: 2px; - border-top-right-radius: 2px; -} -.tabs__item--selected { - color: var(--text); - border-color: var(--border); -} -.tabs--contrast { - border: 0; -} -.tabs--contrast .tabs__item { - color: var(--text-contrast); -} -.tabs--contrast .tabs__item:hover { - background-color: var(--background-contrast); - color: var(--text); - border-radius: 0; -} -.tabs--contrast .tabs__item--selected { - border-color: var(--border-contrast); -} -.tabs--contrast .tabs__item--selected:hover { - border-color: var(--active); -} - -/** - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.panel, .sidebar__inner { - border: 1px solid var(--border); - border-radius: 2px; - background-color: var(--background-contrast); -} -.panel__body, .sidebar__body { - padding: 0.6rem 0.8rem; -} -@media only screen and (min-width: 992px) { - .panel__body, .sidebar__body { - padding: 0.7rem 1rem 0.9rem; - } -} -.panel--border-highlight { - border-left-width: 12px; -} - -/** - *
- *
- *
- * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.progress { - height: 40px; - width: 100%; - border: 1px solid var(--border); -} -.progress__inner { - height: 100%; - border: 1px solid var(--background-contrast); - background-color: var(--background); -} - -/** - *
- * - *
- * food truck yr franzen pabst - *
- *
- * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.figure { - margin: 0; - display: inline-block; - line-height: 0; - border: 1px solid var(--border); - border-radius: 2px; - overflow: hidden; -} -.figure__caption { - padding: 0.75em 1.1em; - font-size: 0.7rem; - background: var(--background); - line-height: 1.618; - margin: 0; - color: var(--text-contrast); - border-top: 1px solid var(--border-contrast); -} -.figure .media { - border: 0; - border-radius: 0; -} - -.media { - border-radius: 2px; - border: 1px solid var(--border); - width: 100%; - height: auto; -} - -/** - * - * table - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.table { - width: 100%; - border: 1px solid var(--border); - background: var(--white); -} -.table--scroll { - overflow-x: auto; -} -.table__td { - color: var(--text); -} -.table__td, .table__th { - text-align: left; - border-bottom: 1px solid var(--border); - padding: 0.25em 0.75em; -} -@media only screen and (min-width: 992px) { - .table__td, .table__th { - padding: 0.5em 1.25em; - } -} -.table__th { - color: white; - background-color: var(--background); -} -.table--striped .table__tr:nth-child(even) .table__td { - background-color: #e4e4e4; -} -.table--hover .table__tr:hover .table__td { - color: white; - background-color: #585858; -} - -/** - *
- *
- *
- *
- *
- *
- *
- *
- * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.bar { - display: flex; - min-height: 2.8em; - background-color: var(--background); - color: var(--text-contrast); - border: 1px solid var(--border); - border-radius: 2px; -} -.bar__start { - justify-content: start; -} -.bar__main { - flex-grow: 1; -} -.bar__end { - justify-content: end; -} -.bar__start, .bar__main, .bar__end { - display: flex; - align-self: center; - align-items: center; - margin-left: 0.75em; -} -.bar__start:last-child, .bar__main:last-child, .bar__end:last-child { - margin-right: 0.75em; -} - -/** - *
- * - *
- * food truck yr franzen pabst - *
- *
- * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.modal { - position: fixed; - width: 100%; - height: 100%; - top: 0; - left: 0; - display: flex; - visibility: hidden; - transition: visibility 0s linear 0.5s; - padding: 1rem; - z-index: 20; - align-items: center; - justify-content: center; -} -.modal:before { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: transparent; - transition: background-color 0.5s; - z-index: 19; - content: ""; - transition: background-color 0.5s; -} -.modal__inner { - position: relative; - z-index: 21; - transition: transform 0.5s; - transform: scale(0); - max-width: 600px; - width: 100%; -} -.modal__title { - font-size: 2rem; - text-align: center; - white-space: pre-line; - margin-bottom: 2rem; -} -.modal__title .icon { - font-size: 3rem; -} -.modal__title, .modal__body { - color: var(--text-contrast); -} -.modal__body { - margin-bottom: 1.5rem; -} -.modal .button { - color: var(--text-contrast); -} -.modal--open { - display: flex; - visibility: visible; - transition: visibility 0s linear 0s; -} -.modal--open:before { - background-color: var(--background-alpha); -} -.modal--open .modal__inner { - transform: scale(1); -} - -/** - *
- * - * - * - *
- * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.loading { - height: 60px; - width: 47px; - margin: 0 auto; - display: flex; - align-items: center; -} -.loading span { - display: block; - width: 15px; - height: 80px; - background-color: var(--background); - animation-name: loading-animation; - animation-duration: 0.5s; - animation-iteration-count: infinite; - animation-delay: 0.15s; - border-top: 1px solid var(--background); - border-bottom: 1px solid var(--background); -} -.loading span:first-child { - margin-right: 1px; - animation-delay: 0s; -} -.loading span:last-child { - margin-left: 1px; - animation-delay: 0.3s; -} - -@keyframes loading-animation { - 0% { - height: 60px; - } - 50% { - height: 40px; - } - 100% { - height: 60px; - } -} -/** - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.sidebar { - position: fixed; - z-index: 9; - top: 0; - left: 0; - width: 100%; - height: 100%; - max-width: 95%; - visibility: hidden; - transition: visibility 0s linear 0.5s; -} -.sidebar:before { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: transparent; - transition: background-color 0.5s; - z-index: 9; - content: ""; - transition: background-color 0.5s; -} -.sidebar__inner { - position: relative; - height: 100%; - z-index: 10; - transition: transform 0.2s; - transform: translateX(-100%); -} -.sidebar__footer { - position: fixed; - left: 0; - bottom: 0; - display: flex; - justify-content: space-between; - background: var(--background); - width: 100%; - padding: 1rem; -} -.sidebar--open { - visibility: visible; - transition: visibility 0s linear 0s; -} -.sidebar--open .sidebar__inner { - transform: translateX(0); -} -.sidebar--open:before { - background: var(--background-alpha); -} -@media only screen and (min-width: 992px) { - .sidebar { - max-width: 33%; - } -} - -/** - *
- *
- *
- * - *
- *
- * - *
- *
- * - *
- *
- *
- * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.toast { - display: flex; - background: var(--background); - border: 1px solid var(--border); - max-width: 800px; - width: -moz-max-content; - width: max-content; - margin-top: 1.25rem; - position: relative; - left: calc(-100% - 2rem); - transition: left 0.1s; - pointer-events: auto; -} -.toast--animation { - left: 0; -} -.toast__body { - width: 100%; - padding: 1em 1.25em; -} -.toast__button { - border: 0; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - background: var(--background); -} -.toast__button:hover { - cursor: pointer; -} -.toast__body, .toast__button { - color: var(--text-contrast); -} -.toast__icon, .toast__button { - display: flex; - align-self: stretch; - align-items: center; - padding: 0 1em; -} -.toast__icon svg, .toast__button svg { - font-size: 2rem; -} -.toast--danger { - background: var(--danger); -} -.toast--danger .toast__button { - background: var(--danger); -} -.toast--info { - background: var(--info); -} -.toast--info .toast__button { - background: var(--info); -} -.toast--success { - background: var(--success); -} -.toast--success .toast__button { - background: var(--success); -} -.toast--warning { - background: var(--warning); -} -.toast--warning .toast__button { - background: var(--warning); -} -.toast-wrapper { - position: fixed; - left: 0; - bottom: 0; - margin: 2rem; - z-index: 30; - pointer-events: none; -} -.toast-wrapper--right { - left: inherit; - right: 0; -} -.toast-wrapper--right .toast { - left: inherit; - right: calc(-100% - 2rem); - transition: right 0.1s; -} -.toast-wrapper--right .toast--animation { - left: inherit; - right: 0; -} -.toast-wrapper--top { - bottom: inherit; - top: 0; -} - -/** - * masonry - * - *
- *
- * - *
- *
- * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.masonry { - display: flex; - width: 100%; - flex-flow: row wrap; - gap: 15px; -} -.masonry__item { - width: 100%; - height: 200px; -} -@media only screen and (min-width: 768px) { - .masonry__item { - height: 300px; - } - .masonry__item:nth-child(4n+1) { - width: calc(25% - 10px); - } - .masonry__item:nth-child(4n+2) { - width: calc(55% - 10px); - } - .masonry__item:nth-child(4n+3) { - width: calc(20% - 10px); - } - .masonry__item:nth-child(4n+4) { - width: calc(67% - 10px); - } - .masonry__item:nth-child(4n+5) { - width: calc(33% - 10px); - } -} - -/** - * slider - * - *
- *
- *
- *
- *
- * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.slider { - position: relative; - overflow-x: visible; -} -.slider__inner { - display: flex; - white-space: nowrap; -} -.slider__item { - padding: 0 0.6em; - display: inline-block; - white-space: normal; - flex-shrink: 0; -} - -/** - * grid - * - * This Grid is mainly the Reflex Grid from Lee Gordon https://reflexgrid.com/, he has - * done a great work, for i few changes it was needed to integrated - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * grid: mixin - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * order class generation mixins - * - */ -/** - * offset class generation mixins - * - */ -/** - * modifier mixins - * - */ -/** - * justify-content - * - * Uses "text-align" for the fallback inline-block grid - * "text-align" is globally supported and works on all rows except the last - * "text-align-last", where supported, handles the last line (and, happily, grids with only one row) - * - */ -/** - * Responsible Visibility - * - */ -/** - * Breakpoint viewport sizes and media queries - * - * Breakpoints are defined as a map of (name: minimum width), order from small to large: - * (xs: 576px, sm: 768px, md: 992px) - * The map defined in the `$reflex-breakpoints` global variable is used as the `$breakpoints` argument by default. - * Name of the next breakpoint, or null for the last breakpoint. - * >> breakpoint-next(sm) -> md - * >> breakpoint-next(sm, $breakpoints: (xs: 576px, sm: 768px, md: 992px)) -> md - * >> breakpoint-next(sm, $breakpoint-names: (xs sm md)) -> md - * - */ -/** - * Minimum breakpoint width. Null for the smallest (first) breakpoint. - * breakpoint-min(sm, (xs: 576px, sm: 768px, md: 992px)) -> 768px - * - */ -/** - * Media of at most the maximum breakpoint width. No query for the largest breakpoint. - * Makes the @content apply to the given breakpoint and narrower. - * - */ -/** - * Media between the breakpoint's minimum and maximum widths. - * No minimum for the smallest breakpoint, and no maximum for the largest one. - * Makes the @content apply only to the given breakpoint, not viewports any wider or narrower. - * - */ -/** - * grid: helpers - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.wrap { - flex-wrap: wrap; -} - -.no-wrap { - flex-wrap: nowrap; -} -.no-wrap [class*=col-] { - flex-shrink: 1; -} - -.wrap-reverse { - flex-wrap: wrap-reverse; -} - -/** - * flex-direction - * - */ -.direction-row { - flex-direction: row; -} - -.direction-row-reverse { - flex-direction: row-reverse; -} - -.direction-column { - flex-direction: column; -} - -.direction-column-reverse { - flex-direction: column-reverse; -} - -/** - * align items (cross axis) - * - */ -.align-start { - align-items: flex-start; -} - -.align-end { - align-items: flex-end; -} - -.align-center { - align-items: center; -} - -.align-baseline { - align-items: baseline; -} - -/** - * align content (cross axis) - * - */ -.align-content-start { - align-content: flex-start; -} - -.align-content-end { - align-content: flex-end; -} -.align-content-end [class*=col-] { - vertical-align: bottom; -} - -.align-content-center { - align-content: center; -} - -.align-content-space-between { - align-content: space-between; -} - -.align-content-space-around { - align-content: space-around; -} - -/** - * align-self - * - */ -.align-self-stretch { - align-self: stretch; -} - -.align-self-start { - align-self: flex-start; -} - -.align-self-end { - align-self: flex-end; - vertical-align: bottom; -} - -.align-self-center { - align-self: center; - vertical-align: middle; -} - -.align-self-baseline { - align-self: baseline; - vertical-align: baseline; -} - -/** - * justify-content (main axis) - * - */ -.justify-start { - justify-content: flex-start; -} - -.justify-end { - justify-content: flex-end; -} - -.justify-center { - justify-content: center; -} - -.justify-space-between { - justify-content: space-between; -} - -.justify-space-around { - justify-content: space-around; -} - -/** - * cosmetic grid modifiers - * - */ -.grid-bleed [class*=col-] { - padding: 0; -} - -/** - * col modifiers - * - */ -.col-grid { - display: flex; - flex-direction: column; -} -.col-grid.direction-row { - flex-direction: row; -} - -.col-bleed { - padding: 0; -} - -.col-bleed-x { - padding: 15px 0; -} - -.col-bleed-y { - padding: 0 15px; -} - -/** - * col-grid contents - * - */ -.flex-img { - display: block; - flex: 0 0 auto; - max-width: 100%; - height: auto; - width: 100%; -} - -.flex-footer { - width: 100%; - margin-top: auto; - margin-bottom: 0; -} -.flex-footer > :last-child { - margin-bottom: 0; -} - -/** - * Responsive visibility modifiers - * - */ -@media (min-width: 0px) and (max-width: 575px) { - .hidden-xxs { - display: none; - } -} - -@media (min-width: 576px) { - .hidden-xs-up { - display: none; - } -} - -@media (max-width: 767px) { - .hidden-xs-down { - display: none; - } -} - -@media (min-width: 576px) and (max-width: 767px) { - .hidden-xs { - display: none; - } -} - -@media (min-width: 768px) { - .hidden-sm-up { - display: none; - } -} - -@media (max-width: 991px) { - .hidden-sm-down { - display: none; - } -} - -@media (min-width: 768px) and (max-width: 991px) { - .hidden-sm { - display: none; - } -} - -@media (min-width: 992px) { - .hidden-md-up { - display: none; - } -} - -@media (max-width: 1199px) { - .hidden-md-down { - display: none; - } -} - -@media (min-width: 992px) and (max-width: 1199px) { - .hidden-md { - display: none; - } -} - -@media (min-width: 1200px) { - .hidden-lg-up { - display: none; - } -} - -@media (max-width: 1599px) { - .hidden-lg-down { - display: none; - } -} - -@media (min-width: 1200px) and (max-width: 1599px) { - .hidden-lg { - display: none; - } -} - -@media (min-width: 1600px) { - .hidden-xlg { - display: none; - } -} - -.container, -.container-full { - box-sizing: border-box; - width: 100%; - margin-right: auto; - margin-left: auto; - padding-right: 30px; - padding-left: 30px; -} -.container .grid, -.container-full .grid { - margin-right: -15px; - margin-left: -15px; -} - -@media (min-width: 576px) { - .container { - max-width: 576px; - } -} -@media (min-width: 768px) { - .container { - max-width: 768px; - } -} -@media (min-width: 992px) { - .container { - max-width: 992px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1200px; - } -} -@media (min-width: 1600px) { - .container { - max-width: 1600px; - } -} - -.grid { - display: block; - box-sizing: border-box; - display: flex; - flex-wrap: wrap; - padding: 0; - margin: 0 auto; - position: relative; - list-style-type: none; -} -.grid::after, .grid::before { - box-sizing: border-box; -} - -.col-item, .col-xs-auto, .col-sm-auto, .col-lg-auto, .col-xlg-auto, .col-auto, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 { - box-sizing: border-box; - position: relative; - width: 100%; - vertical-align: top; - padding: 15px; -} -.col-item::after, .col-xs-auto::after, .col-sm-auto::after, .col-lg-auto::after, .col-xlg-auto::after, .col-auto::after, .col-12::after, .col-11::after, .col-10::after, .col-9::after, .col-8::after, .col-7::after, .col-6::after, .col-5::after, .col-4::after, .col-3::after, .col-2::after, .col-1::after, .col-item::before, .col-xs-auto::before, .col-sm-auto::before, .col-lg-auto::before, .col-xlg-auto::before, .col-auto::before, .col-12::before, .col-11::before, .col-10::before, .col-9::before, .col-8::before, .col-7::before, .col-6::before, .col-5::before, .col-4::before, .col-3::before, .col-2::before, .col-1::before { - box-sizing: border-box; -} -.col-item .grid, .col-xs-auto .grid, .col-sm-auto .grid, .col-lg-auto .grid, .col-xlg-auto .grid, .col-auto .grid, .col-12 .grid, .col-11 .grid, .col-10 .grid, .col-9 .grid, .col-8 .grid, .col-7 .grid, .col-6 .grid, .col-5 .grid, .col-4 .grid, .col-3 .grid, .col-2 .grid, .col-1 .grid { - flex: 1 1 auto; - margin: -15px; -} - -/** - * grid generation - * - * - */ -.col-12 { - width: 100%; -} - -.col-11 { - width: 91.6666666667%; -} - -.col-10 { - width: 83.3333333333%; -} - -.col-9 { - width: 75%; -} - -.col-8 { - width: 66.6666666667%; -} - -.col-7 { - width: 58.3333333333%; -} - -.col-6 { - width: 50%; -} - -.col-5 { - width: 41.6666666667%; -} - -.col-4 { - width: 33.3333333333%; -} - -.col-3 { - width: 25%; -} - -.col-2 { - width: 16.6666666667%; -} - -.col-1 { - width: 8.3333333333%; -} - -@media (min-width: 576px) { - .col-xs-12 { - width: 100%; - } - .col-xs-11 { - width: 91.6666666667%; - } - .col-xs-10 { - width: 83.3333333333%; - } - .col-xs-9 { - width: 75%; - } - .col-xs-8 { - width: 66.6666666667%; - } - .col-xs-7 { - width: 58.3333333333%; - } - .col-xs-6 { - width: 50%; - } - .col-xs-5 { - width: 41.6666666667%; - } - .col-xs-4 { - width: 33.3333333333%; - } - .col-xs-3 { - width: 25%; - } - .col-xs-2 { - width: 16.6666666667%; - } - .col-xs-1 { - width: 8.3333333333%; - } -} -@media (min-width: 768px) { - .col-sm-12 { - width: 100%; - } - .col-sm-11 { - width: 91.6666666667%; - } - .col-sm-10 { - width: 83.3333333333%; - } - .col-sm-9 { - width: 75%; - } - .col-sm-8 { - width: 66.6666666667%; - } - .col-sm-7 { - width: 58.3333333333%; - } - .col-sm-6 { - width: 50%; - } - .col-sm-5 { - width: 41.6666666667%; - } - .col-sm-4 { - width: 33.3333333333%; - } - .col-sm-3 { - width: 25%; - } - .col-sm-2 { - width: 16.6666666667%; - } - .col-sm-1 { - width: 8.3333333333%; - } -} -@media (min-width: 992px) { - .col-md-12 { - width: 100%; - } - .col-md-11 { - width: 91.6666666667%; - } - .col-md-10 { - width: 83.3333333333%; - } - .col-md-9 { - width: 75%; - } - .col-md-8 { - width: 66.6666666667%; - } - .col-md-7 { - width: 58.3333333333%; - } - .col-md-6 { - width: 50%; - } - .col-md-5 { - width: 41.6666666667%; - } - .col-md-4 { - width: 33.3333333333%; - } - .col-md-3 { - width: 25%; - } - .col-md-2 { - width: 16.6666666667%; - } - .col-md-1 { - width: 8.3333333333%; - } -} -@media (min-width: 1200px) { - .col-lg-12 { - width: 100%; - } - .col-lg-11 { - width: 91.6666666667%; - } - .col-lg-10 { - width: 83.3333333333%; - } - .col-lg-9 { - width: 75%; - } - .col-lg-8 { - width: 66.6666666667%; - } - .col-lg-7 { - width: 58.3333333333%; - } - .col-lg-6 { - width: 50%; - } - .col-lg-5 { - width: 41.6666666667%; - } - .col-lg-4 { - width: 33.3333333333%; - } - .col-lg-3 { - width: 25%; - } - .col-lg-2 { - width: 16.6666666667%; - } - .col-lg-1 { - width: 8.3333333333%; - } -} -@media (min-width: 1600px) { - .col-xlg-12 { - width: 100%; - } - .col-xlg-11 { - width: 91.6666666667%; - } - .col-xlg-10 { - width: 83.3333333333%; - } - .col-xlg-9 { - width: 75%; - } - .col-xlg-8 { - width: 66.6666666667%; - } - .col-xlg-7 { - width: 58.3333333333%; - } - .col-xlg-6 { - width: 50%; - } - .col-xlg-5 { - width: 41.6666666667%; - } - .col-xlg-4 { - width: 33.3333333333%; - } - .col-xlg-3 { - width: 25%; - } - .col-xlg-2 { - width: 16.6666666667%; - } - .col-xlg-1 { - width: 8.3333333333%; - } -} -/** - * col-auto - * - * - */ -.col-auto { - flex: 1 0 0px; -} - -@media (min-width: 576px) { - .col-xs-auto { - flex: 1 0 0px; - } -} -@media (min-width: 768px) { - .col-sm-auto { - flex: 1 0 0px; - } -} -@media (min-width: 992px) { - .col-md-auto { - flex: 1 0 0px; - } -} -@media (min-width: 1200px) { - .col-lg-auto { - flex: 1 0 0px; - } -} -@media (min-width: 1600px) { - .col-xlg-auto { - flex: 1 0 0px; - } -} -/** - * order helpers generation - * - * - */ -.order-12 { - order: 12; -} - -.order-11 { - order: 11; -} - -.order-10 { - order: 10; -} - -.order-9 { - order: 9; -} - -.order-8 { - order: 8; -} - -.order-7 { - order: 7; -} - -.order-6 { - order: 6; -} - -.order-5 { - order: 5; -} - -.order-4 { - order: 4; -} - -.order-3 { - order: 3; -} - -.order-2 { - order: 2; -} - -.order-1 { - order: 1; -} - -.order-0 { - order: 0; -} - -@media (min-width: 576px) { - .order-xs-12 { - order: 12; - } - .order-xs-11 { - order: 11; - } - .order-xs-10 { - order: 10; - } - .order-xs-9 { - order: 9; - } - .order-xs-8 { - order: 8; - } - .order-xs-7 { - order: 7; - } - .order-xs-6 { - order: 6; - } - .order-xs-5 { - order: 5; - } - .order-xs-4 { - order: 4; - } - .order-xs-3 { - order: 3; - } - .order-xs-2 { - order: 2; - } - .order-xs-1 { - order: 1; - } - .order-xs-0 { - order: 0; - } -} -@media (min-width: 768px) { - .order-sm-12 { - order: 12; - } - .order-sm-11 { - order: 11; - } - .order-sm-10 { - order: 10; - } - .order-sm-9 { - order: 9; - } - .order-sm-8 { - order: 8; - } - .order-sm-7 { - order: 7; - } - .order-sm-6 { - order: 6; - } - .order-sm-5 { - order: 5; - } - .order-sm-4 { - order: 4; - } - .order-sm-3 { - order: 3; - } - .order-sm-2 { - order: 2; - } - .order-sm-1 { - order: 1; - } - .order-sm-0 { - order: 0; - } -} -@media (min-width: 992px) { - .order-md-12 { - order: 12; - } - .order-md-11 { - order: 11; - } - .order-md-10 { - order: 10; - } - .order-md-9 { - order: 9; - } - .order-md-8 { - order: 8; - } - .order-md-7 { - order: 7; - } - .order-md-6 { - order: 6; - } - .order-md-5 { - order: 5; - } - .order-md-4 { - order: 4; - } - .order-md-3 { - order: 3; - } - .order-md-2 { - order: 2; - } - .order-md-1 { - order: 1; - } - .order-md-0 { - order: 0; - } -} -@media (min-width: 1200px) { - .order-lg-12 { - order: 12; - } - .order-lg-11 { - order: 11; - } - .order-lg-10 { - order: 10; - } - .order-lg-9 { - order: 9; - } - .order-lg-8 { - order: 8; - } - .order-lg-7 { - order: 7; - } - .order-lg-6 { - order: 6; - } - .order-lg-5 { - order: 5; - } - .order-lg-4 { - order: 4; - } - .order-lg-3 { - order: 3; - } - .order-lg-2 { - order: 2; - } - .order-lg-1 { - order: 1; - } - .order-lg-0 { - order: 0; - } -} -@media (min-width: 1600px) { - .order-xlg-12 { - order: 12; - } - .order-xlg-11 { - order: 11; - } - .order-xlg-10 { - order: 10; - } - .order-xlg-9 { - order: 9; - } - .order-xlg-8 { - order: 8; - } - .order-xlg-7 { - order: 7; - } - .order-xlg-6 { - order: 6; - } - .order-xlg-5 { - order: 5; - } - .order-xlg-4 { - order: 4; - } - .order-xlg-3 { - order: 3; - } - .order-xlg-2 { - order: 2; - } - .order-xlg-1 { - order: 1; - } - .order-xlg-0 { - order: 0; - } -} -/** - * offset helpers generation - * - * - */ -.offset-11 { - margin-left: 91.6666666667%; -} - -.offset-10 { - margin-left: 83.3333333333%; -} - -.offset-9 { - margin-left: 75%; -} - -.offset-8 { - margin-left: 66.6666666667%; -} - -.offset-7 { - margin-left: 58.3333333333%; -} - -.offset-6 { - margin-left: 50%; -} - -.offset-5 { - margin-left: 41.6666666667%; -} - -.offset-4 { - margin-left: 33.3333333333%; -} - -.offset-3 { - margin-left: 25%; -} - -.offset-2 { - margin-left: 16.6666666667%; -} - -.offset-1 { - margin-left: 8.3333333333%; -} - -@media (min-width: 576px) { - .offset-xs-11 { - margin-left: 91.6666666667%; - } - .offset-xs-10 { - margin-left: 83.3333333333%; - } - .offset-xs-9 { - margin-left: 75%; - } - .offset-xs-8 { - margin-left: 66.6666666667%; - } - .offset-xs-7 { - margin-left: 58.3333333333%; - } - .offset-xs-6 { - margin-left: 50%; - } - .offset-xs-5 { - margin-left: 41.6666666667%; - } - .offset-xs-4 { - margin-left: 33.3333333333%; - } - .offset-xs-3 { - margin-left: 25%; - } - .offset-xs-2 { - margin-left: 16.6666666667%; - } - .offset-xs-1 { - margin-left: 8.3333333333%; - } - .offset-xs-0 { - margin-left: 0; - } -} -@media (min-width: 768px) { - .offset-sm-11 { - margin-left: 91.6666666667%; - } - .offset-sm-10 { - margin-left: 83.3333333333%; - } - .offset-sm-9 { - margin-left: 75%; - } - .offset-sm-8 { - margin-left: 66.6666666667%; - } - .offset-sm-7 { - margin-left: 58.3333333333%; - } - .offset-sm-6 { - margin-left: 50%; - } - .offset-sm-5 { - margin-left: 41.6666666667%; - } - .offset-sm-4 { - margin-left: 33.3333333333%; - } - .offset-sm-3 { - margin-left: 25%; - } - .offset-sm-2 { - margin-left: 16.6666666667%; - } - .offset-sm-1 { - margin-left: 8.3333333333%; - } - .offset-sm-0 { - margin-left: 0; - } -} -@media (min-width: 992px) { - .offset-md-11 { - margin-left: 91.6666666667%; - } - .offset-md-10 { - margin-left: 83.3333333333%; - } - .offset-md-9 { - margin-left: 75%; - } - .offset-md-8 { - margin-left: 66.6666666667%; - } - .offset-md-7 { - margin-left: 58.3333333333%; - } - .offset-md-6 { - margin-left: 50%; - } - .offset-md-5 { - margin-left: 41.6666666667%; - } - .offset-md-4 { - margin-left: 33.3333333333%; - } - .offset-md-3 { - margin-left: 25%; - } - .offset-md-2 { - margin-left: 16.6666666667%; - } - .offset-md-1 { - margin-left: 8.3333333333%; - } - .offset-md-0 { - margin-left: 0; - } -} -@media (min-width: 1200px) { - .offset-lg-11 { - margin-left: 91.6666666667%; - } - .offset-lg-10 { - margin-left: 83.3333333333%; - } - .offset-lg-9 { - margin-left: 75%; - } - .offset-lg-8 { - margin-left: 66.6666666667%; - } - .offset-lg-7 { - margin-left: 58.3333333333%; - } - .offset-lg-6 { - margin-left: 50%; - } - .offset-lg-5 { - margin-left: 41.6666666667%; - } - .offset-lg-4 { - margin-left: 33.3333333333%; - } - .offset-lg-3 { - margin-left: 25%; - } - .offset-lg-2 { - margin-left: 16.6666666667%; - } - .offset-lg-1 { - margin-left: 8.3333333333%; - } - .offset-lg-0 { - margin-left: 0; - } -} -@media (min-width: 1600px) { - .offset-xlg-11 { - margin-left: 91.6666666667%; - } - .offset-xlg-10 { - margin-left: 83.3333333333%; - } - .offset-xlg-9 { - margin-left: 75%; - } - .offset-xlg-8 { - margin-left: 66.6666666667%; - } - .offset-xlg-7 { - margin-left: 58.3333333333%; - } - .offset-xlg-6 { - margin-left: 50%; - } - .offset-xlg-5 { - margin-left: 41.6666666667%; - } - .offset-xlg-4 { - margin-left: 33.3333333333%; - } - .offset-xlg-3 { - margin-left: 25%; - } - .offset-xlg-2 { - margin-left: 16.6666666667%; - } - .offset-xlg-1 { - margin-left: 8.3333333333%; - } - .offset-xlg-0 { - margin-left: 0; - } -} -/** - * core - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.border { - border: 1px solid var(--border); -} - -.border-round { - border-radius: 2px; -} - -.border-0 { - border: 0; -} - -.radius-0 { - border-radius: 0; -} - -.round { - border-radius: 50%; -} - -/** - * z-index - * - * - */ -.z-index-1 { - z-index: 1; -} - -.z-index-2 { - z-index: 2; -} - -.z-index-3 { - z-index: 3; -} - -.z-index-4 { - z-index: 4; -} - -.z-index-5 { - z-index: 5; -} - -.z-index-6 { - z-index: 6; -} - -.z-index-7 { - z-index: 7; -} - -.z-index-8 { - z-index: 8; -} - -.z-index-9 { - z-index: 9; -} - -.z-index-10 { - z-index: 10; -} - -.z-index-11 { - z-index: 11; -} - -.z-index-12 { - z-index: 12; -} - -.z-index-13 { - z-index: 13; -} - -.z-index-14 { - z-index: 14; -} - -.z-index-15 { - z-index: 15; -} - -.z-index-16 { - z-index: 16; -} - -.z-index-17 { - z-index: 17; -} - -.z-index-18 { - z-index: 18; -} - -.z-index-19 { - z-index: 19; -} - -.z-index-20 { - z-index: 20; -} - -/** - * floating - * - * - */ -.float-left { - float: left; -} - -.float-right { - float: right; -} - -.float-none { - float: none; -} - -.centered { - margin-left: auto; - margin-right: auto; -} - -.clearfix::before, .clearfix::after { - display: table; - content: " "; -} -.clearfix::after { - clear: both; -} - -/** - * position - * - * - */ -.absolute { - position: absolute !important; -} - -.fixed { - position: fixed !important; -} - -.relative { - position: relative !important; -} - -/** - * - * - */ -.vertical-align-bottom { - vertical-align: bottom; -} - -.vertical-align-top { - vertical-align: top; -} - -.vertical-align-baseline { - vertical-align: baseline; -} - -/** - * - * - */ -.overflow-x-hidden { - overflow-x: hidden; -} - -.overflow-y-hidden { - overflow-y: hidden; -} - -.object-fit-cover { - -o-object-fit: cover; - object-fit: cover; -} - -/** - * Sizing - * - * Width and Height Classes, - * Sizes with percentage will calculate with the Reflex Grid - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * mixin: sizing - * - */ -/** - * mixin: sizing for each breakpoint - * - * - */ -.w-0 { - width: 0; -} - -@media only screen and (min-width: 576px) { - .w-xs-1 { - width: 0; - } -} -@media only screen and (min-width: 768px) { - .w-sm-1 { - width: 0; - } -} -@media only screen and (min-width: 992px) { - .w-md-1 { - width: 0; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-1 { - width: 0; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-1 { - width: 0; - } -} -.h-0 { - height: 0; -} - -@media only screen and (min-width: 576px) { - .h-xs-1 { - height: 0; - } -} -@media only screen and (min-width: 768px) { - .h-sm-1 { - height: 0; - } -} -@media only screen and (min-width: 992px) { - .h-md-1 { - height: 0; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-1 { - height: 0; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-1 { - height: 0; - } -} -.w-1 { - width: 1px; -} - -@media only screen and (min-width: 576px) { - .w-xs-1 { - width: 1px; - } -} -@media only screen and (min-width: 768px) { - .w-sm-1 { - width: 1px; - } -} -@media only screen and (min-width: 992px) { - .w-md-1 { - width: 1px; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-1 { - width: 1px; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-1 { - width: 1px; - } -} -.h-1 { - height: 1px; -} - -@media only screen and (min-width: 576px) { - .h-xs-1 { - height: 1px; - } -} -@media only screen and (min-width: 768px) { - .h-sm-1 { - height: 1px; - } -} -@media only screen and (min-width: 992px) { - .h-md-1 { - height: 1px; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-1 { - height: 1px; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-1 { - height: 1px; - } -} -.w-100 { - width: 100%; -} - -@media only screen and (min-width: 576px) { - .w-xs-100 { - width: 100%; - } -} -@media only screen and (min-width: 768px) { - .w-sm-100 { - width: 100%; - } -} -@media only screen and (min-width: 992px) { - .w-md-100 { - width: 100%; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-100 { - width: 100%; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-100 { - width: 100%; - } -} -.w-auto { - width: auto; -} - -@media only screen and (min-width: 576px) { - .w-xs-auto { - width: auto; - } -} -@media only screen and (min-width: 768px) { - .w-sm-auto { - width: auto; - } -} -@media only screen and (min-width: 992px) { - .w-md-auto { - width: auto; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-auto { - width: auto; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-auto { - width: auto; - } -} -.h-100 { - height: 100%; -} - -@media only screen and (min-width: 576px) { - .h-xs-100 { - height: 100%; - } -} -@media only screen and (min-width: 768px) { - .h-sm-100 { - height: 100%; - } -} -@media only screen and (min-width: 992px) { - .h-md-100 { - height: 100%; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-100 { - height: 100%; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-100 { - height: 100%; - } -} -.h-auto { - height: auto; -} - -@media only screen and (min-width: 576px) { - .h-xs-auto { - height: auto; - } -} -@media only screen and (min-width: 768px) { - .h-sm-auto { - height: auto; - } -} -@media only screen and (min-width: 992px) { - .h-md-auto { - height: auto; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-auto { - height: auto; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-auto { - height: auto; - } -} -.w-col-1 { - width: 8.3333333333%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-1 { - width: 8.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-1 { - width: 8.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-1 { - width: 8.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-1 { - width: 8.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-1 { - width: 8.3333333333%; - } -} -.h-col-1 { - height: 8.3333333333%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-1 { - height: 8.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-1 { - height: 8.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-1 { - height: 8.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-1 { - height: 8.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-1 { - height: 8.3333333333%; - } -} -.w-col-2 { - width: 16.6666666667%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-2 { - width: 16.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-2 { - width: 16.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-2 { - width: 16.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-2 { - width: 16.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-2 { - width: 16.6666666667%; - } -} -.h-col-2 { - height: 16.6666666667%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-2 { - height: 16.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-2 { - height: 16.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-2 { - height: 16.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-2 { - height: 16.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-2 { - height: 16.6666666667%; - } -} -.w-col-3 { - width: 25%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-3 { - width: 25%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-3 { - width: 25%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-3 { - width: 25%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-3 { - width: 25%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-3 { - width: 25%; - } -} -.h-col-3 { - height: 25%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-3 { - height: 25%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-3 { - height: 25%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-3 { - height: 25%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-3 { - height: 25%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-3 { - height: 25%; - } -} -.w-col-4 { - width: 33.3333333333%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-4 { - width: 33.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-4 { - width: 33.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-4 { - width: 33.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-4 { - width: 33.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-4 { - width: 33.3333333333%; - } -} -.h-col-4 { - height: 33.3333333333%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-4 { - height: 33.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-4 { - height: 33.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-4 { - height: 33.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-4 { - height: 33.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-4 { - height: 33.3333333333%; - } -} -.w-col-5 { - width: 41.6666666667%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-5 { - width: 41.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-5 { - width: 41.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-5 { - width: 41.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-5 { - width: 41.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-5 { - width: 41.6666666667%; - } -} -.h-col-5 { - height: 41.6666666667%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-5 { - height: 41.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-5 { - height: 41.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-5 { - height: 41.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-5 { - height: 41.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-5 { - height: 41.6666666667%; - } -} -.w-col-6 { - width: 50%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-6 { - width: 50%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-6 { - width: 50%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-6 { - width: 50%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-6 { - width: 50%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-6 { - width: 50%; - } -} -.h-col-6 { - height: 50%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-6 { - height: 50%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-6 { - height: 50%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-6 { - height: 50%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-6 { - height: 50%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-6 { - height: 50%; - } -} -.w-col-7 { - width: 58.3333333333%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-7 { - width: 58.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-7 { - width: 58.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-7 { - width: 58.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-7 { - width: 58.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-7 { - width: 58.3333333333%; - } -} -.h-col-7 { - height: 58.3333333333%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-7 { - height: 58.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-7 { - height: 58.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-7 { - height: 58.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-7 { - height: 58.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-7 { - height: 58.3333333333%; - } -} -.w-col-8 { - width: 66.6666666667%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-8 { - width: 66.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-8 { - width: 66.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-8 { - width: 66.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-8 { - width: 66.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-8 { - width: 66.6666666667%; - } -} -.h-col-8 { - height: 66.6666666667%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-8 { - height: 66.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-8 { - height: 66.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-8 { - height: 66.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-8 { - height: 66.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-8 { - height: 66.6666666667%; - } -} -.w-col-9 { - width: 75%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-9 { - width: 75%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-9 { - width: 75%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-9 { - width: 75%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-9 { - width: 75%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-9 { - width: 75%; - } -} -.h-col-9 { - height: 75%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-9 { - height: 75%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-9 { - height: 75%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-9 { - height: 75%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-9 { - height: 75%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-9 { - height: 75%; - } -} -.w-col-10 { - width: 83.3333333333%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-10 { - width: 83.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-10 { - width: 83.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-10 { - width: 83.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-10 { - width: 83.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-10 { - width: 83.3333333333%; - } -} -.h-col-10 { - height: 83.3333333333%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-10 { - height: 83.3333333333%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-10 { - height: 83.3333333333%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-10 { - height: 83.3333333333%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-10 { - height: 83.3333333333%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-10 { - height: 83.3333333333%; - } -} -.w-col-11 { - width: 91.6666666667%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-11 { - width: 91.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-11 { - width: 91.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-11 { - width: 91.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-11 { - width: 91.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-11 { - width: 91.6666666667%; - } -} -.h-col-11 { - height: 91.6666666667%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-11 { - height: 91.6666666667%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-11 { - height: 91.6666666667%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-11 { - height: 91.6666666667%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-11 { - height: 91.6666666667%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-11 { - height: 91.6666666667%; - } -} -.w-col-12 { - width: 100%; -} - -@media only screen and (min-width: 576px) { - .w-col-xs-12 { - width: 100%; - } -} -@media only screen and (min-width: 768px) { - .w-col-sm-12 { - width: 100%; - } -} -@media only screen and (min-width: 992px) { - .w-col-md-12 { - width: 100%; - } -} -@media only screen and (min-width: 1200px) { - .w-col-lg-12 { - width: 100%; - } -} -@media only screen and (min-width: 1600px) { - .w-col-xlg-12 { - width: 100%; - } -} -.h-col-12 { - height: 100%; -} - -@media only screen and (min-width: 576px) { - .h-col-xs-12 { - height: 100%; - } -} -@media only screen and (min-width: 768px) { - .h-col-sm-12 { - height: 100%; - } -} -@media only screen and (min-width: 992px) { - .h-col-md-12 { - height: 100%; - } -} -@media only screen and (min-width: 1200px) { - .h-col-lg-12 { - height: 100%; - } -} -@media only screen and (min-width: 1600px) { - .h-col-xlg-12 { - height: 100%; - } -} -.w-1 { - width: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-1 { - width: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-1 { - width: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-1 { - width: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-1 { - width: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-1 { - width: 0.5rem; - } -} -.w-2 { - width: 1rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-2 { - width: 1rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-2 { - width: 1rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-2 { - width: 1rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-2 { - width: 1rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-2 { - width: 1rem; - } -} -.w-3 { - width: 1.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-3 { - width: 1.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-3 { - width: 1.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-3 { - width: 1.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-3 { - width: 1.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-3 { - width: 1.5rem; - } -} -.w-4 { - width: 2rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-4 { - width: 2rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-4 { - width: 2rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-4 { - width: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-4 { - width: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-4 { - width: 2rem; - } -} -.w-5 { - width: 2.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-5 { - width: 2.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-5 { - width: 2.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-5 { - width: 2.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-5 { - width: 2.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-5 { - width: 2.5rem; - } -} -.w-6 { - width: 3rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-6 { - width: 3rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-6 { - width: 3rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-6 { - width: 3rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-6 { - width: 3rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-6 { - width: 3rem; - } -} -.w-7 { - width: 3.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-7 { - width: 3.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-7 { - width: 3.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-7 { - width: 3.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-7 { - width: 3.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-7 { - width: 3.5rem; - } -} -.w-8 { - width: 4rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-8 { - width: 4rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-8 { - width: 4rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-8 { - width: 4rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-8 { - width: 4rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-8 { - width: 4rem; - } -} -.w-9 { - width: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-9 { - width: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-9 { - width: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-9 { - width: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-9 { - width: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-9 { - width: 4.5rem; - } -} -.w-10 { - width: 5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-10 { - width: 5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-10 { - width: 5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-10 { - width: 5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-10 { - width: 5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-10 { - width: 5rem; - } -} -.w-11 { - width: 5.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-11 { - width: 5.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-11 { - width: 5.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-11 { - width: 5.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-11 { - width: 5.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-11 { - width: 5.5rem; - } -} -.w-12 { - width: 6rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-12 { - width: 6rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-12 { - width: 6rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-12 { - width: 6rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-12 { - width: 6rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-12 { - width: 6rem; - } -} -.w-13 { - width: 6.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-13 { - width: 6.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-13 { - width: 6.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-13 { - width: 6.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-13 { - width: 6.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-13 { - width: 6.5rem; - } -} -.w-14 { - width: 7rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-14 { - width: 7rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-14 { - width: 7rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-14 { - width: 7rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-14 { - width: 7rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-14 { - width: 7rem; - } -} -.w-15 { - width: 7.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-15 { - width: 7.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-15 { - width: 7.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-15 { - width: 7.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-15 { - width: 7.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-15 { - width: 7.5rem; - } -} -.w-16 { - width: 8rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-16 { - width: 8rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-16 { - width: 8rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-16 { - width: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-16 { - width: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-16 { - width: 8rem; - } -} -.w-17 { - width: 8.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-17 { - width: 8.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-17 { - width: 8.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-17 { - width: 8.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-17 { - width: 8.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-17 { - width: 8.5rem; - } -} -.w-18 { - width: 9rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-18 { - width: 9rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-18 { - width: 9rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-18 { - width: 9rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-18 { - width: 9rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-18 { - width: 9rem; - } -} -.w-19 { - width: 9.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-19 { - width: 9.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-19 { - width: 9.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-19 { - width: 9.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-19 { - width: 9.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-19 { - width: 9.5rem; - } -} -.w-20 { - width: 10rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-20 { - width: 10rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-20 { - width: 10rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-20 { - width: 10rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-20 { - width: 10rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-20 { - width: 10rem; - } -} -.w-21 { - width: 10.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-21 { - width: 10.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-21 { - width: 10.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-21 { - width: 10.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-21 { - width: 10.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-21 { - width: 10.5rem; - } -} -.w-22 { - width: 11rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-22 { - width: 11rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-22 { - width: 11rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-22 { - width: 11rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-22 { - width: 11rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-22 { - width: 11rem; - } -} -.w-23 { - width: 11.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-23 { - width: 11.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-23 { - width: 11.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-23 { - width: 11.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-23 { - width: 11.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-23 { - width: 11.5rem; - } -} -.w-24 { - width: 12rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-24 { - width: 12rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-24 { - width: 12rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-24 { - width: 12rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-24 { - width: 12rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-24 { - width: 12rem; - } -} -.w-25 { - width: 12.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-25 { - width: 12.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-25 { - width: 12.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-25 { - width: 12.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-25 { - width: 12.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-25 { - width: 12.5rem; - } -} -.w-26 { - width: 13rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-26 { - width: 13rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-26 { - width: 13rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-26 { - width: 13rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-26 { - width: 13rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-26 { - width: 13rem; - } -} -.w-27 { - width: 13.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-27 { - width: 13.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-27 { - width: 13.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-27 { - width: 13.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-27 { - width: 13.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-27 { - width: 13.5rem; - } -} -.w-28 { - width: 14rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-28 { - width: 14rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-28 { - width: 14rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-28 { - width: 14rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-28 { - width: 14rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-28 { - width: 14rem; - } -} -.w-29 { - width: 14.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-29 { - width: 14.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-29 { - width: 14.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-29 { - width: 14.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-29 { - width: 14.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-29 { - width: 14.5rem; - } -} -.w-30 { - width: 15rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-30 { - width: 15rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-30 { - width: 15rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-30 { - width: 15rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-30 { - width: 15rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-30 { - width: 15rem; - } -} -.w-31 { - width: 15.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-31 { - width: 15.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-31 { - width: 15.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-31 { - width: 15.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-31 { - width: 15.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-31 { - width: 15.5rem; - } -} -.w-32 { - width: 16rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-32 { - width: 16rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-32 { - width: 16rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-32 { - width: 16rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-32 { - width: 16rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-32 { - width: 16rem; - } -} -.w-33 { - width: 16.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-33 { - width: 16.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-33 { - width: 16.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-33 { - width: 16.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-33 { - width: 16.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-33 { - width: 16.5rem; - } -} -.w-34 { - width: 17rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-34 { - width: 17rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-34 { - width: 17rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-34 { - width: 17rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-34 { - width: 17rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-34 { - width: 17rem; - } -} -.w-35 { - width: 17.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-35 { - width: 17.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-35 { - width: 17.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-35 { - width: 17.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-35 { - width: 17.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-35 { - width: 17.5rem; - } -} -.w-36 { - width: 18rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-36 { - width: 18rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-36 { - width: 18rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-36 { - width: 18rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-36 { - width: 18rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-36 { - width: 18rem; - } -} -.w-37 { - width: 18.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-37 { - width: 18.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-37 { - width: 18.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-37 { - width: 18.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-37 { - width: 18.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-37 { - width: 18.5rem; - } -} -.w-38 { - width: 19rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-38 { - width: 19rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-38 { - width: 19rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-38 { - width: 19rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-38 { - width: 19rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-38 { - width: 19rem; - } -} -.w-39 { - width: 19.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-39 { - width: 19.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-39 { - width: 19.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-39 { - width: 19.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-39 { - width: 19.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-39 { - width: 19.5rem; - } -} -.w-40 { - width: 20rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-40 { - width: 20rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-40 { - width: 20rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-40 { - width: 20rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-40 { - width: 20rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-40 { - width: 20rem; - } -} -.w-41 { - width: 20.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-41 { - width: 20.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-41 { - width: 20.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-41 { - width: 20.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-41 { - width: 20.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-41 { - width: 20.5rem; - } -} -.w-42 { - width: 21rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-42 { - width: 21rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-42 { - width: 21rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-42 { - width: 21rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-42 { - width: 21rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-42 { - width: 21rem; - } -} -.w-43 { - width: 21.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-43 { - width: 21.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-43 { - width: 21.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-43 { - width: 21.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-43 { - width: 21.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-43 { - width: 21.5rem; - } -} -.w-44 { - width: 22rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-44 { - width: 22rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-44 { - width: 22rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-44 { - width: 22rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-44 { - width: 22rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-44 { - width: 22rem; - } -} -.w-45 { - width: 22.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-45 { - width: 22.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-45 { - width: 22.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-45 { - width: 22.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-45 { - width: 22.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-45 { - width: 22.5rem; - } -} -.w-46 { - width: 23rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-46 { - width: 23rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-46 { - width: 23rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-46 { - width: 23rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-46 { - width: 23rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-46 { - width: 23rem; - } -} -.w-47 { - width: 23.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-47 { - width: 23.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-47 { - width: 23.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-47 { - width: 23.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-47 { - width: 23.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-47 { - width: 23.5rem; - } -} -.w-48 { - width: 24rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-48 { - width: 24rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-48 { - width: 24rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-48 { - width: 24rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-48 { - width: 24rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-48 { - width: 24rem; - } -} -.w-49 { - width: 24.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-49 { - width: 24.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-49 { - width: 24.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-49 { - width: 24.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-49 { - width: 24.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-49 { - width: 24.5rem; - } -} -.w-50 { - width: 25rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-50 { - width: 25rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-50 { - width: 25rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-50 { - width: 25rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-50 { - width: 25rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-50 { - width: 25rem; - } -} -.w-51 { - width: 25.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-51 { - width: 25.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-51 { - width: 25.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-51 { - width: 25.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-51 { - width: 25.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-51 { - width: 25.5rem; - } -} -.w-52 { - width: 26rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-52 { - width: 26rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-52 { - width: 26rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-52 { - width: 26rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-52 { - width: 26rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-52 { - width: 26rem; - } -} -.w-53 { - width: 26.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-53 { - width: 26.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-53 { - width: 26.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-53 { - width: 26.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-53 { - width: 26.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-53 { - width: 26.5rem; - } -} -.w-54 { - width: 27rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-54 { - width: 27rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-54 { - width: 27rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-54 { - width: 27rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-54 { - width: 27rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-54 { - width: 27rem; - } -} -.w-55 { - width: 27.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-55 { - width: 27.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-55 { - width: 27.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-55 { - width: 27.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-55 { - width: 27.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-55 { - width: 27.5rem; - } -} -.w-56 { - width: 28rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-56 { - width: 28rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-56 { - width: 28rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-56 { - width: 28rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-56 { - width: 28rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-56 { - width: 28rem; - } -} -.w-57 { - width: 28.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-57 { - width: 28.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-57 { - width: 28.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-57 { - width: 28.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-57 { - width: 28.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-57 { - width: 28.5rem; - } -} -.w-58 { - width: 29rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-58 { - width: 29rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-58 { - width: 29rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-58 { - width: 29rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-58 { - width: 29rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-58 { - width: 29rem; - } -} -.w-59 { - width: 29.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-59 { - width: 29.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-59 { - width: 29.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-59 { - width: 29.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-59 { - width: 29.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-59 { - width: 29.5rem; - } -} -.w-60 { - width: 30rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-60 { - width: 30rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-60 { - width: 30rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-60 { - width: 30rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-60 { - width: 30rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-60 { - width: 30rem; - } -} -.w-61 { - width: 30.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-61 { - width: 30.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-61 { - width: 30.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-61 { - width: 30.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-61 { - width: 30.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-61 { - width: 30.5rem; - } -} -.w-62 { - width: 31rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-62 { - width: 31rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-62 { - width: 31rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-62 { - width: 31rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-62 { - width: 31rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-62 { - width: 31rem; - } -} -.w-63 { - width: 31.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-63 { - width: 31.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-63 { - width: 31.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-63 { - width: 31.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-63 { - width: 31.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-63 { - width: 31.5rem; - } -} -.w-64 { - width: 32rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-64 { - width: 32rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-64 { - width: 32rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-64 { - width: 32rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-64 { - width: 32rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-64 { - width: 32rem; - } -} -.w-65 { - width: 32.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-65 { - width: 32.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-65 { - width: 32.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-65 { - width: 32.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-65 { - width: 32.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-65 { - width: 32.5rem; - } -} -.w-66 { - width: 33rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-66 { - width: 33rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-66 { - width: 33rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-66 { - width: 33rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-66 { - width: 33rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-66 { - width: 33rem; - } -} -.w-67 { - width: 33.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-67 { - width: 33.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-67 { - width: 33.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-67 { - width: 33.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-67 { - width: 33.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-67 { - width: 33.5rem; - } -} -.w-68 { - width: 34rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-68 { - width: 34rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-68 { - width: 34rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-68 { - width: 34rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-68 { - width: 34rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-68 { - width: 34rem; - } -} -.w-69 { - width: 34.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-69 { - width: 34.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-69 { - width: 34.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-69 { - width: 34.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-69 { - width: 34.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-69 { - width: 34.5rem; - } -} -.w-70 { - width: 35rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-70 { - width: 35rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-70 { - width: 35rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-70 { - width: 35rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-70 { - width: 35rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-70 { - width: 35rem; - } -} -.w-71 { - width: 35.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-71 { - width: 35.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-71 { - width: 35.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-71 { - width: 35.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-71 { - width: 35.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-71 { - width: 35.5rem; - } -} -.w-72 { - width: 36rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-72 { - width: 36rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-72 { - width: 36rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-72 { - width: 36rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-72 { - width: 36rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-72 { - width: 36rem; - } -} -.w-73 { - width: 36.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-73 { - width: 36.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-73 { - width: 36.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-73 { - width: 36.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-73 { - width: 36.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-73 { - width: 36.5rem; - } -} -.w-74 { - width: 37rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-74 { - width: 37rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-74 { - width: 37rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-74 { - width: 37rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-74 { - width: 37rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-74 { - width: 37rem; - } -} -.w-75 { - width: 37.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-75 { - width: 37.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-75 { - width: 37.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-75 { - width: 37.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-75 { - width: 37.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-75 { - width: 37.5rem; - } -} -.w-76 { - width: 38rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-76 { - width: 38rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-76 { - width: 38rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-76 { - width: 38rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-76 { - width: 38rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-76 { - width: 38rem; - } -} -.w-77 { - width: 38.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-77 { - width: 38.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-77 { - width: 38.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-77 { - width: 38.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-77 { - width: 38.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-77 { - width: 38.5rem; - } -} -.w-78 { - width: 39rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-78 { - width: 39rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-78 { - width: 39rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-78 { - width: 39rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-78 { - width: 39rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-78 { - width: 39rem; - } -} -.w-79 { - width: 39.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-79 { - width: 39.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-79 { - width: 39.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-79 { - width: 39.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-79 { - width: 39.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-79 { - width: 39.5rem; - } -} -.w-80 { - width: 40rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-80 { - width: 40rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-80 { - width: 40rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-80 { - width: 40rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-80 { - width: 40rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-80 { - width: 40rem; - } -} -.w-81 { - width: 40.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-81 { - width: 40.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-81 { - width: 40.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-81 { - width: 40.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-81 { - width: 40.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-81 { - width: 40.5rem; - } -} -.w-82 { - width: 41rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-82 { - width: 41rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-82 { - width: 41rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-82 { - width: 41rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-82 { - width: 41rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-82 { - width: 41rem; - } -} -.w-83 { - width: 41.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-83 { - width: 41.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-83 { - width: 41.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-83 { - width: 41.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-83 { - width: 41.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-83 { - width: 41.5rem; - } -} -.w-84 { - width: 42rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-84 { - width: 42rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-84 { - width: 42rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-84 { - width: 42rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-84 { - width: 42rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-84 { - width: 42rem; - } -} -.w-85 { - width: 42.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-85 { - width: 42.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-85 { - width: 42.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-85 { - width: 42.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-85 { - width: 42.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-85 { - width: 42.5rem; - } -} -.w-86 { - width: 43rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-86 { - width: 43rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-86 { - width: 43rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-86 { - width: 43rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-86 { - width: 43rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-86 { - width: 43rem; - } -} -.w-87 { - width: 43.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-87 { - width: 43.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-87 { - width: 43.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-87 { - width: 43.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-87 { - width: 43.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-87 { - width: 43.5rem; - } -} -.w-88 { - width: 44rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-88 { - width: 44rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-88 { - width: 44rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-88 { - width: 44rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-88 { - width: 44rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-88 { - width: 44rem; - } -} -.w-89 { - width: 44.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-89 { - width: 44.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-89 { - width: 44.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-89 { - width: 44.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-89 { - width: 44.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-89 { - width: 44.5rem; - } -} -.w-90 { - width: 45rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-90 { - width: 45rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-90 { - width: 45rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-90 { - width: 45rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-90 { - width: 45rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-90 { - width: 45rem; - } -} -.w-91 { - width: 45.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-91 { - width: 45.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-91 { - width: 45.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-91 { - width: 45.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-91 { - width: 45.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-91 { - width: 45.5rem; - } -} -.w-92 { - width: 46rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-92 { - width: 46rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-92 { - width: 46rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-92 { - width: 46rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-92 { - width: 46rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-92 { - width: 46rem; - } -} -.w-93 { - width: 46.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-93 { - width: 46.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-93 { - width: 46.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-93 { - width: 46.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-93 { - width: 46.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-93 { - width: 46.5rem; - } -} -.w-94 { - width: 47rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-94 { - width: 47rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-94 { - width: 47rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-94 { - width: 47rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-94 { - width: 47rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-94 { - width: 47rem; - } -} -.w-95 { - width: 47.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-95 { - width: 47.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-95 { - width: 47.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-95 { - width: 47.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-95 { - width: 47.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-95 { - width: 47.5rem; - } -} -.w-96 { - width: 48rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-96 { - width: 48rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-96 { - width: 48rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-96 { - width: 48rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-96 { - width: 48rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-96 { - width: 48rem; - } -} -.w-97 { - width: 48.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-97 { - width: 48.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-97 { - width: 48.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-97 { - width: 48.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-97 { - width: 48.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-97 { - width: 48.5rem; - } -} -.w-98 { - width: 49rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-98 { - width: 49rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-98 { - width: 49rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-98 { - width: 49rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-98 { - width: 49rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-98 { - width: 49rem; - } -} -.w-99 { - width: 49.5rem; -} - -@media only screen and (min-width: 576px) { - .w-xs-99 { - width: 49.5rem; - } -} -@media only screen and (min-width: 768px) { - .w-sm-99 { - width: 49.5rem; - } -} -@media only screen and (min-width: 992px) { - .w-md-99 { - width: 49.5rem; - } -} -@media only screen and (min-width: 1200px) { - .w-lg-99 { - width: 49.5rem; - } -} -@media only screen and (min-width: 1600px) { - .w-xlg-99 { - width: 49.5rem; - } -} -.h-1 { - height: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-1 { - height: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-1 { - height: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-1 { - height: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-1 { - height: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-1 { - height: 0.5rem; - } -} -.h-2 { - height: 1rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-2 { - height: 1rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-2 { - height: 1rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-2 { - height: 1rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-2 { - height: 1rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-2 { - height: 1rem; - } -} -.h-3 { - height: 1.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-3 { - height: 1.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-3 { - height: 1.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-3 { - height: 1.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-3 { - height: 1.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-3 { - height: 1.5rem; - } -} -.h-4 { - height: 2rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-4 { - height: 2rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-4 { - height: 2rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-4 { - height: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-4 { - height: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-4 { - height: 2rem; - } -} -.h-5 { - height: 2.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-5 { - height: 2.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-5 { - height: 2.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-5 { - height: 2.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-5 { - height: 2.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-5 { - height: 2.5rem; - } -} -.h-6 { - height: 3rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-6 { - height: 3rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-6 { - height: 3rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-6 { - height: 3rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-6 { - height: 3rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-6 { - height: 3rem; - } -} -.h-7 { - height: 3.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-7 { - height: 3.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-7 { - height: 3.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-7 { - height: 3.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-7 { - height: 3.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-7 { - height: 3.5rem; - } -} -.h-8 { - height: 4rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-8 { - height: 4rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-8 { - height: 4rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-8 { - height: 4rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-8 { - height: 4rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-8 { - height: 4rem; - } -} -.h-9 { - height: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-9 { - height: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-9 { - height: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-9 { - height: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-9 { - height: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-9 { - height: 4.5rem; - } -} -.h-10 { - height: 5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-10 { - height: 5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-10 { - height: 5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-10 { - height: 5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-10 { - height: 5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-10 { - height: 5rem; - } -} -.h-11 { - height: 5.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-11 { - height: 5.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-11 { - height: 5.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-11 { - height: 5.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-11 { - height: 5.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-11 { - height: 5.5rem; - } -} -.h-12 { - height: 6rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-12 { - height: 6rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-12 { - height: 6rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-12 { - height: 6rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-12 { - height: 6rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-12 { - height: 6rem; - } -} -.h-13 { - height: 6.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-13 { - height: 6.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-13 { - height: 6.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-13 { - height: 6.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-13 { - height: 6.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-13 { - height: 6.5rem; - } -} -.h-14 { - height: 7rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-14 { - height: 7rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-14 { - height: 7rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-14 { - height: 7rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-14 { - height: 7rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-14 { - height: 7rem; - } -} -.h-15 { - height: 7.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-15 { - height: 7.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-15 { - height: 7.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-15 { - height: 7.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-15 { - height: 7.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-15 { - height: 7.5rem; - } -} -.h-16 { - height: 8rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-16 { - height: 8rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-16 { - height: 8rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-16 { - height: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-16 { - height: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-16 { - height: 8rem; - } -} -.h-17 { - height: 8.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-17 { - height: 8.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-17 { - height: 8.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-17 { - height: 8.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-17 { - height: 8.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-17 { - height: 8.5rem; - } -} -.h-18 { - height: 9rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-18 { - height: 9rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-18 { - height: 9rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-18 { - height: 9rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-18 { - height: 9rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-18 { - height: 9rem; - } -} -.h-19 { - height: 9.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-19 { - height: 9.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-19 { - height: 9.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-19 { - height: 9.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-19 { - height: 9.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-19 { - height: 9.5rem; - } -} -.h-20 { - height: 10rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-20 { - height: 10rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-20 { - height: 10rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-20 { - height: 10rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-20 { - height: 10rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-20 { - height: 10rem; - } -} -.h-21 { - height: 10.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-21 { - height: 10.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-21 { - height: 10.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-21 { - height: 10.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-21 { - height: 10.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-21 { - height: 10.5rem; - } -} -.h-22 { - height: 11rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-22 { - height: 11rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-22 { - height: 11rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-22 { - height: 11rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-22 { - height: 11rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-22 { - height: 11rem; - } -} -.h-23 { - height: 11.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-23 { - height: 11.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-23 { - height: 11.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-23 { - height: 11.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-23 { - height: 11.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-23 { - height: 11.5rem; - } -} -.h-24 { - height: 12rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-24 { - height: 12rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-24 { - height: 12rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-24 { - height: 12rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-24 { - height: 12rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-24 { - height: 12rem; - } -} -.h-25 { - height: 12.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-25 { - height: 12.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-25 { - height: 12.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-25 { - height: 12.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-25 { - height: 12.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-25 { - height: 12.5rem; - } -} -.h-26 { - height: 13rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-26 { - height: 13rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-26 { - height: 13rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-26 { - height: 13rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-26 { - height: 13rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-26 { - height: 13rem; - } -} -.h-27 { - height: 13.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-27 { - height: 13.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-27 { - height: 13.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-27 { - height: 13.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-27 { - height: 13.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-27 { - height: 13.5rem; - } -} -.h-28 { - height: 14rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-28 { - height: 14rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-28 { - height: 14rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-28 { - height: 14rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-28 { - height: 14rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-28 { - height: 14rem; - } -} -.h-29 { - height: 14.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-29 { - height: 14.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-29 { - height: 14.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-29 { - height: 14.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-29 { - height: 14.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-29 { - height: 14.5rem; - } -} -.h-30 { - height: 15rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-30 { - height: 15rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-30 { - height: 15rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-30 { - height: 15rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-30 { - height: 15rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-30 { - height: 15rem; - } -} -.h-31 { - height: 15.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-31 { - height: 15.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-31 { - height: 15.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-31 { - height: 15.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-31 { - height: 15.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-31 { - height: 15.5rem; - } -} -.h-32 { - height: 16rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-32 { - height: 16rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-32 { - height: 16rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-32 { - height: 16rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-32 { - height: 16rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-32 { - height: 16rem; - } -} -.h-33 { - height: 16.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-33 { - height: 16.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-33 { - height: 16.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-33 { - height: 16.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-33 { - height: 16.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-33 { - height: 16.5rem; - } -} -.h-34 { - height: 17rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-34 { - height: 17rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-34 { - height: 17rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-34 { - height: 17rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-34 { - height: 17rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-34 { - height: 17rem; - } -} -.h-35 { - height: 17.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-35 { - height: 17.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-35 { - height: 17.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-35 { - height: 17.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-35 { - height: 17.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-35 { - height: 17.5rem; - } -} -.h-36 { - height: 18rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-36 { - height: 18rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-36 { - height: 18rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-36 { - height: 18rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-36 { - height: 18rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-36 { - height: 18rem; - } -} -.h-37 { - height: 18.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-37 { - height: 18.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-37 { - height: 18.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-37 { - height: 18.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-37 { - height: 18.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-37 { - height: 18.5rem; - } -} -.h-38 { - height: 19rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-38 { - height: 19rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-38 { - height: 19rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-38 { - height: 19rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-38 { - height: 19rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-38 { - height: 19rem; - } -} -.h-39 { - height: 19.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-39 { - height: 19.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-39 { - height: 19.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-39 { - height: 19.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-39 { - height: 19.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-39 { - height: 19.5rem; - } -} -.h-40 { - height: 20rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-40 { - height: 20rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-40 { - height: 20rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-40 { - height: 20rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-40 { - height: 20rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-40 { - height: 20rem; - } -} -.h-41 { - height: 20.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-41 { - height: 20.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-41 { - height: 20.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-41 { - height: 20.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-41 { - height: 20.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-41 { - height: 20.5rem; - } -} -.h-42 { - height: 21rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-42 { - height: 21rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-42 { - height: 21rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-42 { - height: 21rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-42 { - height: 21rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-42 { - height: 21rem; - } -} -.h-43 { - height: 21.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-43 { - height: 21.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-43 { - height: 21.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-43 { - height: 21.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-43 { - height: 21.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-43 { - height: 21.5rem; - } -} -.h-44 { - height: 22rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-44 { - height: 22rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-44 { - height: 22rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-44 { - height: 22rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-44 { - height: 22rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-44 { - height: 22rem; - } -} -.h-45 { - height: 22.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-45 { - height: 22.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-45 { - height: 22.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-45 { - height: 22.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-45 { - height: 22.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-45 { - height: 22.5rem; - } -} -.h-46 { - height: 23rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-46 { - height: 23rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-46 { - height: 23rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-46 { - height: 23rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-46 { - height: 23rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-46 { - height: 23rem; - } -} -.h-47 { - height: 23.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-47 { - height: 23.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-47 { - height: 23.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-47 { - height: 23.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-47 { - height: 23.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-47 { - height: 23.5rem; - } -} -.h-48 { - height: 24rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-48 { - height: 24rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-48 { - height: 24rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-48 { - height: 24rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-48 { - height: 24rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-48 { - height: 24rem; - } -} -.h-49 { - height: 24.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-49 { - height: 24.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-49 { - height: 24.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-49 { - height: 24.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-49 { - height: 24.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-49 { - height: 24.5rem; - } -} -.h-50 { - height: 25rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-50 { - height: 25rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-50 { - height: 25rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-50 { - height: 25rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-50 { - height: 25rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-50 { - height: 25rem; - } -} -.h-51 { - height: 25.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-51 { - height: 25.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-51 { - height: 25.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-51 { - height: 25.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-51 { - height: 25.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-51 { - height: 25.5rem; - } -} -.h-52 { - height: 26rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-52 { - height: 26rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-52 { - height: 26rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-52 { - height: 26rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-52 { - height: 26rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-52 { - height: 26rem; - } -} -.h-53 { - height: 26.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-53 { - height: 26.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-53 { - height: 26.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-53 { - height: 26.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-53 { - height: 26.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-53 { - height: 26.5rem; - } -} -.h-54 { - height: 27rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-54 { - height: 27rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-54 { - height: 27rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-54 { - height: 27rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-54 { - height: 27rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-54 { - height: 27rem; - } -} -.h-55 { - height: 27.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-55 { - height: 27.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-55 { - height: 27.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-55 { - height: 27.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-55 { - height: 27.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-55 { - height: 27.5rem; - } -} -.h-56 { - height: 28rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-56 { - height: 28rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-56 { - height: 28rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-56 { - height: 28rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-56 { - height: 28rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-56 { - height: 28rem; - } -} -.h-57 { - height: 28.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-57 { - height: 28.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-57 { - height: 28.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-57 { - height: 28.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-57 { - height: 28.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-57 { - height: 28.5rem; - } -} -.h-58 { - height: 29rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-58 { - height: 29rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-58 { - height: 29rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-58 { - height: 29rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-58 { - height: 29rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-58 { - height: 29rem; - } -} -.h-59 { - height: 29.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-59 { - height: 29.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-59 { - height: 29.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-59 { - height: 29.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-59 { - height: 29.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-59 { - height: 29.5rem; - } -} -.h-60 { - height: 30rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-60 { - height: 30rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-60 { - height: 30rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-60 { - height: 30rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-60 { - height: 30rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-60 { - height: 30rem; - } -} -.h-61 { - height: 30.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-61 { - height: 30.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-61 { - height: 30.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-61 { - height: 30.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-61 { - height: 30.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-61 { - height: 30.5rem; - } -} -.h-62 { - height: 31rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-62 { - height: 31rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-62 { - height: 31rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-62 { - height: 31rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-62 { - height: 31rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-62 { - height: 31rem; - } -} -.h-63 { - height: 31.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-63 { - height: 31.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-63 { - height: 31.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-63 { - height: 31.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-63 { - height: 31.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-63 { - height: 31.5rem; - } -} -.h-64 { - height: 32rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-64 { - height: 32rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-64 { - height: 32rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-64 { - height: 32rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-64 { - height: 32rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-64 { - height: 32rem; - } -} -.h-65 { - height: 32.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-65 { - height: 32.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-65 { - height: 32.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-65 { - height: 32.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-65 { - height: 32.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-65 { - height: 32.5rem; - } -} -.h-66 { - height: 33rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-66 { - height: 33rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-66 { - height: 33rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-66 { - height: 33rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-66 { - height: 33rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-66 { - height: 33rem; - } -} -.h-67 { - height: 33.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-67 { - height: 33.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-67 { - height: 33.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-67 { - height: 33.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-67 { - height: 33.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-67 { - height: 33.5rem; - } -} -.h-68 { - height: 34rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-68 { - height: 34rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-68 { - height: 34rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-68 { - height: 34rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-68 { - height: 34rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-68 { - height: 34rem; - } -} -.h-69 { - height: 34.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-69 { - height: 34.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-69 { - height: 34.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-69 { - height: 34.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-69 { - height: 34.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-69 { - height: 34.5rem; - } -} -.h-70 { - height: 35rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-70 { - height: 35rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-70 { - height: 35rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-70 { - height: 35rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-70 { - height: 35rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-70 { - height: 35rem; - } -} -.h-71 { - height: 35.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-71 { - height: 35.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-71 { - height: 35.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-71 { - height: 35.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-71 { - height: 35.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-71 { - height: 35.5rem; - } -} -.h-72 { - height: 36rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-72 { - height: 36rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-72 { - height: 36rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-72 { - height: 36rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-72 { - height: 36rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-72 { - height: 36rem; - } -} -.h-73 { - height: 36.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-73 { - height: 36.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-73 { - height: 36.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-73 { - height: 36.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-73 { - height: 36.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-73 { - height: 36.5rem; - } -} -.h-74 { - height: 37rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-74 { - height: 37rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-74 { - height: 37rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-74 { - height: 37rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-74 { - height: 37rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-74 { - height: 37rem; - } -} -.h-75 { - height: 37.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-75 { - height: 37.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-75 { - height: 37.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-75 { - height: 37.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-75 { - height: 37.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-75 { - height: 37.5rem; - } -} -.h-76 { - height: 38rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-76 { - height: 38rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-76 { - height: 38rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-76 { - height: 38rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-76 { - height: 38rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-76 { - height: 38rem; - } -} -.h-77 { - height: 38.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-77 { - height: 38.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-77 { - height: 38.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-77 { - height: 38.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-77 { - height: 38.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-77 { - height: 38.5rem; - } -} -.h-78 { - height: 39rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-78 { - height: 39rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-78 { - height: 39rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-78 { - height: 39rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-78 { - height: 39rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-78 { - height: 39rem; - } -} -.h-79 { - height: 39.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-79 { - height: 39.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-79 { - height: 39.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-79 { - height: 39.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-79 { - height: 39.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-79 { - height: 39.5rem; - } -} -.h-80 { - height: 40rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-80 { - height: 40rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-80 { - height: 40rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-80 { - height: 40rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-80 { - height: 40rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-80 { - height: 40rem; - } -} -.h-81 { - height: 40.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-81 { - height: 40.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-81 { - height: 40.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-81 { - height: 40.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-81 { - height: 40.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-81 { - height: 40.5rem; - } -} -.h-82 { - height: 41rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-82 { - height: 41rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-82 { - height: 41rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-82 { - height: 41rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-82 { - height: 41rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-82 { - height: 41rem; - } -} -.h-83 { - height: 41.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-83 { - height: 41.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-83 { - height: 41.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-83 { - height: 41.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-83 { - height: 41.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-83 { - height: 41.5rem; - } -} -.h-84 { - height: 42rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-84 { - height: 42rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-84 { - height: 42rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-84 { - height: 42rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-84 { - height: 42rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-84 { - height: 42rem; - } -} -.h-85 { - height: 42.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-85 { - height: 42.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-85 { - height: 42.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-85 { - height: 42.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-85 { - height: 42.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-85 { - height: 42.5rem; - } -} -.h-86 { - height: 43rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-86 { - height: 43rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-86 { - height: 43rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-86 { - height: 43rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-86 { - height: 43rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-86 { - height: 43rem; - } -} -.h-87 { - height: 43.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-87 { - height: 43.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-87 { - height: 43.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-87 { - height: 43.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-87 { - height: 43.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-87 { - height: 43.5rem; - } -} -.h-88 { - height: 44rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-88 { - height: 44rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-88 { - height: 44rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-88 { - height: 44rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-88 { - height: 44rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-88 { - height: 44rem; - } -} -.h-89 { - height: 44.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-89 { - height: 44.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-89 { - height: 44.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-89 { - height: 44.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-89 { - height: 44.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-89 { - height: 44.5rem; - } -} -.h-90 { - height: 45rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-90 { - height: 45rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-90 { - height: 45rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-90 { - height: 45rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-90 { - height: 45rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-90 { - height: 45rem; - } -} -.h-91 { - height: 45.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-91 { - height: 45.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-91 { - height: 45.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-91 { - height: 45.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-91 { - height: 45.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-91 { - height: 45.5rem; - } -} -.h-92 { - height: 46rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-92 { - height: 46rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-92 { - height: 46rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-92 { - height: 46rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-92 { - height: 46rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-92 { - height: 46rem; - } -} -.h-93 { - height: 46.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-93 { - height: 46.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-93 { - height: 46.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-93 { - height: 46.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-93 { - height: 46.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-93 { - height: 46.5rem; - } -} -.h-94 { - height: 47rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-94 { - height: 47rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-94 { - height: 47rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-94 { - height: 47rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-94 { - height: 47rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-94 { - height: 47rem; - } -} -.h-95 { - height: 47.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-95 { - height: 47.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-95 { - height: 47.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-95 { - height: 47.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-95 { - height: 47.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-95 { - height: 47.5rem; - } -} -.h-96 { - height: 48rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-96 { - height: 48rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-96 { - height: 48rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-96 { - height: 48rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-96 { - height: 48rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-96 { - height: 48rem; - } -} -.h-97 { - height: 48.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-97 { - height: 48.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-97 { - height: 48.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-97 { - height: 48.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-97 { - height: 48.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-97 { - height: 48.5rem; - } -} -.h-98 { - height: 49rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-98 { - height: 49rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-98 { - height: 49rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-98 { - height: 49rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-98 { - height: 49rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-98 { - height: 49rem; - } -} -.h-99 { - height: 49.5rem; -} - -@media only screen and (min-width: 576px) { - .h-xs-99 { - height: 49.5rem; - } -} -@media only screen and (min-width: 768px) { - .h-sm-99 { - height: 49.5rem; - } -} -@media only screen and (min-width: 992px) { - .h-md-99 { - height: 49.5rem; - } -} -@media only screen and (min-width: 1200px) { - .h-lg-99 { - height: 49.5rem; - } -} -@media only screen and (min-width: 1600px) { - .h-xlg-99 { - height: 49.5rem; - } -} -/** - * Spacing - * - * creates margin and padding for each direction and for each breakpont - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * mixin: spacing for single padding or margin - * - * - */ -/** - * mixin: spacing for each breakpoint - * - * - */ -/** - * - * - * - */ -.marginless { - margin: 0; -} - -.paddingless { - padding: 0; -} - -.m-last-child-0 > *:last-child { - margin: 0; -} - -.m-top-last-child-0 > *:last-child { - margin-top: 0; -} - -.m-bottom-last-child-0 > *:last-child { - margin-bottom: 0; -} - -.m-0 { - margin: 0; -} - -.m-1 { - margin: 1px; -} - -.m-2 { - margin: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-2 { - margin: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-2 { - margin: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-2 { - margin: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-2 { - margin: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-2 { - margin: 0.125rem; - } -} -.m-3 { - margin: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-3 { - margin: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-3 { - margin: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-3 { - margin: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-3 { - margin: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-3 { - margin: 0.5rem; - } -} -.m-4 { - margin: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-4 { - margin: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-4 { - margin: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-4 { - margin: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-4 { - margin: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-4 { - margin: 1.125rem; - } -} -.m-5 { - margin: 2rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-5 { - margin: 2rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-5 { - margin: 2rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-5 { - margin: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-5 { - margin: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-5 { - margin: 2rem; - } -} -.m-6 { - margin: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-6 { - margin: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-6 { - margin: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-6 { - margin: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-6 { - margin: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-6 { - margin: 3.125rem; - } -} -.m-7 { - margin: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-7 { - margin: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-7 { - margin: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-7 { - margin: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-7 { - margin: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-7 { - margin: 4.5rem; - } -} -.m-8 { - margin: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-8 { - margin: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-8 { - margin: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-8 { - margin: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-8 { - margin: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-8 { - margin: 6.125rem; - } -} -.m-9 { - margin: 8rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-9 { - margin: 8rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-9 { - margin: 8rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-9 { - margin: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-9 { - margin: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-9 { - margin: 8rem; - } -} -.m-10 { - margin: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .m-xs-10 { - margin: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-sm-10 { - margin: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-md-10 { - margin: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-lg-10 { - margin: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-xlg-10 { - margin: 10.125rem; - } -} -.m-top-0 { - margin-top: 0; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-0 { - margin-top: 0; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-0 { - margin-top: 0; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-0 { - margin-top: 0; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-0 { - margin-top: 0; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-0 { - margin-top: 0; - } -} -.m-top-1 { - margin-top: 1px; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-1 { - margin-top: 1px; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-1 { - margin-top: 1px; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-1 { - margin-top: 1px; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-1 { - margin-top: 1px; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-1 { - margin-top: 1px; - } -} -.m-top-2 { - margin-top: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-2 { - margin-top: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-2 { - margin-top: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-2 { - margin-top: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-2 { - margin-top: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-2 { - margin-top: 0.125rem; - } -} -.m-top-3 { - margin-top: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-3 { - margin-top: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-3 { - margin-top: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-3 { - margin-top: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-3 { - margin-top: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-3 { - margin-top: 0.5rem; - } -} -.m-top-4 { - margin-top: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-4 { - margin-top: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-4 { - margin-top: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-4 { - margin-top: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-4 { - margin-top: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-4 { - margin-top: 1.125rem; - } -} -.m-top-5 { - margin-top: 2rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-5 { - margin-top: 2rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-5 { - margin-top: 2rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-5 { - margin-top: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-5 { - margin-top: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-5 { - margin-top: 2rem; - } -} -.m-top-6 { - margin-top: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-6 { - margin-top: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-6 { - margin-top: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-6 { - margin-top: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-6 { - margin-top: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-6 { - margin-top: 3.125rem; - } -} -.m-top-7 { - margin-top: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-7 { - margin-top: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-7 { - margin-top: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-7 { - margin-top: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-7 { - margin-top: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-7 { - margin-top: 4.5rem; - } -} -.m-top-8 { - margin-top: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-8 { - margin-top: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-8 { - margin-top: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-8 { - margin-top: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-8 { - margin-top: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-8 { - margin-top: 6.125rem; - } -} -.m-top-9 { - margin-top: 8rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-9 { - margin-top: 8rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-9 { - margin-top: 8rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-9 { - margin-top: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-9 { - margin-top: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-9 { - margin-top: 8rem; - } -} -.m-top-10 { - margin-top: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .m-top-xs-10 { - margin-top: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-top-sm-10 { - margin-top: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-top-md-10 { - margin-top: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-top-lg-10 { - margin-top: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-top-xlg-10 { - margin-top: 10.125rem; - } -} -.m-bottom-0 { - margin-bottom: 0; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-0 { - margin-bottom: 0; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-0 { - margin-bottom: 0; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-0 { - margin-bottom: 0; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-0 { - margin-bottom: 0; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-0 { - margin-bottom: 0; - } -} -.m-bottom-1 { - margin-bottom: 1px; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-1 { - margin-bottom: 1px; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-1 { - margin-bottom: 1px; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-1 { - margin-bottom: 1px; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-1 { - margin-bottom: 1px; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-1 { - margin-bottom: 1px; - } -} -.m-bottom-2 { - margin-bottom: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-2 { - margin-bottom: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-2 { - margin-bottom: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-2 { - margin-bottom: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-2 { - margin-bottom: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-2 { - margin-bottom: 0.125rem; - } -} -.m-bottom-3 { - margin-bottom: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-3 { - margin-bottom: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-3 { - margin-bottom: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-3 { - margin-bottom: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-3 { - margin-bottom: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-3 { - margin-bottom: 0.5rem; - } -} -.m-bottom-4 { - margin-bottom: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-4 { - margin-bottom: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-4 { - margin-bottom: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-4 { - margin-bottom: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-4 { - margin-bottom: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-4 { - margin-bottom: 1.125rem; - } -} -.m-bottom-5 { - margin-bottom: 2rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-5 { - margin-bottom: 2rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-5 { - margin-bottom: 2rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-5 { - margin-bottom: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-5 { - margin-bottom: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-5 { - margin-bottom: 2rem; - } -} -.m-bottom-6 { - margin-bottom: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-6 { - margin-bottom: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-6 { - margin-bottom: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-6 { - margin-bottom: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-6 { - margin-bottom: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-6 { - margin-bottom: 3.125rem; - } -} -.m-bottom-7 { - margin-bottom: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-7 { - margin-bottom: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-7 { - margin-bottom: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-7 { - margin-bottom: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-7 { - margin-bottom: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-7 { - margin-bottom: 4.5rem; - } -} -.m-bottom-8 { - margin-bottom: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-8 { - margin-bottom: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-8 { - margin-bottom: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-8 { - margin-bottom: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-8 { - margin-bottom: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-8 { - margin-bottom: 6.125rem; - } -} -.m-bottom-9 { - margin-bottom: 8rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-9 { - margin-bottom: 8rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-9 { - margin-bottom: 8rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-9 { - margin-bottom: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-9 { - margin-bottom: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-9 { - margin-bottom: 8rem; - } -} -.m-bottom-10 { - margin-bottom: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .m-bottom-xs-10 { - margin-bottom: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-bottom-sm-10 { - margin-bottom: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-bottom-md-10 { - margin-bottom: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-bottom-lg-10 { - margin-bottom: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-bottom-xlg-10 { - margin-bottom: 10.125rem; - } -} -.m-left-0 { - margin-left: 0; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-0 { - margin-left: 0; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-0 { - margin-left: 0; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-0 { - margin-left: 0; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-0 { - margin-left: 0; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-0 { - margin-left: 0; - } -} -.m-left-1 { - margin-left: 1px; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-1 { - margin-left: 1px; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-1 { - margin-left: 1px; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-1 { - margin-left: 1px; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-1 { - margin-left: 1px; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-1 { - margin-left: 1px; - } -} -.m-left-2 { - margin-left: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-2 { - margin-left: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-2 { - margin-left: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-2 { - margin-left: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-2 { - margin-left: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-2 { - margin-left: 0.125rem; - } -} -.m-left-3 { - margin-left: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-3 { - margin-left: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-3 { - margin-left: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-3 { - margin-left: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-3 { - margin-left: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-3 { - margin-left: 0.5rem; - } -} -.m-left-4 { - margin-left: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-4 { - margin-left: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-4 { - margin-left: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-4 { - margin-left: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-4 { - margin-left: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-4 { - margin-left: 1.125rem; - } -} -.m-left-5 { - margin-left: 2rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-5 { - margin-left: 2rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-5 { - margin-left: 2rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-5 { - margin-left: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-5 { - margin-left: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-5 { - margin-left: 2rem; - } -} -.m-left-6 { - margin-left: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-6 { - margin-left: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-6 { - margin-left: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-6 { - margin-left: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-6 { - margin-left: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-6 { - margin-left: 3.125rem; - } -} -.m-left-7 { - margin-left: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-7 { - margin-left: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-7 { - margin-left: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-7 { - margin-left: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-7 { - margin-left: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-7 { - margin-left: 4.5rem; - } -} -.m-left-8 { - margin-left: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-8 { - margin-left: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-8 { - margin-left: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-8 { - margin-left: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-8 { - margin-left: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-8 { - margin-left: 6.125rem; - } -} -.m-left-9 { - margin-left: 8rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-9 { - margin-left: 8rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-9 { - margin-left: 8rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-9 { - margin-left: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-9 { - margin-left: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-9 { - margin-left: 8rem; - } -} -.m-left-10 { - margin-left: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .m-left-xs-10 { - margin-left: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-left-sm-10 { - margin-left: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-left-md-10 { - margin-left: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-left-lg-10 { - margin-left: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-left-xlg-10 { - margin-left: 10.125rem; - } -} -.m-right-0 { - margin-right: 0; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-0 { - margin-right: 0; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-0 { - margin-right: 0; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-0 { - margin-right: 0; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-0 { - margin-right: 0; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-0 { - margin-right: 0; - } -} -.m-right-1 { - margin-right: 1px; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-1 { - margin-right: 1px; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-1 { - margin-right: 1px; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-1 { - margin-right: 1px; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-1 { - margin-right: 1px; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-1 { - margin-right: 1px; - } -} -.m-right-2 { - margin-right: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-2 { - margin-right: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-2 { - margin-right: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-2 { - margin-right: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-2 { - margin-right: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-2 { - margin-right: 0.125rem; - } -} -.m-right-3 { - margin-right: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-3 { - margin-right: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-3 { - margin-right: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-3 { - margin-right: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-3 { - margin-right: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-3 { - margin-right: 0.5rem; - } -} -.m-right-4 { - margin-right: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-4 { - margin-right: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-4 { - margin-right: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-4 { - margin-right: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-4 { - margin-right: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-4 { - margin-right: 1.125rem; - } -} -.m-right-5 { - margin-right: 2rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-5 { - margin-right: 2rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-5 { - margin-right: 2rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-5 { - margin-right: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-5 { - margin-right: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-5 { - margin-right: 2rem; - } -} -.m-right-6 { - margin-right: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-6 { - margin-right: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-6 { - margin-right: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-6 { - margin-right: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-6 { - margin-right: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-6 { - margin-right: 3.125rem; - } -} -.m-right-7 { - margin-right: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-7 { - margin-right: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-7 { - margin-right: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-7 { - margin-right: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-7 { - margin-right: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-7 { - margin-right: 4.5rem; - } -} -.m-right-8 { - margin-right: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-8 { - margin-right: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-8 { - margin-right: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-8 { - margin-right: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-8 { - margin-right: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-8 { - margin-right: 6.125rem; - } -} -.m-right-9 { - margin-right: 8rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-9 { - margin-right: 8rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-9 { - margin-right: 8rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-9 { - margin-right: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-9 { - margin-right: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-9 { - margin-right: 8rem; - } -} -.m-right-10 { - margin-right: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .m-right-xs-10 { - margin-right: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .m-right-sm-10 { - margin-right: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .m-right-md-10 { - margin-right: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .m-right-lg-10 { - margin-right: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .m-right-xlg-10 { - margin-right: 10.125rem; - } -} -.p-0 { - padding: 0; -} - -.p-1 { - padding: 1px; -} - -.p-0 { - padding: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-0 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-0 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-0 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-0 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-0 { - padding: 0.125rem; - } -} -.p-1 { - padding: 0rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-1 { - padding: 0rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-1 { - padding: 0rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-1 { - padding: 0rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-1 { - padding: 0rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-1 { - padding: 0rem; - } -} -.p-2 { - padding: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-2 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-2 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-2 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-2 { - padding: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-2 { - padding: 0.125rem; - } -} -.p-3 { - padding: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-3 { - padding: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-3 { - padding: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-3 { - padding: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-3 { - padding: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-3 { - padding: 0.5rem; - } -} -.p-4 { - padding: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-4 { - padding: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-4 { - padding: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-4 { - padding: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-4 { - padding: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-4 { - padding: 1.125rem; - } -} -.p-5 { - padding: 2rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-5 { - padding: 2rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-5 { - padding: 2rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-5 { - padding: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-5 { - padding: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-5 { - padding: 2rem; - } -} -.p-6 { - padding: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-6 { - padding: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-6 { - padding: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-6 { - padding: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-6 { - padding: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-6 { - padding: 3.125rem; - } -} -.p-7 { - padding: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-7 { - padding: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-7 { - padding: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-7 { - padding: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-7 { - padding: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-7 { - padding: 4.5rem; - } -} -.p-8 { - padding: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-8 { - padding: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-8 { - padding: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-8 { - padding: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-8 { - padding: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-8 { - padding: 6.125rem; - } -} -.p-9 { - padding: 8rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-9 { - padding: 8rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-9 { - padding: 8rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-9 { - padding: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-9 { - padding: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-9 { - padding: 8rem; - } -} -.p-10 { - padding: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .p-xs-10 { - padding: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-sm-10 { - padding: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-md-10 { - padding: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-lg-10 { - padding: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-xlg-10 { - padding: 10.125rem; - } -} -.p-top-0 { - padding-top: 0; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-0 { - padding-top: 0; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-0 { - padding-top: 0; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-0 { - padding-top: 0; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-0 { - padding-top: 0; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-0 { - padding-top: 0; - } -} -.p-top-1 { - padding-top: 1px; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-1 { - padding-top: 1px; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-1 { - padding-top: 1px; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-1 { - padding-top: 1px; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-1 { - padding-top: 1px; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-1 { - padding-top: 1px; - } -} -.p-top-0 { - padding-top: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-0 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-0 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-0 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-0 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-0 { - padding-top: 0.125rem; - } -} -.p-top-1 { - padding-top: 0rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-1 { - padding-top: 0rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-1 { - padding-top: 0rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-1 { - padding-top: 0rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-1 { - padding-top: 0rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-1 { - padding-top: 0rem; - } -} -.p-top-2 { - padding-top: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-2 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-2 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-2 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-2 { - padding-top: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-2 { - padding-top: 0.125rem; - } -} -.p-top-3 { - padding-top: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-3 { - padding-top: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-3 { - padding-top: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-3 { - padding-top: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-3 { - padding-top: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-3 { - padding-top: 0.5rem; - } -} -.p-top-4 { - padding-top: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-4 { - padding-top: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-4 { - padding-top: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-4 { - padding-top: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-4 { - padding-top: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-4 { - padding-top: 1.125rem; - } -} -.p-top-5 { - padding-top: 2rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-5 { - padding-top: 2rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-5 { - padding-top: 2rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-5 { - padding-top: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-5 { - padding-top: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-5 { - padding-top: 2rem; - } -} -.p-top-6 { - padding-top: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-6 { - padding-top: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-6 { - padding-top: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-6 { - padding-top: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-6 { - padding-top: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-6 { - padding-top: 3.125rem; - } -} -.p-top-7 { - padding-top: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-7 { - padding-top: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-7 { - padding-top: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-7 { - padding-top: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-7 { - padding-top: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-7 { - padding-top: 4.5rem; - } -} -.p-top-8 { - padding-top: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-8 { - padding-top: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-8 { - padding-top: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-8 { - padding-top: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-8 { - padding-top: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-8 { - padding-top: 6.125rem; - } -} -.p-top-9 { - padding-top: 8rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-9 { - padding-top: 8rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-9 { - padding-top: 8rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-9 { - padding-top: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-9 { - padding-top: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-9 { - padding-top: 8rem; - } -} -.p-top-10 { - padding-top: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .p-top-xs-10 { - padding-top: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-top-sm-10 { - padding-top: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-top-md-10 { - padding-top: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-top-lg-10 { - padding-top: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-top-xlg-10 { - padding-top: 10.125rem; - } -} -.p-bottom-0 { - padding-bottom: 0; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-0 { - padding-bottom: 0; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-0 { - padding-bottom: 0; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-0 { - padding-bottom: 0; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-0 { - padding-bottom: 0; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-0 { - padding-bottom: 0; - } -} -.p-bottom-1 { - padding-bottom: 1px; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-1 { - padding-bottom: 1px; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-1 { - padding-bottom: 1px; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-1 { - padding-bottom: 1px; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-1 { - padding-bottom: 1px; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-1 { - padding-bottom: 1px; - } -} -.p-bottom-0 { - padding-bottom: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-0 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-0 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-0 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-0 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-0 { - padding-bottom: 0.125rem; - } -} -.p-bottom-1 { - padding-bottom: 0rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-1 { - padding-bottom: 0rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-1 { - padding-bottom: 0rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-1 { - padding-bottom: 0rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-1 { - padding-bottom: 0rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-1 { - padding-bottom: 0rem; - } -} -.p-bottom-2 { - padding-bottom: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-2 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-2 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-2 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-2 { - padding-bottom: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-2 { - padding-bottom: 0.125rem; - } -} -.p-bottom-3 { - padding-bottom: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-3 { - padding-bottom: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-3 { - padding-bottom: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-3 { - padding-bottom: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-3 { - padding-bottom: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-3 { - padding-bottom: 0.5rem; - } -} -.p-bottom-4 { - padding-bottom: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-4 { - padding-bottom: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-4 { - padding-bottom: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-4 { - padding-bottom: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-4 { - padding-bottom: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-4 { - padding-bottom: 1.125rem; - } -} -.p-bottom-5 { - padding-bottom: 2rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-5 { - padding-bottom: 2rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-5 { - padding-bottom: 2rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-5 { - padding-bottom: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-5 { - padding-bottom: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-5 { - padding-bottom: 2rem; - } -} -.p-bottom-6 { - padding-bottom: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-6 { - padding-bottom: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-6 { - padding-bottom: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-6 { - padding-bottom: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-6 { - padding-bottom: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-6 { - padding-bottom: 3.125rem; - } -} -.p-bottom-7 { - padding-bottom: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-7 { - padding-bottom: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-7 { - padding-bottom: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-7 { - padding-bottom: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-7 { - padding-bottom: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-7 { - padding-bottom: 4.5rem; - } -} -.p-bottom-8 { - padding-bottom: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-8 { - padding-bottom: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-8 { - padding-bottom: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-8 { - padding-bottom: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-8 { - padding-bottom: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-8 { - padding-bottom: 6.125rem; - } -} -.p-bottom-9 { - padding-bottom: 8rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-9 { - padding-bottom: 8rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-9 { - padding-bottom: 8rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-9 { - padding-bottom: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-9 { - padding-bottom: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-9 { - padding-bottom: 8rem; - } -} -.p-bottom-10 { - padding-bottom: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .p-bottom-xs-10 { - padding-bottom: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-bottom-sm-10 { - padding-bottom: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-bottom-md-10 { - padding-bottom: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-bottom-lg-10 { - padding-bottom: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-bottom-xlg-10 { - padding-bottom: 10.125rem; - } -} -.p-left-0 { - padding-left: 0; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-0 { - padding-left: 0; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-0 { - padding-left: 0; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-0 { - padding-left: 0; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-0 { - padding-left: 0; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-0 { - padding-left: 0; - } -} -.p-left-1 { - padding-left: 1px; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-1 { - padding-left: 1px; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-1 { - padding-left: 1px; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-1 { - padding-left: 1px; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-1 { - padding-left: 1px; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-1 { - padding-left: 1px; - } -} -.p-left-0 { - padding-left: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-0 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-0 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-0 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-0 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-0 { - padding-left: 0.125rem; - } -} -.p-left-1 { - padding-left: 0rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-1 { - padding-left: 0rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-1 { - padding-left: 0rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-1 { - padding-left: 0rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-1 { - padding-left: 0rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-1 { - padding-left: 0rem; - } -} -.p-left-2 { - padding-left: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-2 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-2 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-2 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-2 { - padding-left: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-2 { - padding-left: 0.125rem; - } -} -.p-left-3 { - padding-left: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-3 { - padding-left: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-3 { - padding-left: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-3 { - padding-left: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-3 { - padding-left: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-3 { - padding-left: 0.5rem; - } -} -.p-left-4 { - padding-left: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-4 { - padding-left: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-4 { - padding-left: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-4 { - padding-left: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-4 { - padding-left: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-4 { - padding-left: 1.125rem; - } -} -.p-left-5 { - padding-left: 2rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-5 { - padding-left: 2rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-5 { - padding-left: 2rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-5 { - padding-left: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-5 { - padding-left: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-5 { - padding-left: 2rem; - } -} -.p-left-6 { - padding-left: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-6 { - padding-left: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-6 { - padding-left: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-6 { - padding-left: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-6 { - padding-left: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-6 { - padding-left: 3.125rem; - } -} -.p-left-7 { - padding-left: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-7 { - padding-left: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-7 { - padding-left: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-7 { - padding-left: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-7 { - padding-left: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-7 { - padding-left: 4.5rem; - } -} -.p-left-8 { - padding-left: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-8 { - padding-left: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-8 { - padding-left: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-8 { - padding-left: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-8 { - padding-left: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-8 { - padding-left: 6.125rem; - } -} -.p-left-9 { - padding-left: 8rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-9 { - padding-left: 8rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-9 { - padding-left: 8rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-9 { - padding-left: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-9 { - padding-left: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-9 { - padding-left: 8rem; - } -} -.p-left-10 { - padding-left: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .p-left-xs-10 { - padding-left: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-left-sm-10 { - padding-left: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-left-md-10 { - padding-left: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-left-lg-10 { - padding-left: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-left-xlg-10 { - padding-left: 10.125rem; - } -} -.p-right-0 { - padding-right: 0; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-0 { - padding-right: 0; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-0 { - padding-right: 0; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-0 { - padding-right: 0; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-0 { - padding-right: 0; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-0 { - padding-right: 0; - } -} -.p-right-1 { - padding-right: 1px; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-1 { - padding-right: 1px; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-1 { - padding-right: 1px; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-1 { - padding-right: 1px; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-1 { - padding-right: 1px; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-1 { - padding-right: 1px; - } -} -.p-right-0 { - padding-right: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-0 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-0 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-0 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-0 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-0 { - padding-right: 0.125rem; - } -} -.p-right-1 { - padding-right: 0rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-1 { - padding-right: 0rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-1 { - padding-right: 0rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-1 { - padding-right: 0rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-1 { - padding-right: 0rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-1 { - padding-right: 0rem; - } -} -.p-right-2 { - padding-right: 0.125rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-2 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-2 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-2 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-2 { - padding-right: 0.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-2 { - padding-right: 0.125rem; - } -} -.p-right-3 { - padding-right: 0.5rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-3 { - padding-right: 0.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-3 { - padding-right: 0.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-3 { - padding-right: 0.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-3 { - padding-right: 0.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-3 { - padding-right: 0.5rem; - } -} -.p-right-4 { - padding-right: 1.125rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-4 { - padding-right: 1.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-4 { - padding-right: 1.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-4 { - padding-right: 1.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-4 { - padding-right: 1.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-4 { - padding-right: 1.125rem; - } -} -.p-right-5 { - padding-right: 2rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-5 { - padding-right: 2rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-5 { - padding-right: 2rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-5 { - padding-right: 2rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-5 { - padding-right: 2rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-5 { - padding-right: 2rem; - } -} -.p-right-6 { - padding-right: 3.125rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-6 { - padding-right: 3.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-6 { - padding-right: 3.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-6 { - padding-right: 3.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-6 { - padding-right: 3.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-6 { - padding-right: 3.125rem; - } -} -.p-right-7 { - padding-right: 4.5rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-7 { - padding-right: 4.5rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-7 { - padding-right: 4.5rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-7 { - padding-right: 4.5rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-7 { - padding-right: 4.5rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-7 { - padding-right: 4.5rem; - } -} -.p-right-8 { - padding-right: 6.125rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-8 { - padding-right: 6.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-8 { - padding-right: 6.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-8 { - padding-right: 6.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-8 { - padding-right: 6.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-8 { - padding-right: 6.125rem; - } -} -.p-right-9 { - padding-right: 8rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-9 { - padding-right: 8rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-9 { - padding-right: 8rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-9 { - padding-right: 8rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-9 { - padding-right: 8rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-9 { - padding-right: 8rem; - } -} -.p-right-10 { - padding-right: 10.125rem; -} - -@media only screen and (min-width: 576px) { - .p-right-xs-10 { - padding-right: 10.125rem; - } -} -@media only screen and (min-width: 768px) { - .p-right-sm-10 { - padding-right: 10.125rem; - } -} -@media only screen and (min-width: 992px) { - .p-right-md-10 { - padding-right: 10.125rem; - } -} -@media only screen and (min-width: 1200px) { - .p-right-lg-10 { - padding-right: 10.125rem; - } -} -@media only screen and (min-width: 1600px) { - .p-right-xlg-10 { - padding-right: 10.125rem; - } -} -/** - * colors - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.color-body { - color: var(--body); -} - -.color-text { - color: var(--text); -} - -.color-text-contrast { - color: var(--text-contrast); -} - -.color-primary { - color: var(--primary); -} - -.color-primary-contrast { - color: var(--primary-contrast); -} - -.color-active { - color: var(--active); -} - -.color-active-contrast { - color: var(--active-contrast); -} - -.color-link { - color: var(--link); -} - -.color-link-hover { - color: var(--link-hover); -} - -.color-danger { - color: var(--danger); -} - -.color-danger-contrast { - color: var(--danger-contrast); -} - -.color-info { - color: var(--info); -} - -.color-info-constrast { - color: var(--info-constrast); -} - -.color-success { - color: var(--success); -} - -.color-success-contrast { - color: var(--success-contrast); -} - -.color-warning { - color: var(--warning); -} - -.color-warning-contrast { - color: var(--warning-contrast); -} - -.color-background { - color: var(--background); -} - -.color-background-contrast { - color: var(--background-contrast); -} - -.color-background-alpha { - color: var(--background-alpha); -} - -.color-border { - color: var(--border); -} - -.color-border-contrast { - color: var(--border-contrast); -} - -.fill-body { - fill: var(--body); -} -.fill-body svg { - fill: var(--body); -} - -.fill-text { - fill: var(--text); -} -.fill-text svg { - fill: var(--text); -} - -.fill-text-contrast { - fill: var(--text-contrast); -} -.fill-text-contrast svg { - fill: var(--text-contrast); -} - -.fill-primary { - fill: var(--primary); -} -.fill-primary svg { - fill: var(--primary); -} - -.fill-primary-contrast { - fill: var(--primary-contrast); -} -.fill-primary-contrast svg { - fill: var(--primary-contrast); -} - -.fill-active { - fill: var(--active); -} -.fill-active svg { - fill: var(--active); -} - -.fill-active-contrast { - fill: var(--active-contrast); -} -.fill-active-contrast svg { - fill: var(--active-contrast); -} - -.fill-link { - fill: var(--link); -} -.fill-link svg { - fill: var(--link); -} - -.fill-link-hover { - fill: var(--link-hover); -} -.fill-link-hover svg { - fill: var(--link-hover); -} - -.fill-danger { - fill: var(--danger); -} -.fill-danger svg { - fill: var(--danger); -} - -.fill-danger-contrast { - fill: var(--danger-contrast); -} -.fill-danger-contrast svg { - fill: var(--danger-contrast); -} - -.fill-info { - fill: var(--info); -} -.fill-info svg { - fill: var(--info); -} - -.fill-info-constrast { - fill: var(--info-constrast); -} -.fill-info-constrast svg { - fill: var(--info-constrast); -} - -.fill-success { - fill: var(--success); -} -.fill-success svg { - fill: var(--success); -} - -.fill-success-contrast { - fill: var(--success-contrast); -} -.fill-success-contrast svg { - fill: var(--success-contrast); -} - -.fill-warning { - fill: var(--warning); -} -.fill-warning svg { - fill: var(--warning); -} - -.fill-warning-contrast { - fill: var(--warning-contrast); -} -.fill-warning-contrast svg { - fill: var(--warning-contrast); -} - -.fill-background { - fill: var(--background); -} -.fill-background svg { - fill: var(--background); -} - -.fill-background-contrast { - fill: var(--background-contrast); -} -.fill-background-contrast svg { - fill: var(--background-contrast); -} - -.fill-background-alpha { - fill: var(--background-alpha); -} -.fill-background-alpha svg { - fill: var(--background-alpha); -} - -.fill-border { - fill: var(--border); -} -.fill-border svg { - fill: var(--border); -} - -.fill-border-contrast { - fill: var(--border-contrast); -} -.fill-border-contrast svg { - fill: var(--border-contrast); -} - -.fill-body-hover:hover { - fill: var(--body); -} -.fill-body-hover:hover svg { - fill: var(--body); -} - -.fill-text-hover:hover { - fill: var(--text); -} -.fill-text-hover:hover svg { - fill: var(--text); -} - -.fill-text-contrast-hover:hover { - fill: var(--text-contrast); -} -.fill-text-contrast-hover:hover svg { - fill: var(--text-contrast); -} - -.fill-primary-hover:hover { - fill: var(--primary); -} -.fill-primary-hover:hover svg { - fill: var(--primary); -} - -.fill-primary-contrast-hover:hover { - fill: var(--primary-contrast); -} -.fill-primary-contrast-hover:hover svg { - fill: var(--primary-contrast); -} - -.fill-active-hover:hover { - fill: var(--active); -} -.fill-active-hover:hover svg { - fill: var(--active); -} - -.fill-active-contrast-hover:hover { - fill: var(--active-contrast); -} -.fill-active-contrast-hover:hover svg { - fill: var(--active-contrast); -} - -.fill-link-hover:hover { - fill: var(--link); -} -.fill-link-hover:hover svg { - fill: var(--link); -} - -.fill-link-hover-hover:hover { - fill: var(--link-hover); -} -.fill-link-hover-hover:hover svg { - fill: var(--link-hover); -} - -.fill-danger-hover:hover { - fill: var(--danger); -} -.fill-danger-hover:hover svg { - fill: var(--danger); -} - -.fill-danger-contrast-hover:hover { - fill: var(--danger-contrast); -} -.fill-danger-contrast-hover:hover svg { - fill: var(--danger-contrast); -} - -.fill-info-hover:hover { - fill: var(--info); -} -.fill-info-hover:hover svg { - fill: var(--info); -} - -.fill-info-constrast-hover:hover { - fill: var(--info-constrast); -} -.fill-info-constrast-hover:hover svg { - fill: var(--info-constrast); -} - -.fill-success-hover:hover { - fill: var(--success); -} -.fill-success-hover:hover svg { - fill: var(--success); -} - -.fill-success-contrast-hover:hover { - fill: var(--success-contrast); -} -.fill-success-contrast-hover:hover svg { - fill: var(--success-contrast); -} - -.fill-warning-hover:hover { - fill: var(--warning); -} -.fill-warning-hover:hover svg { - fill: var(--warning); -} - -.fill-warning-contrast-hover:hover { - fill: var(--warning-contrast); -} -.fill-warning-contrast-hover:hover svg { - fill: var(--warning-contrast); -} - -.fill-background-hover:hover { - fill: var(--background); -} -.fill-background-hover:hover svg { - fill: var(--background); -} - -.fill-background-contrast-hover:hover { - fill: var(--background-contrast); -} -.fill-background-contrast-hover:hover svg { - fill: var(--background-contrast); -} - -.fill-background-alpha-hover:hover { - fill: var(--background-alpha); -} -.fill-background-alpha-hover:hover svg { - fill: var(--background-alpha); -} - -.fill-border-hover:hover { - fill: var(--border); -} -.fill-border-hover:hover svg { - fill: var(--border); -} - -.fill-border-contrast-hover:hover { - fill: var(--border-contrast); -} -.fill-border-contrast-hover:hover svg { - fill: var(--border-contrast); -} - -.border-color-body { - border-color: var(--body); -} - -.border-color-text { - border-color: var(--text); -} - -.border-color-text-contrast { - border-color: var(--text-contrast); -} - -.border-color-primary { - border-color: var(--primary); -} - -.border-color-primary-contrast { - border-color: var(--primary-contrast); -} - -.border-color-active { - border-color: var(--active); -} - -.border-color-active-contrast { - border-color: var(--active-contrast); -} - -.border-color-link { - border-color: var(--link); -} - -.border-color-link-hover { - border-color: var(--link-hover); -} - -.border-color-danger { - border-color: var(--danger); -} - -.border-color-danger-contrast { - border-color: var(--danger-contrast); -} - -.border-color-info { - border-color: var(--info); -} - -.border-color-info-constrast { - border-color: var(--info-constrast); -} - -.border-color-success { - border-color: var(--success); -} - -.border-color-success-contrast { - border-color: var(--success-contrast); -} - -.border-color-warning { - border-color: var(--warning); -} - -.border-color-warning-contrast { - border-color: var(--warning-contrast); -} - -.border-color-background { - border-color: var(--background); -} - -.border-color-background-contrast { - border-color: var(--background-contrast); -} - -.border-color-background-alpha { - border-color: var(--background-alpha); -} - -.border-color-border { - border-color: var(--border); -} - -.border-color-border-contrast { - border-color: var(--border-contrast); -} - -.background-color-body { - background-color: var(--body); -} - -.background-color-text { - background-color: var(--text); -} - -.background-color-text-contrast { - background-color: var(--text-contrast); -} - -.background-color-primary { - background-color: var(--primary); -} - -.background-color-primary-contrast { - background-color: var(--primary-contrast); -} - -.background-color-active { - background-color: var(--active); -} - -.background-color-active-contrast { - background-color: var(--active-contrast); -} - -.background-color-link { - background-color: var(--link); -} - -.background-color-link-hover { - background-color: var(--link-hover); -} - -.background-color-danger { - background-color: var(--danger); -} - -.background-color-danger-contrast { - background-color: var(--danger-contrast); -} - -.background-color-info { - background-color: var(--info); -} - -.background-color-info-constrast { - background-color: var(--info-constrast); -} - -.background-color-success { - background-color: var(--success); -} - -.background-color-success-contrast { - background-color: var(--success-contrast); -} - -.background-color-warning { - background-color: var(--warning); -} - -.background-color-warning-contrast { - background-color: var(--warning-contrast); -} - -.background-color-background { - background-color: var(--background); -} - -.background-color-background-contrast { - background-color: var(--background-contrast); -} - -.background-color-background-alpha { - background-color: var(--background-alpha); -} - -.background-color-border { - background-color: var(--border); -} - -.background-color-border-contrast { - background-color: var(--border-contrast); -} - -/** - * typography - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -.left { - text-align: left; -} - -@media only screen and (min-width: 576px) { - .left-xs { - text-align: left; - } -} -@media only screen and (min-width: 768px) { - .left-sm { - text-align: left; - } -} -@media only screen and (min-width: 992px) { - .left-md { - text-align: left; - } -} -@media only screen and (min-width: 1200px) { - .left-lg { - text-align: left; - } -} -@media only screen and (min-width: 1600px) { - .left-xlg { - text-align: left; - } -} -.right { - text-align: right; -} - -@media only screen and (min-width: 576px) { - .right-xs { - text-align: right; - } -} -@media only screen and (min-width: 768px) { - .right-sm { - text-align: right; - } -} -@media only screen and (min-width: 992px) { - .right-md { - text-align: right; - } -} -@media only screen and (min-width: 1200px) { - .right-lg { - text-align: right; - } -} -@media only screen and (min-width: 1600px) { - .right-xlg { - text-align: right; - } -} -.center { - text-align: center; -} - -@media only screen and (min-width: 576px) { - .center-xs { - text-align: center; - } -} -@media only screen and (min-width: 768px) { - .center-sm { - text-align: center; - } -} -@media only screen and (min-width: 992px) { - .center-md { - text-align: center; - } -} -@media only screen and (min-width: 1200px) { - .center-lg { - text-align: center; - } -} -@media only screen and (min-width: 1600px) { - .center-xlg { - text-align: center; - } -} -.justify { - text-align: justify; -} - -@media only screen and (min-width: 576px) { - .justify-xs { - text-align: justify; - } -} -@media only screen and (min-width: 768px) { - .justify-sm { - text-align: justify; - } -} -@media only screen and (min-width: 992px) { - .justify-md { - text-align: justify; - } -} -@media only screen and (min-width: 1200px) { - .justify-lg { - text-align: justify; - } -} -@media only screen and (min-width: 1600px) { - .justify-xlg { - text-align: justify; - } -} -.uppercase { - text-transform: uppercase; -} - -@media only screen and (min-width: 576px) { - .uppercase-xs { - text-transform: uppercase; - } -} -@media only screen and (min-width: 768px) { - .uppercase-sm { - text-transform: uppercase; - } -} -@media only screen and (min-width: 992px) { - .uppercase-md { - text-transform: uppercase; - } -} -@media only screen and (min-width: 1200px) { - .uppercase-lg { - text-transform: uppercase; - } -} -@media only screen and (min-width: 1600px) { - .uppercase-xlg { - text-transform: uppercase; - } -} -.lowercase { - text-transform: lowercase; -} - -@media only screen and (min-width: 576px) { - .lowercase-xs { - text-transform: lowercase; - } -} -@media only screen and (min-width: 768px) { - .lowercase-sm { - text-transform: lowercase; - } -} -@media only screen and (min-width: 992px) { - .lowercase-md { - text-transform: lowercase; - } -} -@media only screen and (min-width: 1200px) { - .lowercase-lg { - text-transform: lowercase; - } -} -@media only screen and (min-width: 1600px) { - .lowercase-xlg { - text-transform: lowercase; - } -} -.crossed { - text-decoration: line-through; -} - -@media only screen and (min-width: 576px) { - .crossed-xs { - text-decoration: line-through; - } -} -@media only screen and (min-width: 768px) { - .crossed-sm { - text-decoration: line-through; - } -} -@media only screen and (min-width: 992px) { - .crossed-md { - text-decoration: line-through; - } -} -@media only screen and (min-width: 1200px) { - .crossed-lg { - text-decoration: line-through; - } -} -@media only screen and (min-width: 1600px) { - .crossed-xlg { - text-decoration: line-through; - } -} -.underline { - text-decoration: underline; -} - -@media only screen and (min-width: 576px) { - .underline-xs { - text-decoration: underline; - } -} -@media only screen and (min-width: 768px) { - .underline-sm { - text-decoration: underline; - } -} -@media only screen and (min-width: 992px) { - .underline-md { - text-decoration: underline; - } -} -@media only screen and (min-width: 1200px) { - .underline-lg { - text-decoration: underline; - } -} -@media only screen and (min-width: 1600px) { - .underline-xlg { - text-decoration: underline; - } -} -.capitalize { - text-transform: capitalize; -} - -@media only screen and (min-width: 576px) { - .capitalize-xs { - text-transform: capitalize; - } -} -@media only screen and (min-width: 768px) { - .capitalize-sm { - text-transform: capitalize; - } -} -@media only screen and (min-width: 992px) { - .capitalize-md { - text-transform: capitalize; - } -} -@media only screen and (min-width: 1200px) { - .capitalize-lg { - text-transform: capitalize; - } -} -@media only screen and (min-width: 1600px) { - .capitalize-xlg { - text-transform: capitalize; - } -} -.italic { - font-style: italic; -} - -@media only screen and (min-width: 576px) { - .italic-xs { - font-style: italic; - } -} -@media only screen and (min-width: 768px) { - .italic-sm { - font-style: italic; - } -} -@media only screen and (min-width: 992px) { - .italic-md { - font-style: italic; - } -} -@media only screen and (min-width: 1200px) { - .italic-lg { - font-style: italic; - } -} -@media only screen and (min-width: 1600px) { - .italic-xlg { - font-style: italic; - } -} -.light { - font-weight: lighter; -} - -@media only screen and (min-width: 576px) { - .light-xs { - font-weight: lighter; - } -} -@media only screen and (min-width: 768px) { - .light-sm { - font-weight: lighter; - } -} -@media only screen and (min-width: 992px) { - .light-md { - font-weight: lighter; - } -} -@media only screen and (min-width: 1200px) { - .light-lg { - font-weight: lighter; - } -} -@media only screen and (min-width: 1600px) { - .light-xlg { - font-weight: lighter; - } -} -.normal { - font-weight: normal; -} - -@media only screen and (min-width: 576px) { - .normal-xs { - font-weight: normal; - } -} -@media only screen and (min-width: 768px) { - .normal-sm { - font-weight: normal; - } -} -@media only screen and (min-width: 992px) { - .normal-md { - font-weight: normal; - } -} -@media only screen and (min-width: 1200px) { - .normal-lg { - font-weight: normal; - } -} -@media only screen and (min-width: 1600px) { - .normal-xlg { - font-weight: normal; - } -} -.medium { - font-weight: medium; -} - -@media only screen and (min-width: 576px) { - .medium-xs { - font-weight: medium; - } -} -@media only screen and (min-width: 768px) { - .medium-sm { - font-weight: medium; - } -} -@media only screen and (min-width: 992px) { - .medium-md { - font-weight: medium; - } -} -@media only screen and (min-width: 1200px) { - .medium-lg { - font-weight: medium; - } -} -@media only screen and (min-width: 1600px) { - .medium-xlg { - font-weight: medium; - } -} -.bold { - font-weight: bolder; -} - -@media only screen and (min-width: 576px) { - .bold-xs { - font-weight: bolder; - } -} -@media only screen and (min-width: 768px) { - .bold-sm { - font-weight: bolder; - } -} -@media only screen and (min-width: 992px) { - .bold-md { - font-weight: bolder; - } -} -@media only screen and (min-width: 1200px) { - .bold-lg { - font-weight: bolder; - } -} -@media only screen and (min-width: 1600px) { - .bold-xlg { - font-weight: bolder; - } -} -/** - * font-sizes - * - * - */ -.size-default { - font-size: 0.9rem; -} - -@media only screen and (min-width: 576px) { - .size-xs-default { - font-size: 0.9rem; - } -} -@media only screen and (min-width: 768px) { - .size-sm-default { - font-size: 0.9rem; - } -} -@media only screen and (min-width: 992px) { - .size-md-default { - font-size: 0.9rem; - } -} -@media only screen and (min-width: 1200px) { - .size-lg-default { - font-size: 0.9rem; - } -} -@media only screen and (min-width: 1600px) { - .size-xlg-default { - font-size: 0.9rem; - } -} -.size-small { - font-size: 0.675rem; -} - -@media only screen and (min-width: 576px) { - .size-xs-small { - font-size: 0.675rem; - } -} -@media only screen and (min-width: 768px) { - .size-sm-small { - font-size: 0.675rem; - } -} -@media only screen and (min-width: 992px) { - .size-md-small { - font-size: 0.675rem; - } -} -@media only screen and (min-width: 1200px) { - .size-lg-small { - font-size: 0.675rem; - } -} -@media only screen and (min-width: 1600px) { - .size-xlg-small { - font-size: 0.675rem; - } -} -.size-medium { - font-size: 1.35rem; -} - -@media only screen and (min-width: 576px) { - .size-xs-medium { - font-size: 1.35rem; - } -} -@media only screen and (min-width: 768px) { - .size-sm-medium { - font-size: 1.35rem; - } -} -@media only screen and (min-width: 992px) { - .size-md-medium { - font-size: 1.35rem; - } -} -@media only screen and (min-width: 1200px) { - .size-lg-medium { - font-size: 1.35rem; - } -} -@media only screen and (min-width: 1600px) { - .size-xlg-medium { - font-size: 1.35rem; - } -} -.size-large { - font-size: 1.8rem; -} - -@media only screen and (min-width: 576px) { - .size-xs-large { - font-size: 1.8rem; - } -} -@media only screen and (min-width: 768px) { - .size-sm-large { - font-size: 1.8rem; - } -} -@media only screen and (min-width: 992px) { - .size-md-large { - font-size: 1.8rem; - } -} -@media only screen and (min-width: 1200px) { - .size-lg-large { - font-size: 1.8rem; - } -} -@media only screen and (min-width: 1600px) { - .size-xlg-large { - font-size: 1.8rem; - } -} -.size-big { - font-size: 2.7rem; -} - -@media only screen and (min-width: 576px) { - .size-xs-big { - font-size: 2.7rem; - } -} -@media only screen and (min-width: 768px) { - .size-sm-big { - font-size: 2.7rem; - } -} -@media only screen and (min-width: 992px) { - .size-md-big { - font-size: 2.7rem; - } -} -@media only screen and (min-width: 1200px) { - .size-lg-big { - font-size: 2.7rem; - } -} -@media only screen and (min-width: 1600px) { - .size-xlg-big { - font-size: 2.7rem; - } -} -/** - * white-space - * - * - */ -.white-space-normal { - white-space: normal; -} - -@media only screen and (min-width: 576px) { - .white-space-normal-xs { - white-space: normal; - } -} -@media only screen and (min-width: 768px) { - .white-space-normal-sm { - white-space: normal; - } -} -@media only screen and (min-width: 992px) { - .white-space-normal-md { - white-space: normal; - } -} -@media only screen and (min-width: 1200px) { - .white-space-normal-lg { - white-space: normal; - } -} -@media only screen and (min-width: 1600px) { - .white-space-normal-xlg { - white-space: normal; - } -} -.white-space-nowrap { - white-space: nowrap; -} - -@media only screen and (min-width: 576px) { - .white-space-nowrap-xs { - white-space: nowrap; - } -} -@media only screen and (min-width: 768px) { - .white-space-nowrap-sm { - white-space: nowrap; - } -} -@media only screen and (min-width: 992px) { - .white-space-nowrap-md { - white-space: nowrap; - } -} -@media only screen and (min-width: 1200px) { - .white-space-nowrap-lg { - white-space: nowrap; - } -} -@media only screen and (min-width: 1600px) { - .white-space-nowrap-xlg { - white-space: nowrap; - } -} -.white-space-pre { - white-space: pre; -} - -@media only screen and (min-width: 576px) { - .white-space-pre-xs { - white-space: pre; - } -} -@media only screen and (min-width: 768px) { - .white-space-pre-sm { - white-space: pre; - } -} -@media only screen and (min-width: 992px) { - .white-space-pre-md { - white-space: pre; - } -} -@media only screen and (min-width: 1200px) { - .white-space-pre-lg { - white-space: pre; - } -} -@media only screen and (min-width: 1600px) { - .white-space-pre-xlg { - white-space: pre; - } -} -.white-space-preline { - white-space: preline; -} - -@media only screen and (min-width: 576px) { - .white-space-preline-xs { - white-space: preline; - } -} -@media only screen and (min-width: 768px) { - .white-space-preline-sm { - white-space: preline; - } -} -@media only screen and (min-width: 992px) { - .white-space-preline-md { - white-space: preline; - } -} -@media only screen and (min-width: 1200px) { - .white-space-preline-lg { - white-space: preline; - } -} -@media only screen and (min-width: 1600px) { - .white-space-preline-xlg { - white-space: preline; - } -} -.white-space-preline { - white-space: pre-line; -} - -@media only screen and (min-width: 576px) { - .white-space-preline-xs { - white-space: pre-line; - } -} -@media only screen and (min-width: 768px) { - .white-space-preline-sm { - white-space: pre-line; - } -} -@media only screen and (min-width: 992px) { - .white-space-preline-md { - white-space: pre-line; - } -} -@media only screen and (min-width: 1200px) { - .white-space-preline-lg { - white-space: pre-line; - } -} -@media only screen and (min-width: 1600px) { - .white-space-preline-xlg { - white-space: pre-line; - } -} -.white-space-prewrap { - white-space: pre-wrap; -} - -@media only screen and (min-width: 576px) { - .white-space-prewrap-xs { - white-space: pre-wrap; - } -} -@media only screen and (min-width: 768px) { - .white-space-prewrap-sm { - white-space: pre-wrap; - } -} -@media only screen and (min-width: 992px) { - .white-space-prewrap-md { - white-space: pre-wrap; - } -} -@media only screen and (min-width: 1200px) { - .white-space-prewrap-lg { - white-space: pre-wrap; - } -} -@media only screen and (min-width: 1600px) { - .white-space-prewrap-xlg { - white-space: pre-wrap; - } -} -/** - * visibility - * - * - * @author Björn Hase, me@herr-hase.wtf - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://gitea.node001.net/tiny-components/plain-ui.git - * - */ -/** - * display - * - * - */ -.display-block { - display: block; -} - -@media only screen and (min-width: 576px) { - .display-block-xs { - display: block; - } -} -@media only screen and (min-width: 768px) { - .display-block-sm { - display: block; - } -} -@media only screen and (min-width: 992px) { - .display-block-md { - display: block; - } -} -@media only screen and (min-width: 1200px) { - .display-block-lg { - display: block; - } -} -@media only screen and (min-width: 1600px) { - .display-block-xlg { - display: block; - } -} -.display-inline { - display: inline; -} - -@media only screen and (min-width: 576px) { - .display-inline-xs { - display: inline; - } -} -@media only screen and (min-width: 768px) { - .display-inline-sm { - display: inline; - } -} -@media only screen and (min-width: 992px) { - .display-inline-md { - display: inline; - } -} -@media only screen and (min-width: 1200px) { - .display-inline-lg { - display: inline; - } -} -@media only screen and (min-width: 1600px) { - .display-inline-xlg { - display: inline; - } -} -.display-inline-block { - display: inline-block; -} - -@media only screen and (min-width: 576px) { - .display-inline-block-xs { - display: inline-block; - } -} -@media only screen and (min-width: 768px) { - .display-inline-block-sm { - display: inline-block; - } -} -@media only screen and (min-width: 992px) { - .display-inline-block-md { - display: inline-block; - } -} -@media only screen and (min-width: 1200px) { - .display-inline-block-lg { - display: inline-block; - } -} -@media only screen and (min-width: 1600px) { - .display-inline-block-xlg { - display: inline-block; - } -} -.display-flex { - display: flex; -} - -@media only screen and (min-width: 576px) { - .display-flex-xs { - display: flex; - } -} -@media only screen and (min-width: 768px) { - .display-flex-sm { - display: flex; - } -} -@media only screen and (min-width: 992px) { - .display-flex-md { - display: flex; - } -} -@media only screen and (min-width: 1200px) { - .display-flex-lg { - display: flex; - } -} -@media only screen and (min-width: 1600px) { - .display-flex-xlg { - display: flex; - } -} -.display-inline-flex { - display: inline-flex; -} - -@media only screen and (min-width: 576px) { - .display-inline-flex-xs { - display: inline-flex; - } -} -@media only screen and (min-width: 768px) { - .display-inline-flex-sm { - display: inline-flex; - } -} -@media only screen and (min-width: 992px) { - .display-inline-flex-md { - display: inline-flex; - } -} -@media only screen and (min-width: 1200px) { - .display-inline-flex-lg { - display: inline-flex; - } -} -@media only screen and (min-width: 1600px) { - .display-inline-flex-xlg { - display: inline-flex; - } -} -.display-table { - display: table; -} - -@media only screen and (min-width: 576px) { - .display-table-xs { - display: table; - } -} -@media only screen and (min-width: 768px) { - .display-table-sm { - display: table; - } -} -@media only screen and (min-width: 992px) { - .display-table-md { - display: table; - } -} -@media only screen and (min-width: 1200px) { - .display-table-lg { - display: table; - } -} -@media only screen and (min-width: 1600px) { - .display-table-xlg { - display: table; - } -} -/** - * for hidden-xs etc, show https://reflexgrid.com/#visibility-helpers - * - * @TODO full integration of reflexgrid will change this part - * - */ -/** - * Visibility - * - */ -.visibility-hidden { - visibility: hidden; -} - -.visibility-visible { - visibility: visible; -} - -.visibility-collapse { - visibility: collapse; -} - -/** - * Opacity - * - * - */ -.opacity-1 { - opacity: 0.1; -} - -.opacity-2 { - opacity: 0.2; -} - -.opacity-3 { - opacity: 0.3; -} - -.opacity-4 { - opacity: 0.4; -} - -.opacity-5 { - opacity: 0.5; -} - -.opacity-6 { - opacity: 0.6; -} - -.opacity-7 { - opacity: 0.7; -} - -.opacity-8 { - opacity: 0.8; -} - -.opacity-9 { - opacity: 0.9; -} - -.opacity-10 { - opacity: 1; -} - -.tiny-slider { - overflow-x: hidden; -} -.tiny-slider__inner { - position: relative; - transition: transform 0.3s ease-in-out; -} -.tiny-slider__item { - max-width: 100%; -} -.tiny-slider__button { - display: none; - border: none; - background: transparent; - width: 150px; - padding: 10px; -} -.tiny-slider__button .icon { - font-size: 3rem; -} -@media only screen and (min-width: 992px) { - .tiny-slider__button { - display: block; - } -} -.tiny-slider__button:hover { - cursor: pointer; -} -.tiny-slider__select { - padding: 1em; - justify-content: center; -} -.tiny-slider__select-item { - height: 25px; - width: 25px; - border: 1px solid var(--background); - background-color: var(--background-contrast); - margin: 0 0.5em; - transition: background-color 0.3s ease-in-out; -} -.tiny-slider__select-item:hover { - cursor: pointer; -} -.tiny-slider__select-item--current { - background-color: var(--background); -} - -.overflow-hidden { - overflow: hidden; -} +@font-face{font-display:swap;font-family:IBM Plex Mono;font-style:normal;font-weight:400;src:url(IBMPlexMono.eot);src:url(IBMPlexMono.eot?#iefix) format("embedded-opentype"),url(IBMPlexMono.woff2) format("woff2"),url(IBMPlexMono.woff) format("woff"),url(IBMPlexMono.ttf) format("truetype")}@font-face{font-display:swap;font-family:IBM Plex Mono;font-style:normal;font-weight:700;src:url(IBMPlexMono-Bold.eot);src:url(IBMPlexMono-Bold.eot?#iefix) format("embedded-opentype"),url(IBMPlexMono-Bold.woff2) format("woff2"),url(IBMPlexMono-Bold.woff) format("woff"),url(IBMPlexMono-Bold.ttf) format("truetype")}:root{--grid-columns:12;--grid-grid-spacing:15px;--grid-xs:576px;--grid-sm:768px;--grid-md:992px;--grid-lg:1200px;--grid-xlg:1600px;--grid-xxs-max:575px;--grid-xs-max:767px;--grid-sm-max:991px;--grid-md-max:1199px;--grid-lg-max:1599px;--body:#f9f9f9;--text:#363636;--text-contrast:#fff;--primary:#3e3e3e;--primary-contrast:#3e3e3e;--active:#717171;--active-contrast:#fff;--link:#363636;--link-hover:#d95959;--danger:#d95959;--danger-contrast:#ecacac;--info:#0090d4;--info-constrast:#3bc0ff;--success:#64ac64;--success-contrast:#a6d0a6;--warning:#f0ad4e;--warning-contrast:#f8d9ac;--background:#3e3e3e;--background-contrast:#fff;--background-alpha:rgba(0,0,0,.7);--border:#3e3e3e;--border-contrast:#fff;--font-family:IBM Plex Mono,sans-serif}html{-webkit-text-size-adjust:100%;font-size:100%;line-height:1.15}body,html{height:100%;margin:0}html{box-sizing:border-box}body{background-color:var(--body);color:var(--text);direction:ltr;font-family:var(--font-family);font-size:.9rem;line-height:1.618}@media only screen and (min-width:992px){body{font-size:1rem}}a{color:var(--link);text-decoration:none;transition:color .5s}a:hover{color:var(--link-hover)}a:focus{outline:none}*,:after,:before{box-sizing:inherit}button,figure,select{margin:0}button,select{text-transform:none}[type=button],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}.content a{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges;text-decoration:underline}.h1,.h3,.h4,h1,h3,h4{font-family:IBM Plex Mono,sans-serif;font-weight:700;line-height:1.2;margin:0 0 1rem}.h1,h1{font-size:2.5rem}.h3,h3{font-size:1.75rem}.h4,h4{font-size:1.5rem}@media only screen and (min-width:992px){.h1,h1{font-size:2.75rem}.h3,h3{font-size:2rem}.h4,h4{font-size:1.75rem}}.button{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-contrast);border:1px solid var(--border);border-radius:2px;color:var(--text);display:inline-flex;font-family:var(--font-family);font-size:1rem;margin:0 0 1rem;padding:.5rem 1.3rem;position:relative;text-decoration:none;transition:background-color .1s;width:100%}@media only screen and (min-width:768px){.button{width:auto}}.button--small{font-size:.8rem;padding:.3rem 1.1rem}.button:hover{background-color:var(--active);color:#fff;cursor:pointer;text-decoration:none}.button:active,.button:focus{outline:1px solid var(--active)}.button:disabled{opacity:.5}.button:disabled:hover{background-color:var(--background-contrast);border:1px solid var(--border);color:var(--border);cursor:not-allowed}.icon{fill:var(--text);font-size:1.4rem;height:1em;max-height:100%;max-width:100%;overflow:hidden;vertical-align:middle;width:1em}.figure{display:inline-block;line-height:0;margin:0;overflow:hidden}.bar,.figure{border:1px solid var(--border);border-radius:2px}.bar{background-color:var(--background);color:var(--text-contrast);display:flex;min-height:2.8em}.bar__start{justify-content:start}.bar__main{flex-grow:1}.bar__main,.bar__start{align-items:center;align-self:center;display:flex;margin-left:.75em}.bar__main:last-child,.bar__start:last-child{margin-right:.75em}.loading{align-items:center;display:flex;height:60px;margin:0 auto;width:47px}.loading span{animation-delay:.15s;animation-duration:.5s;animation-iteration-count:infinite;animation-name:loading-animation;background-color:var(--background);border-bottom:1px solid var(--background);border-top:1px solid var(--background);display:block;height:80px;width:15px}.loading span:first-child{animation-delay:0s;margin-right:1px}.loading span:last-child{animation-delay:.3s;margin-left:1px}@keyframes loading-animation{0%{height:60px}50%{height:40px}to{height:60px}}.slider{overflow-x:visible;position:relative}.slider__inner{display:flex;white-space:nowrap}.slider__item{display:inline-block;flex-shrink:0;padding:0 .6em;white-space:normal}.justify-end{justify-content:flex-end}.container{box-sizing:border-box;margin-left:auto;margin-right:auto;padding-left:30px;padding-right:30px;width:100%}.container .grid{margin-left:-15px;margin-right:-15px}@media (min-width:576px){.container{max-width:576px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:992px){.container{max-width:992px}}@media (min-width:1200px){.container{max-width:1200px}}@media (min-width:1600px){.container{max-width:1600px}}.grid{display:block;display:flex;flex-wrap:wrap;list-style-type:none;margin:0 auto;padding:0;position:relative}.col-12,.grid,.grid:after,.grid:before{box-sizing:border-box}.col-12{padding:15px;position:relative;vertical-align:top}.col-12:after,.col-12:before{box-sizing:border-box}.col-12 .grid{flex:1 1 auto;margin:-15px}.col-12{width:100%}.m-top-4{margin-top:1.125rem}.m-top-6{margin-top:3.125rem}.m-bottom-0{margin-bottom:0}.m-bottom-4{margin-bottom:1.125rem}.m-left-3{margin-left:.5rem}@media only screen and (min-width:768px){.m-left-sm-3{margin-left:.5rem}}.color-active{color:var(--active)}.fill-text,.fill-text svg{fill:var(--text)}.fill-active,.fill-active svg{fill:var(--active)}.border-color-active{border-color:var(--active)}.background-color-active{background-color:var(--active)}.display-flex{display:flex}.visibility-hidden{visibility:hidden}.visibility-visible{visibility:visible}.tiny-slider{overflow-x:hidden}.tiny-slider__inner{position:relative;transition:transform .3s ease-in-out}.tiny-slider__item{max-width:100%}.tiny-slider__button{background:transparent;border:none;display:none;padding:10px;width:150px}.tiny-slider__button .icon{font-size:3rem}@media only screen and (min-width:992px){.tiny-slider__button{display:block}}.tiny-slider__button:hover{cursor:pointer}.tiny-slider__select{justify-content:center;padding:1em}.tiny-slider__select-item{background-color:var(--background-contrast);border:1px solid var(--background);height:25px;margin:0 .5em;transition:background-color .3s ease-in-out;width:25px}.tiny-slider__select-item:hover{cursor:pointer}.tiny-slider__select-item--current{background-color:var(--background)}.overflow-hidden{overflow:hidden} diff --git a/example/example.js b/example/example.js index b13b1df..e94b5dd 100644 --- a/example/example.js +++ b/example/example.js @@ -1,6735 +1,91 @@ -/******/ (() => { // webpackBootstrap -/******/ var __webpack_modules__ = ({ - -/***/ "./node_modules/@tiny-components/raw/src/raw.riot": -/*!********************************************************!*\ - !*** ./node_modules/@tiny-components/raw/src/raw.riot ***! - \********************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) -/* harmony export */ }); -/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ - css: null, - - exports: { - setInnerHTML() { - this.root.innerHTML = this.props.html - }, - - onMounted() { - this.setInnerHTML() - }, - - onUpdated() { - this.setInnerHTML() - } - }, - - template: ( - template, - expressionTypes, - bindingTypes, - getComponent - ) => template( - '\n\n /**\n * tiny raw\n *\n * @author Björn Hase\n * @license http://opensource.org/licenses/MIT The MIT License\n * @link https://gitea.node001.net/tiny-components/raw\n *\n */\n\n ', - [] - ), - - name: 'tiny-raw' -}); - -/***/ }), - -/***/ "./src/slider.riot": -/*!*************************!*\ - !*** ./src/slider.riot ***! - \*************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) -/* harmony export */ }); -/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/register.js"); -/* harmony import */ var _mixin_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./mixin.js */ "./src/mixin.js"); -/* harmony import */ var _tiny_components_raw_src_raw_riot__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tiny-components/raw/src/raw.riot */ "./node_modules/@tiny-components/raw/src/raw.riot"); -// riot - - -// mixin - - -// tiny-raw & riot - -riot__WEBPACK_IMPORTED_MODULE_2__.register('tiny-raw', _tiny_components_raw_src_raw_riot__WEBPACK_IMPORTED_MODULE_1__["default"]) - -/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ - css: null, - - exports: () => { - return { - - ..._mixin_js__WEBPACK_IMPORTED_MODULE_0__["default"] - - } - }, - - template: ( - template, - expressionTypes, - bindingTypes, - getComponent - ) => template( - '
', - [ - { - redundantAttribute: 'expr0', - selector: '[expr0]', - - expressions: [ - { - type: expressionTypes.ATTRIBUTE, - name: 'class', - evaluate: _scope => _scope.getPreviousClasses() - }, - { - type: expressionTypes.EVENT, - name: 'onclick', - evaluate: _scope => (event) => { _scope.handlePrevious(event) } - } - ] - }, - { - redundantAttribute: 'expr1', - selector: '[expr1]', - - expressions: [ - { - type: expressionTypes.ATTRIBUTE, - name: 'style', - evaluate: _scope => _scope.getContentStyles() - } - ] - }, - { - type: bindingTypes.EACH, - getKey: null, - condition: null, - - template: template( - '

', - [ - { - redundantAttribute: 'expr3', - selector: '[expr3]', - - expressions: [ - { - type: expressionTypes.TEXT, - childNodeIndex: 0, - - evaluate: _scope => [ - _scope.slide.title - ].join( - '' - ) - } - ] - }, - { - type: bindingTypes.IF, - evaluate: _scope => _scope.slide.media, - redundantAttribute: 'expr4', - selector: '[expr4]', - - template: template( - '', - [ - { - redundantAttribute: 'expr5', - selector: '[expr5]', - - expressions: [ - { - type: expressionTypes.ATTRIBUTE, - name: 'src', - evaluate: _scope => _scope.slide.media.url - }, - { - type: expressionTypes.ATTRIBUTE, - name: 'alt', - evaluate: _scope => _scope.slide.media.description - } - ] - } - ] - ) - }, - { - type: bindingTypes.TAG, - getComponent: getComponent, - evaluate: _scope => 'tiny-raw', - slots: [], - - attributes: [ - { - type: expressionTypes.ATTRIBUTE, - name: 'html', - evaluate: _scope => _scope.slide.content - } - ], - - redundantAttribute: 'expr6', - selector: '[expr6]' - } - ] - ), - - redundantAttribute: 'expr2', - selector: '[expr2]', - itemName: 'slide', - indexName: null, - evaluate: _scope => _scope.props.slides - }, - { - redundantAttribute: 'expr7', - selector: '[expr7]', - - expressions: [ - { - type: expressionTypes.ATTRIBUTE, - name: 'class', - evaluate: _scope => _scope.getNextClasses() - }, - { - type: expressionTypes.EVENT, - name: 'onclick', - evaluate: _scope => (event) => { _scope.handleNext(event) } - } - ] - }, - { - type: bindingTypes.EACH, - getKey: null, - condition: null, - - template: template( - null, - [ - { - expressions: [ - { - type: expressionTypes.ATTRIBUTE, - name: 'class', - evaluate: _scope => _scope.getSelectClasses(_scope.position) - }, - { - type: expressionTypes.EVENT, - name: 'onclick', - evaluate: _scope => (event) => { _scope.handleSelect(event, _scope.position) } - } - ] - } - ] - ), - - redundantAttribute: 'expr8', - selector: '[expr8]', - itemName: 'slide', - indexName: 'position', - evaluate: _scope => _scope.props.slides - } - ] - ), - - name: 'tiny-slider' -}); - -/***/ }), - -/***/ "./src/example.js": -/*!************************!*\ - !*** ./src/example.js ***! - \************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/register.js"); -/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/install.js"); -/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/riot.js"); -/* harmony import */ var _slider_riot__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./slider.riot */ "./src/slider.riot"); -function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } -function _nonIterableSpread() { 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } -function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } -function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } -function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } -function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } -function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } -function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } } -function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } - - -riot__WEBPACK_IMPORTED_MODULE_1__.register('tiny-slider', _slider_riot__WEBPACK_IMPORTED_MODULE_0__["default"]); - -/** - * Convert object attributes constructs into strings - * - * @param {Object} attributes - style attributes as object - * @returns {string} a string with all the attributes and their values - */ -function styles(attributes) { - return Object.entries(attributes).reduce(function (acc, item) { - var _item = _slicedToArray(item, 2), - key = _item[0], - value = _item[1]; - return [].concat(_toConsumableArray(acc), ["".concat(key, ": ").concat(value)]); - }, []).join(';'); -} -riot__WEBPACK_IMPORTED_MODULE_2__.install(function (component) { - component.styles = styles; - return component; -}); -window.riot = riot__WEBPACK_IMPORTED_MODULE_3__; - -/***/ }), - -/***/ "./src/mixin.js": -/*!**********************!*\ - !*** ./src/mixin.js ***! - \**********************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) -/* harmony export */ }); -/* harmony import */ var hammerjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! hammerjs */ "./node_modules/hammerjs/hammer.js"); -/* harmony import */ var hammerjs__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(hammerjs__WEBPACK_IMPORTED_MODULE_0__); - - -/** - * - * - */ - -/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ - /** - * - * - */ - state: { - position: 0, - max: 0, - classes: { - item: 'tiny-slider__item' - } - }, - /** - * - * - */ - onMounted: function onMounted() { - var _this = this; - // start and add resize listener - window.addEventListener('resize', this.update.bind(this)); - setTimeout(function () { - _this.update(); - }, 100); - - // Create a manager to manager the element - var manager = new hammerjs__WEBPACK_IMPORTED_MODULE_0__(this.root); - manager.on('swipe', function (event) { - if (event.direction === 4) { - _this.handlePrevious(event); - } else if (event.direction === 2) { - _this.handleNext(event); - } - }); - }, - /** - * remove resize listener - * before unmount - * - */ - onBeforeUnmount: function onBeforeUnmount() { - window.removeEventListener('resize', this.update.bind(this)); - }, - /** - * before update view, calculate values - * - * @param {object} props - * @param {object} state - * - */ - onBeforeUpdate: function onBeforeUpdate(props, state) { - var _this2 = this; - // getting current max - var max = this.state.max; - - // setting max to show visible - this.state.max = 0; - this.state.width = this.$('.' + this.state.classes.item).offsetWidth; - - // check how many elements can visible in element - this.$$('.' + this.state.classes.item).forEach(function (element, index) { - if (element.offsetLeft < _this2.root.offsetWidth) { - _this2.state.max++; - } - }); - console.log(this.state.max); - - // change position to fit new max value - var value = Math.abs(this.state.max - max); - - // @TODO check this, at 0 it makes me mad - if (this.state.position >= value && this.state.position > 1) { - this.state.position -= value; - } - }, - /** - * set translate with position and witdh - * - * - * @return {string} - * - */ - getContentStyles: function getContentStyles() { - // getting value for position - var value = -(this.state.position * this.state.width); - return this.styles({ - transform: 'translate(' + value + 'px, 0px)' - }); - }, - /** - * set previous position - * - * - */ - handleSelect: function handleSelect(event, position) { - event.preventDefault(); - if (this.state.position !== position) { - this.update({ - position: position - }); - } - }, - /** - * set previous position - * - * - */ - handlePrevious: function handlePrevious(event) { - event.preventDefault(); - if (this.state.position > 0) { - this.update({ - position: --this.state.position - }); - } - }, - /** - * set next position - * - * - */ - handleNext: function handleNext(event) { - event.preventDefault(); - if (this.state.position < this.props.slides.length - 1) { - this.update({ - position: ++this.state.position - }); - } - }, - /** - * - * - * - * @return {string} - * - */ - getPreviousClasses: function getPreviousClasses() { - var classes = ['tiny-slider__button', 'tiny-slider__button--previous']; - if (this.state.position > 0) { - classes.push('visibility-visible'); - } else { - classes.push('visibility-hidden'); - } - return classes.join(' '); - }, - /** - * - * - * - * @return {string} - * - */ - getNextClasses: function getNextClasses() { - var classes = ['tiny-slider__button', 'tiny-slider__button--next']; - if (this.state.position <= this.props.slides.length - this.state.max) { - classes.push('visibility-visible'); - } else { - classes.push('visibility-hidden'); - } - return classes.join(' '); - }, - /** - * - * - * @param {integer} position - * @return {string} - * - */ - getSelectClasses: function getSelectClasses(position) { - var classes = ['tiny-slider__select-item']; - if (this.state.position === position) { - classes.push('tiny-slider__select-item--current'); - } - return classes.join(' '); - } -}); - -/***/ }), - -/***/ "./node_modules/hammerjs/hammer.js": -/*!*****************************************!*\ - !*** ./node_modules/hammerjs/hammer.js ***! - \*****************************************/ -/***/ ((module, exports, __webpack_require__) => { - -var __WEBPACK_AMD_DEFINE_RESULT__;/*! Hammer.JS - v2.0.7 - 2016-04-22 - * http://hammerjs.github.io/ - * - * Copyright (c) 2016 Jorik Tangelder; - * Licensed under the MIT license */ -(function(window, document, exportName, undefined) { - 'use strict'; - -var VENDOR_PREFIXES = ['', 'webkit', 'Moz', 'MS', 'ms', 'o']; -var TEST_ELEMENT = document.createElement('div'); - -var TYPE_FUNCTION = 'function'; - -var round = Math.round; -var abs = Math.abs; -var now = Date.now; - -/** - * set a timeout with a given scope - * @param {Function} fn - * @param {Number} timeout - * @param {Object} context - * @returns {number} - */ -function setTimeoutContext(fn, timeout, context) { - return setTimeout(bindFn(fn, context), timeout); -} - -/** - * if the argument is an array, we want to execute the fn on each entry - * if it aint an array we don't want to do a thing. - * this is used by all the methods that accept a single and array argument. - * @param {*|Array} arg - * @param {String} fn - * @param {Object} [context] - * @returns {Boolean} - */ -function invokeArrayArg(arg, fn, context) { - if (Array.isArray(arg)) { - each(arg, context[fn], context); - return true; - } - return false; -} - -/** - * walk objects and arrays - * @param {Object} obj - * @param {Function} iterator - * @param {Object} context - */ -function each(obj, iterator, context) { - var i; - - if (!obj) { - return; - } - - if (obj.forEach) { - obj.forEach(iterator, context); - } else if (obj.length !== undefined) { - i = 0; - while (i < obj.length) { - iterator.call(context, obj[i], i, obj); - i++; - } - } else { - for (i in obj) { - obj.hasOwnProperty(i) && iterator.call(context, obj[i], i, obj); - } - } -} - -/** - * wrap a method with a deprecation warning and stack trace - * @param {Function} method - * @param {String} name - * @param {String} message - * @returns {Function} A new function wrapping the supplied method. - */ -function deprecate(method, name, message) { - var deprecationMessage = 'DEPRECATED METHOD: ' + name + '\n' + message + ' AT \n'; - return function() { - var e = new Error('get-stack-trace'); - var stack = e && e.stack ? e.stack.replace(/^[^\(]+?[\n$]/gm, '') - .replace(/^\s+at\s+/gm, '') - .replace(/^Object.\s*\(/gm, '{anonymous}()@') : 'Unknown Stack Trace'; - - var log = window.console && (window.console.warn || window.console.log); - if (log) { - log.call(window.console, deprecationMessage, stack); - } - return method.apply(this, arguments); - }; -} - -/** - * extend object. - * means that properties in dest will be overwritten by the ones in src. - * @param {Object} target - * @param {...Object} objects_to_assign - * @returns {Object} target - */ -var assign; -if (typeof Object.assign !== 'function') { - assign = function assign(target) { - if (target === undefined || target === null) { - throw new TypeError('Cannot convert undefined or null to object'); - } - - var output = Object(target); - for (var index = 1; index < arguments.length; index++) { - var source = arguments[index]; - if (source !== undefined && source !== null) { - for (var nextKey in source) { - if (source.hasOwnProperty(nextKey)) { - output[nextKey] = source[nextKey]; - } - } - } - } - return output; - }; -} else { - assign = Object.assign; -} - -/** - * extend object. - * means that properties in dest will be overwritten by the ones in src. - * @param {Object} dest - * @param {Object} src - * @param {Boolean} [merge=false] - * @returns {Object} dest - */ -var extend = deprecate(function extend(dest, src, merge) { - var keys = Object.keys(src); - var i = 0; - while (i < keys.length) { - if (!merge || (merge && dest[keys[i]] === undefined)) { - dest[keys[i]] = src[keys[i]]; - } - i++; - } - return dest; -}, 'extend', 'Use `assign`.'); - -/** - * merge the values from src in the dest. - * means that properties that exist in dest will not be overwritten by src - * @param {Object} dest - * @param {Object} src - * @returns {Object} dest - */ -var merge = deprecate(function merge(dest, src) { - return extend(dest, src, true); -}, 'merge', 'Use `assign`.'); - -/** - * simple class inheritance - * @param {Function} child - * @param {Function} base - * @param {Object} [properties] - */ -function inherit(child, base, properties) { - var baseP = base.prototype, - childP; - - childP = child.prototype = Object.create(baseP); - childP.constructor = child; - childP._super = baseP; - - if (properties) { - assign(childP, properties); - } -} - -/** - * simple function bind - * @param {Function} fn - * @param {Object} context - * @returns {Function} - */ -function bindFn(fn, context) { - return function boundFn() { - return fn.apply(context, arguments); - }; -} - -/** - * let a boolean value also be a function that must return a boolean - * this first item in args will be used as the context - * @param {Boolean|Function} val - * @param {Array} [args] - * @returns {Boolean} - */ -function boolOrFn(val, args) { - if (typeof val == TYPE_FUNCTION) { - return val.apply(args ? args[0] || undefined : undefined, args); - } - return val; -} - -/** - * use the val2 when val1 is undefined - * @param {*} val1 - * @param {*} val2 - * @returns {*} - */ -function ifUndefined(val1, val2) { - return (val1 === undefined) ? val2 : val1; -} - -/** - * addEventListener with multiple events at once - * @param {EventTarget} target - * @param {String} types - * @param {Function} handler - */ -function addEventListeners(target, types, handler) { - each(splitStr(types), function(type) { - target.addEventListener(type, handler, false); - }); -} - -/** - * removeEventListener with multiple events at once - * @param {EventTarget} target - * @param {String} types - * @param {Function} handler - */ -function removeEventListeners(target, types, handler) { - each(splitStr(types), function(type) { - target.removeEventListener(type, handler, false); - }); -} - -/** - * find if a node is in the given parent - * @method hasParent - * @param {HTMLElement} node - * @param {HTMLElement} parent - * @return {Boolean} found - */ -function hasParent(node, parent) { - while (node) { - if (node == parent) { - return true; - } - node = node.parentNode; - } - return false; -} - -/** - * small indexOf wrapper - * @param {String} str - * @param {String} find - * @returns {Boolean} found - */ -function inStr(str, find) { - return str.indexOf(find) > -1; -} - -/** - * split string on whitespace - * @param {String} str - * @returns {Array} words - */ -function splitStr(str) { - return str.trim().split(/\s+/g); -} - -/** - * find if a array contains the object using indexOf or a simple polyFill - * @param {Array} src - * @param {String} find - * @param {String} [findByKey] - * @return {Boolean|Number} false when not found, or the index - */ -function inArray(src, find, findByKey) { - if (src.indexOf && !findByKey) { - return src.indexOf(find); - } else { - var i = 0; - while (i < src.length) { - if ((findByKey && src[i][findByKey] == find) || (!findByKey && src[i] === find)) { - return i; - } - i++; - } - return -1; - } -} - -/** - * convert array-like objects to real arrays - * @param {Object} obj - * @returns {Array} - */ -function toArray(obj) { - return Array.prototype.slice.call(obj, 0); -} - -/** - * unique array with objects based on a key (like 'id') or just by the array's value - * @param {Array} src [{id:1},{id:2},{id:1}] - * @param {String} [key] - * @param {Boolean} [sort=False] - * @returns {Array} [{id:1},{id:2}] - */ -function uniqueArray(src, key, sort) { - var results = []; - var values = []; - var i = 0; - - while (i < src.length) { - var val = key ? src[i][key] : src[i]; - if (inArray(values, val) < 0) { - results.push(src[i]); - } - values[i] = val; - i++; - } - - if (sort) { - if (!key) { - results = results.sort(); - } else { - results = results.sort(function sortUniqueArray(a, b) { - return a[key] > b[key]; - }); - } - } - - return results; -} - -/** - * get the prefixed property - * @param {Object} obj - * @param {String} property - * @returns {String|Undefined} prefixed - */ -function prefixed(obj, property) { - var prefix, prop; - var camelProp = property[0].toUpperCase() + property.slice(1); - - var i = 0; - while (i < VENDOR_PREFIXES.length) { - prefix = VENDOR_PREFIXES[i]; - prop = (prefix) ? prefix + camelProp : property; - - if (prop in obj) { - return prop; - } - i++; - } - return undefined; -} - -/** - * get a unique id - * @returns {number} uniqueId - */ -var _uniqueId = 1; -function uniqueId() { - return _uniqueId++; -} - -/** - * get the window object of an element - * @param {HTMLElement} element - * @returns {DocumentView|Window} - */ -function getWindowForElement(element) { - var doc = element.ownerDocument || element; - return (doc.defaultView || doc.parentWindow || window); -} - -var MOBILE_REGEX = /mobile|tablet|ip(ad|hone|od)|android/i; - -var SUPPORT_TOUCH = ('ontouchstart' in window); -var SUPPORT_POINTER_EVENTS = prefixed(window, 'PointerEvent') !== undefined; -var SUPPORT_ONLY_TOUCH = SUPPORT_TOUCH && MOBILE_REGEX.test(navigator.userAgent); - -var INPUT_TYPE_TOUCH = 'touch'; -var INPUT_TYPE_PEN = 'pen'; -var INPUT_TYPE_MOUSE = 'mouse'; -var INPUT_TYPE_KINECT = 'kinect'; - -var COMPUTE_INTERVAL = 25; - -var INPUT_START = 1; -var INPUT_MOVE = 2; -var INPUT_END = 4; -var INPUT_CANCEL = 8; - -var DIRECTION_NONE = 1; -var DIRECTION_LEFT = 2; -var DIRECTION_RIGHT = 4; -var DIRECTION_UP = 8; -var DIRECTION_DOWN = 16; - -var DIRECTION_HORIZONTAL = DIRECTION_LEFT | DIRECTION_RIGHT; -var DIRECTION_VERTICAL = DIRECTION_UP | DIRECTION_DOWN; -var DIRECTION_ALL = DIRECTION_HORIZONTAL | DIRECTION_VERTICAL; - -var PROPS_XY = ['x', 'y']; -var PROPS_CLIENT_XY = ['clientX', 'clientY']; - -/** - * create new input type manager - * @param {Manager} manager - * @param {Function} callback - * @returns {Input} - * @constructor - */ -function Input(manager, callback) { - var self = this; - this.manager = manager; - this.callback = callback; - this.element = manager.element; - this.target = manager.options.inputTarget; - - // smaller wrapper around the handler, for the scope and the enabled state of the manager, - // so when disabled the input events are completely bypassed. - this.domHandler = function(ev) { - if (boolOrFn(manager.options.enable, [manager])) { - self.handler(ev); - } - }; - - this.init(); - -} - -Input.prototype = { - /** - * should handle the inputEvent data and trigger the callback - * @virtual - */ - handler: function() { }, - - /** - * bind the events - */ - init: function() { - this.evEl && addEventListeners(this.element, this.evEl, this.domHandler); - this.evTarget && addEventListeners(this.target, this.evTarget, this.domHandler); - this.evWin && addEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); - }, - - /** - * unbind the events - */ - destroy: function() { - this.evEl && removeEventListeners(this.element, this.evEl, this.domHandler); - this.evTarget && removeEventListeners(this.target, this.evTarget, this.domHandler); - this.evWin && removeEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); - } -}; - -/** - * create new input type manager - * called by the Manager constructor - * @param {Hammer} manager - * @returns {Input} - */ -function createInputInstance(manager) { - var Type; - var inputClass = manager.options.inputClass; - - if (inputClass) { - Type = inputClass; - } else if (SUPPORT_POINTER_EVENTS) { - Type = PointerEventInput; - } else if (SUPPORT_ONLY_TOUCH) { - Type = TouchInput; - } else if (!SUPPORT_TOUCH) { - Type = MouseInput; - } else { - Type = TouchMouseInput; - } - return new (Type)(manager, inputHandler); -} - -/** - * handle input events - * @param {Manager} manager - * @param {String} eventType - * @param {Object} input - */ -function inputHandler(manager, eventType, input) { - var pointersLen = input.pointers.length; - var changedPointersLen = input.changedPointers.length; - var isFirst = (eventType & INPUT_START && (pointersLen - changedPointersLen === 0)); - var isFinal = (eventType & (INPUT_END | INPUT_CANCEL) && (pointersLen - changedPointersLen === 0)); - - input.isFirst = !!isFirst; - input.isFinal = !!isFinal; - - if (isFirst) { - manager.session = {}; - } - - // source event is the normalized value of the domEvents - // like 'touchstart, mouseup, pointerdown' - input.eventType = eventType; - - // compute scale, rotation etc - computeInputData(manager, input); - - // emit secret event - manager.emit('hammer.input', input); - - manager.recognize(input); - manager.session.prevInput = input; -} - -/** - * extend the data with some usable properties like scale, rotate, velocity etc - * @param {Object} manager - * @param {Object} input - */ -function computeInputData(manager, input) { - var session = manager.session; - var pointers = input.pointers; - var pointersLength = pointers.length; - - // store the first input to calculate the distance and direction - if (!session.firstInput) { - session.firstInput = simpleCloneInputData(input); - } - - // to compute scale and rotation we need to store the multiple touches - if (pointersLength > 1 && !session.firstMultiple) { - session.firstMultiple = simpleCloneInputData(input); - } else if (pointersLength === 1) { - session.firstMultiple = false; - } - - var firstInput = session.firstInput; - var firstMultiple = session.firstMultiple; - var offsetCenter = firstMultiple ? firstMultiple.center : firstInput.center; - - var center = input.center = getCenter(pointers); - input.timeStamp = now(); - input.deltaTime = input.timeStamp - firstInput.timeStamp; - - input.angle = getAngle(offsetCenter, center); - input.distance = getDistance(offsetCenter, center); - - computeDeltaXY(session, input); - input.offsetDirection = getDirection(input.deltaX, input.deltaY); - - var overallVelocity = getVelocity(input.deltaTime, input.deltaX, input.deltaY); - input.overallVelocityX = overallVelocity.x; - input.overallVelocityY = overallVelocity.y; - input.overallVelocity = (abs(overallVelocity.x) > abs(overallVelocity.y)) ? overallVelocity.x : overallVelocity.y; - - input.scale = firstMultiple ? getScale(firstMultiple.pointers, pointers) : 1; - input.rotation = firstMultiple ? getRotation(firstMultiple.pointers, pointers) : 0; - - input.maxPointers = !session.prevInput ? input.pointers.length : ((input.pointers.length > - session.prevInput.maxPointers) ? input.pointers.length : session.prevInput.maxPointers); - - computeIntervalInputData(session, input); - - // find the correct target - var target = manager.element; - if (hasParent(input.srcEvent.target, target)) { - target = input.srcEvent.target; - } - input.target = target; -} - -function computeDeltaXY(session, input) { - var center = input.center; - var offset = session.offsetDelta || {}; - var prevDelta = session.prevDelta || {}; - var prevInput = session.prevInput || {}; - - if (input.eventType === INPUT_START || prevInput.eventType === INPUT_END) { - prevDelta = session.prevDelta = { - x: prevInput.deltaX || 0, - y: prevInput.deltaY || 0 - }; - - offset = session.offsetDelta = { - x: center.x, - y: center.y - }; - } - - input.deltaX = prevDelta.x + (center.x - offset.x); - input.deltaY = prevDelta.y + (center.y - offset.y); -} - -/** - * velocity is calculated every x ms - * @param {Object} session - * @param {Object} input - */ -function computeIntervalInputData(session, input) { - var last = session.lastInterval || input, - deltaTime = input.timeStamp - last.timeStamp, - velocity, velocityX, velocityY, direction; - - if (input.eventType != INPUT_CANCEL && (deltaTime > COMPUTE_INTERVAL || last.velocity === undefined)) { - var deltaX = input.deltaX - last.deltaX; - var deltaY = input.deltaY - last.deltaY; - - var v = getVelocity(deltaTime, deltaX, deltaY); - velocityX = v.x; - velocityY = v.y; - velocity = (abs(v.x) > abs(v.y)) ? v.x : v.y; - direction = getDirection(deltaX, deltaY); - - session.lastInterval = input; - } else { - // use latest velocity info if it doesn't overtake a minimum period - velocity = last.velocity; - velocityX = last.velocityX; - velocityY = last.velocityY; - direction = last.direction; - } - - input.velocity = velocity; - input.velocityX = velocityX; - input.velocityY = velocityY; - input.direction = direction; -} - -/** - * create a simple clone from the input used for storage of firstInput and firstMultiple - * @param {Object} input - * @returns {Object} clonedInputData - */ -function simpleCloneInputData(input) { - // make a simple copy of the pointers because we will get a reference if we don't - // we only need clientXY for the calculations - var pointers = []; - var i = 0; - while (i < input.pointers.length) { - pointers[i] = { - clientX: round(input.pointers[i].clientX), - clientY: round(input.pointers[i].clientY) - }; - i++; - } - - return { - timeStamp: now(), - pointers: pointers, - center: getCenter(pointers), - deltaX: input.deltaX, - deltaY: input.deltaY - }; -} - -/** - * get the center of all the pointers - * @param {Array} pointers - * @return {Object} center contains `x` and `y` properties - */ -function getCenter(pointers) { - var pointersLength = pointers.length; - - // no need to loop when only one touch - if (pointersLength === 1) { - return { - x: round(pointers[0].clientX), - y: round(pointers[0].clientY) - }; - } - - var x = 0, y = 0, i = 0; - while (i < pointersLength) { - x += pointers[i].clientX; - y += pointers[i].clientY; - i++; - } - - return { - x: round(x / pointersLength), - y: round(y / pointersLength) - }; -} - -/** - * calculate the velocity between two points. unit is in px per ms. - * @param {Number} deltaTime - * @param {Number} x - * @param {Number} y - * @return {Object} velocity `x` and `y` - */ -function getVelocity(deltaTime, x, y) { - return { - x: x / deltaTime || 0, - y: y / deltaTime || 0 - }; -} - -/** - * get the direction between two points - * @param {Number} x - * @param {Number} y - * @return {Number} direction - */ -function getDirection(x, y) { - if (x === y) { - return DIRECTION_NONE; - } - - if (abs(x) >= abs(y)) { - return x < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT; - } - return y < 0 ? DIRECTION_UP : DIRECTION_DOWN; -} - -/** - * calculate the absolute distance between two points - * @param {Object} p1 {x, y} - * @param {Object} p2 {x, y} - * @param {Array} [props] containing x and y keys - * @return {Number} distance - */ -function getDistance(p1, p2, props) { - if (!props) { - props = PROPS_XY; - } - var x = p2[props[0]] - p1[props[0]], - y = p2[props[1]] - p1[props[1]]; - - return Math.sqrt((x * x) + (y * y)); -} - -/** - * calculate the angle between two coordinates - * @param {Object} p1 - * @param {Object} p2 - * @param {Array} [props] containing x and y keys - * @return {Number} angle - */ -function getAngle(p1, p2, props) { - if (!props) { - props = PROPS_XY; - } - var x = p2[props[0]] - p1[props[0]], - y = p2[props[1]] - p1[props[1]]; - return Math.atan2(y, x) * 180 / Math.PI; -} - -/** - * calculate the rotation degrees between two pointersets - * @param {Array} start array of pointers - * @param {Array} end array of pointers - * @return {Number} rotation - */ -function getRotation(start, end) { - return getAngle(end[1], end[0], PROPS_CLIENT_XY) + getAngle(start[1], start[0], PROPS_CLIENT_XY); -} - -/** - * calculate the scale factor between two pointersets - * no scale is 1, and goes down to 0 when pinched together, and bigger when pinched out - * @param {Array} start array of pointers - * @param {Array} end array of pointers - * @return {Number} scale - */ -function getScale(start, end) { - return getDistance(end[0], end[1], PROPS_CLIENT_XY) / getDistance(start[0], start[1], PROPS_CLIENT_XY); -} - -var MOUSE_INPUT_MAP = { - mousedown: INPUT_START, - mousemove: INPUT_MOVE, - mouseup: INPUT_END -}; - -var MOUSE_ELEMENT_EVENTS = 'mousedown'; -var MOUSE_WINDOW_EVENTS = 'mousemove mouseup'; - -/** - * Mouse events input - * @constructor - * @extends Input - */ -function MouseInput() { - this.evEl = MOUSE_ELEMENT_EVENTS; - this.evWin = MOUSE_WINDOW_EVENTS; - - this.pressed = false; // mousedown state - - Input.apply(this, arguments); -} - -inherit(MouseInput, Input, { - /** - * handle mouse events - * @param {Object} ev - */ - handler: function MEhandler(ev) { - var eventType = MOUSE_INPUT_MAP[ev.type]; - - // on start we want to have the left mouse button down - if (eventType & INPUT_START && ev.button === 0) { - this.pressed = true; - } - - if (eventType & INPUT_MOVE && ev.which !== 1) { - eventType = INPUT_END; - } - - // mouse must be down - if (!this.pressed) { - return; - } - - if (eventType & INPUT_END) { - this.pressed = false; - } - - this.callback(this.manager, eventType, { - pointers: [ev], - changedPointers: [ev], - pointerType: INPUT_TYPE_MOUSE, - srcEvent: ev - }); - } -}); - -var POINTER_INPUT_MAP = { - pointerdown: INPUT_START, - pointermove: INPUT_MOVE, - pointerup: INPUT_END, - pointercancel: INPUT_CANCEL, - pointerout: INPUT_CANCEL -}; - -// in IE10 the pointer types is defined as an enum -var IE10_POINTER_TYPE_ENUM = { - 2: INPUT_TYPE_TOUCH, - 3: INPUT_TYPE_PEN, - 4: INPUT_TYPE_MOUSE, - 5: INPUT_TYPE_KINECT // see https://twitter.com/jacobrossi/status/480596438489890816 -}; - -var POINTER_ELEMENT_EVENTS = 'pointerdown'; -var POINTER_WINDOW_EVENTS = 'pointermove pointerup pointercancel'; - -// IE10 has prefixed support, and case-sensitive -if (window.MSPointerEvent && !window.PointerEvent) { - POINTER_ELEMENT_EVENTS = 'MSPointerDown'; - POINTER_WINDOW_EVENTS = 'MSPointerMove MSPointerUp MSPointerCancel'; -} - -/** - * Pointer events input - * @constructor - * @extends Input - */ -function PointerEventInput() { - this.evEl = POINTER_ELEMENT_EVENTS; - this.evWin = POINTER_WINDOW_EVENTS; - - Input.apply(this, arguments); - - this.store = (this.manager.session.pointerEvents = []); -} - -inherit(PointerEventInput, Input, { - /** - * handle mouse events - * @param {Object} ev - */ - handler: function PEhandler(ev) { - var store = this.store; - var removePointer = false; - - var eventTypeNormalized = ev.type.toLowerCase().replace('ms', ''); - var eventType = POINTER_INPUT_MAP[eventTypeNormalized]; - var pointerType = IE10_POINTER_TYPE_ENUM[ev.pointerType] || ev.pointerType; - - var isTouch = (pointerType == INPUT_TYPE_TOUCH); - - // get index of the event in the store - var storeIndex = inArray(store, ev.pointerId, 'pointerId'); - - // start and mouse must be down - if (eventType & INPUT_START && (ev.button === 0 || isTouch)) { - if (storeIndex < 0) { - store.push(ev); - storeIndex = store.length - 1; - } - } else if (eventType & (INPUT_END | INPUT_CANCEL)) { - removePointer = true; - } - - // it not found, so the pointer hasn't been down (so it's probably a hover) - if (storeIndex < 0) { - return; - } - - // update the event in the store - store[storeIndex] = ev; - - this.callback(this.manager, eventType, { - pointers: store, - changedPointers: [ev], - pointerType: pointerType, - srcEvent: ev - }); - - if (removePointer) { - // remove from the store - store.splice(storeIndex, 1); - } - } -}); - -var SINGLE_TOUCH_INPUT_MAP = { - touchstart: INPUT_START, - touchmove: INPUT_MOVE, - touchend: INPUT_END, - touchcancel: INPUT_CANCEL -}; - -var SINGLE_TOUCH_TARGET_EVENTS = 'touchstart'; -var SINGLE_TOUCH_WINDOW_EVENTS = 'touchstart touchmove touchend touchcancel'; - -/** - * Touch events input - * @constructor - * @extends Input - */ -function SingleTouchInput() { - this.evTarget = SINGLE_TOUCH_TARGET_EVENTS; - this.evWin = SINGLE_TOUCH_WINDOW_EVENTS; - this.started = false; - - Input.apply(this, arguments); -} - -inherit(SingleTouchInput, Input, { - handler: function TEhandler(ev) { - var type = SINGLE_TOUCH_INPUT_MAP[ev.type]; - - // should we handle the touch events? - if (type === INPUT_START) { - this.started = true; - } - - if (!this.started) { - return; - } - - var touches = normalizeSingleTouches.call(this, ev, type); - - // when done, reset the started state - if (type & (INPUT_END | INPUT_CANCEL) && touches[0].length - touches[1].length === 0) { - this.started = false; - } - - this.callback(this.manager, type, { - pointers: touches[0], - changedPointers: touches[1], - pointerType: INPUT_TYPE_TOUCH, - srcEvent: ev - }); - } -}); - -/** - * @this {TouchInput} - * @param {Object} ev - * @param {Number} type flag - * @returns {undefined|Array} [all, changed] - */ -function normalizeSingleTouches(ev, type) { - var all = toArray(ev.touches); - var changed = toArray(ev.changedTouches); - - if (type & (INPUT_END | INPUT_CANCEL)) { - all = uniqueArray(all.concat(changed), 'identifier', true); - } - - return [all, changed]; -} - -var TOUCH_INPUT_MAP = { - touchstart: INPUT_START, - touchmove: INPUT_MOVE, - touchend: INPUT_END, - touchcancel: INPUT_CANCEL -}; - -var TOUCH_TARGET_EVENTS = 'touchstart touchmove touchend touchcancel'; - -/** - * Multi-user touch events input - * @constructor - * @extends Input - */ -function TouchInput() { - this.evTarget = TOUCH_TARGET_EVENTS; - this.targetIds = {}; - - Input.apply(this, arguments); -} - -inherit(TouchInput, Input, { - handler: function MTEhandler(ev) { - var type = TOUCH_INPUT_MAP[ev.type]; - var touches = getTouches.call(this, ev, type); - if (!touches) { - return; - } - - this.callback(this.manager, type, { - pointers: touches[0], - changedPointers: touches[1], - pointerType: INPUT_TYPE_TOUCH, - srcEvent: ev - }); - } -}); - -/** - * @this {TouchInput} - * @param {Object} ev - * @param {Number} type flag - * @returns {undefined|Array} [all, changed] - */ -function getTouches(ev, type) { - var allTouches = toArray(ev.touches); - var targetIds = this.targetIds; - - // when there is only one touch, the process can be simplified - if (type & (INPUT_START | INPUT_MOVE) && allTouches.length === 1) { - targetIds[allTouches[0].identifier] = true; - return [allTouches, allTouches]; - } - - var i, - targetTouches, - changedTouches = toArray(ev.changedTouches), - changedTargetTouches = [], - target = this.target; - - // get target touches from touches - targetTouches = allTouches.filter(function(touch) { - return hasParent(touch.target, target); - }); - - // collect touches - if (type === INPUT_START) { - i = 0; - while (i < targetTouches.length) { - targetIds[targetTouches[i].identifier] = true; - i++; - } - } - - // filter changed touches to only contain touches that exist in the collected target ids - i = 0; - while (i < changedTouches.length) { - if (targetIds[changedTouches[i].identifier]) { - changedTargetTouches.push(changedTouches[i]); - } - - // cleanup removed touches - if (type & (INPUT_END | INPUT_CANCEL)) { - delete targetIds[changedTouches[i].identifier]; - } - i++; - } - - if (!changedTargetTouches.length) { - return; - } - - return [ - // merge targetTouches with changedTargetTouches so it contains ALL touches, including 'end' and 'cancel' - uniqueArray(targetTouches.concat(changedTargetTouches), 'identifier', true), - changedTargetTouches - ]; -} - -/** - * Combined touch and mouse input - * - * Touch has a higher priority then mouse, and while touching no mouse events are allowed. - * This because touch devices also emit mouse events while doing a touch. - * - * @constructor - * @extends Input - */ - -var DEDUP_TIMEOUT = 2500; -var DEDUP_DISTANCE = 25; - -function TouchMouseInput() { - Input.apply(this, arguments); - - var handler = bindFn(this.handler, this); - this.touch = new TouchInput(this.manager, handler); - this.mouse = new MouseInput(this.manager, handler); - - this.primaryTouch = null; - this.lastTouches = []; -} - -inherit(TouchMouseInput, Input, { - /** - * handle mouse and touch events - * @param {Hammer} manager - * @param {String} inputEvent - * @param {Object} inputData - */ - handler: function TMEhandler(manager, inputEvent, inputData) { - var isTouch = (inputData.pointerType == INPUT_TYPE_TOUCH), - isMouse = (inputData.pointerType == INPUT_TYPE_MOUSE); - - if (isMouse && inputData.sourceCapabilities && inputData.sourceCapabilities.firesTouchEvents) { - return; - } - - // when we're in a touch event, record touches to de-dupe synthetic mouse event - if (isTouch) { - recordTouches.call(this, inputEvent, inputData); - } else if (isMouse && isSyntheticEvent.call(this, inputData)) { - return; - } - - this.callback(manager, inputEvent, inputData); - }, - - /** - * remove the event listeners - */ - destroy: function destroy() { - this.touch.destroy(); - this.mouse.destroy(); - } -}); - -function recordTouches(eventType, eventData) { - if (eventType & INPUT_START) { - this.primaryTouch = eventData.changedPointers[0].identifier; - setLastTouch.call(this, eventData); - } else if (eventType & (INPUT_END | INPUT_CANCEL)) { - setLastTouch.call(this, eventData); - } -} - -function setLastTouch(eventData) { - var touch = eventData.changedPointers[0]; - - if (touch.identifier === this.primaryTouch) { - var lastTouch = {x: touch.clientX, y: touch.clientY}; - this.lastTouches.push(lastTouch); - var lts = this.lastTouches; - var removeLastTouch = function() { - var i = lts.indexOf(lastTouch); - if (i > -1) { - lts.splice(i, 1); - } - }; - setTimeout(removeLastTouch, DEDUP_TIMEOUT); - } -} - -function isSyntheticEvent(eventData) { - var x = eventData.srcEvent.clientX, y = eventData.srcEvent.clientY; - for (var i = 0; i < this.lastTouches.length; i++) { - var t = this.lastTouches[i]; - var dx = Math.abs(x - t.x), dy = Math.abs(y - t.y); - if (dx <= DEDUP_DISTANCE && dy <= DEDUP_DISTANCE) { - return true; - } - } - return false; -} - -var PREFIXED_TOUCH_ACTION = prefixed(TEST_ELEMENT.style, 'touchAction'); -var NATIVE_TOUCH_ACTION = PREFIXED_TOUCH_ACTION !== undefined; - -// magical touchAction value -var TOUCH_ACTION_COMPUTE = 'compute'; -var TOUCH_ACTION_AUTO = 'auto'; -var TOUCH_ACTION_MANIPULATION = 'manipulation'; // not implemented -var TOUCH_ACTION_NONE = 'none'; -var TOUCH_ACTION_PAN_X = 'pan-x'; -var TOUCH_ACTION_PAN_Y = 'pan-y'; -var TOUCH_ACTION_MAP = getTouchActionProps(); - -/** - * Touch Action - * sets the touchAction property or uses the js alternative - * @param {Manager} manager - * @param {String} value - * @constructor - */ -function TouchAction(manager, value) { - this.manager = manager; - this.set(value); -} - -TouchAction.prototype = { - /** - * set the touchAction value on the element or enable the polyfill - * @param {String} value - */ - set: function(value) { - // find out the touch-action by the event handlers - if (value == TOUCH_ACTION_COMPUTE) { - value = this.compute(); - } - - if (NATIVE_TOUCH_ACTION && this.manager.element.style && TOUCH_ACTION_MAP[value]) { - this.manager.element.style[PREFIXED_TOUCH_ACTION] = value; - } - this.actions = value.toLowerCase().trim(); - }, - - /** - * just re-set the touchAction value - */ - update: function() { - this.set(this.manager.options.touchAction); - }, - - /** - * compute the value for the touchAction property based on the recognizer's settings - * @returns {String} value - */ - compute: function() { - var actions = []; - each(this.manager.recognizers, function(recognizer) { - if (boolOrFn(recognizer.options.enable, [recognizer])) { - actions = actions.concat(recognizer.getTouchAction()); - } - }); - return cleanTouchActions(actions.join(' ')); - }, - - /** - * this method is called on each input cycle and provides the preventing of the browser behavior - * @param {Object} input - */ - preventDefaults: function(input) { - var srcEvent = input.srcEvent; - var direction = input.offsetDirection; - - // if the touch action did prevented once this session - if (this.manager.session.prevented) { - srcEvent.preventDefault(); - return; - } - - var actions = this.actions; - var hasNone = inStr(actions, TOUCH_ACTION_NONE) && !TOUCH_ACTION_MAP[TOUCH_ACTION_NONE]; - var hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_Y]; - var hasPanX = inStr(actions, TOUCH_ACTION_PAN_X) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_X]; - - if (hasNone) { - //do not prevent defaults if this is a tap gesture - - var isTapPointer = input.pointers.length === 1; - var isTapMovement = input.distance < 2; - var isTapTouchTime = input.deltaTime < 250; - - if (isTapPointer && isTapMovement && isTapTouchTime) { - return; - } - } - - if (hasPanX && hasPanY) { - // `pan-x pan-y` means browser handles all scrolling/panning, do not prevent - return; - } - - if (hasNone || - (hasPanY && direction & DIRECTION_HORIZONTAL) || - (hasPanX && direction & DIRECTION_VERTICAL)) { - return this.preventSrc(srcEvent); - } - }, - - /** - * call preventDefault to prevent the browser's default behavior (scrolling in most cases) - * @param {Object} srcEvent - */ - preventSrc: function(srcEvent) { - this.manager.session.prevented = true; - srcEvent.preventDefault(); - } -}; - -/** - * when the touchActions are collected they are not a valid value, so we need to clean things up. * - * @param {String} actions - * @returns {*} - */ -function cleanTouchActions(actions) { - // none - if (inStr(actions, TOUCH_ACTION_NONE)) { - return TOUCH_ACTION_NONE; - } - - var hasPanX = inStr(actions, TOUCH_ACTION_PAN_X); - var hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y); - - // if both pan-x and pan-y are set (different recognizers - // for different directions, e.g. horizontal pan but vertical swipe?) - // we need none (as otherwise with pan-x pan-y combined none of these - // recognizers will work, since the browser would handle all panning - if (hasPanX && hasPanY) { - return TOUCH_ACTION_NONE; - } - - // pan-x OR pan-y - if (hasPanX || hasPanY) { - return hasPanX ? TOUCH_ACTION_PAN_X : TOUCH_ACTION_PAN_Y; - } - - // manipulation - if (inStr(actions, TOUCH_ACTION_MANIPULATION)) { - return TOUCH_ACTION_MANIPULATION; - } - - return TOUCH_ACTION_AUTO; -} - -function getTouchActionProps() { - if (!NATIVE_TOUCH_ACTION) { - return false; - } - var touchMap = {}; - var cssSupports = window.CSS && window.CSS.supports; - ['auto', 'manipulation', 'pan-y', 'pan-x', 'pan-x pan-y', 'none'].forEach(function(val) { - - // If css.supports is not supported but there is native touch-action assume it supports - // all values. This is the case for IE 10 and 11. - touchMap[val] = cssSupports ? window.CSS.supports('touch-action', val) : true; - }); - return touchMap; -} - -/** - * Recognizer flow explained; * - * All recognizers have the initial state of POSSIBLE when a input session starts. - * The definition of a input session is from the first input until the last input, with all it's movement in it. * - * Example session for mouse-input: mousedown -> mousemove -> mouseup - * - * On each recognizing cycle (see Manager.recognize) the .recognize() method is executed - * which determines with state it should be. - * - * If the recognizer has the state FAILED, CANCELLED or RECOGNIZED (equals ENDED), it is reset to - * POSSIBLE to give it another change on the next cycle. - * - * Possible - * | - * +-----+---------------+ - * | | - * +-----+-----+ | - * | | | - * Failed Cancelled | - * +-------+------+ - * | | - * Recognized Began - * | - * Changed - * | - * Ended/Recognized - */ -var STATE_POSSIBLE = 1; -var STATE_BEGAN = 2; -var STATE_CHANGED = 4; -var STATE_ENDED = 8; -var STATE_RECOGNIZED = STATE_ENDED; -var STATE_CANCELLED = 16; -var STATE_FAILED = 32; - -/** - * Recognizer - * Every recognizer needs to extend from this class. - * @constructor - * @param {Object} options - */ -function Recognizer(options) { - this.options = assign({}, this.defaults, options || {}); - - this.id = uniqueId(); - - this.manager = null; - - // default is enable true - this.options.enable = ifUndefined(this.options.enable, true); - - this.state = STATE_POSSIBLE; - - this.simultaneous = {}; - this.requireFail = []; -} - -Recognizer.prototype = { - /** - * @virtual - * @type {Object} - */ - defaults: {}, - - /** - * set options - * @param {Object} options - * @return {Recognizer} - */ - set: function(options) { - assign(this.options, options); - - // also update the touchAction, in case something changed about the directions/enabled state - this.manager && this.manager.touchAction.update(); - return this; - }, - - /** - * recognize simultaneous with an other recognizer. - * @param {Recognizer} otherRecognizer - * @returns {Recognizer} this - */ - recognizeWith: function(otherRecognizer) { - if (invokeArrayArg(otherRecognizer, 'recognizeWith', this)) { - return this; - } - - var simultaneous = this.simultaneous; - otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); - if (!simultaneous[otherRecognizer.id]) { - simultaneous[otherRecognizer.id] = otherRecognizer; - otherRecognizer.recognizeWith(this); - } - return this; - }, - - /** - * drop the simultaneous link. it doesnt remove the link on the other recognizer. - * @param {Recognizer} otherRecognizer - * @returns {Recognizer} this - */ - dropRecognizeWith: function(otherRecognizer) { - if (invokeArrayArg(otherRecognizer, 'dropRecognizeWith', this)) { - return this; - } - - otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); - delete this.simultaneous[otherRecognizer.id]; - return this; - }, - - /** - * recognizer can only run when an other is failing - * @param {Recognizer} otherRecognizer - * @returns {Recognizer} this - */ - requireFailure: function(otherRecognizer) { - if (invokeArrayArg(otherRecognizer, 'requireFailure', this)) { - return this; - } - - var requireFail = this.requireFail; - otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); - if (inArray(requireFail, otherRecognizer) === -1) { - requireFail.push(otherRecognizer); - otherRecognizer.requireFailure(this); - } - return this; - }, - - /** - * drop the requireFailure link. it does not remove the link on the other recognizer. - * @param {Recognizer} otherRecognizer - * @returns {Recognizer} this - */ - dropRequireFailure: function(otherRecognizer) { - if (invokeArrayArg(otherRecognizer, 'dropRequireFailure', this)) { - return this; - } - - otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); - var index = inArray(this.requireFail, otherRecognizer); - if (index > -1) { - this.requireFail.splice(index, 1); - } - return this; - }, - - /** - * has require failures boolean - * @returns {boolean} - */ - hasRequireFailures: function() { - return this.requireFail.length > 0; - }, - - /** - * if the recognizer can recognize simultaneous with an other recognizer - * @param {Recognizer} otherRecognizer - * @returns {Boolean} - */ - canRecognizeWith: function(otherRecognizer) { - return !!this.simultaneous[otherRecognizer.id]; - }, - - /** - * You should use `tryEmit` instead of `emit` directly to check - * that all the needed recognizers has failed before emitting. - * @param {Object} input - */ - emit: function(input) { - var self = this; - var state = this.state; - - function emit(event) { - self.manager.emit(event, input); - } - - // 'panstart' and 'panmove' - if (state < STATE_ENDED) { - emit(self.options.event + stateStr(state)); - } - - emit(self.options.event); // simple 'eventName' events - - if (input.additionalEvent) { // additional event(panleft, panright, pinchin, pinchout...) - emit(input.additionalEvent); - } - - // panend and pancancel - if (state >= STATE_ENDED) { - emit(self.options.event + stateStr(state)); - } - }, - - /** - * Check that all the require failure recognizers has failed, - * if true, it emits a gesture event, - * otherwise, setup the state to FAILED. - * @param {Object} input - */ - tryEmit: function(input) { - if (this.canEmit()) { - return this.emit(input); - } - // it's failing anyway - this.state = STATE_FAILED; - }, - - /** - * can we emit? - * @returns {boolean} - */ - canEmit: function() { - var i = 0; - while (i < this.requireFail.length) { - if (!(this.requireFail[i].state & (STATE_FAILED | STATE_POSSIBLE))) { - return false; - } - i++; - } - return true; - }, - - /** - * update the recognizer - * @param {Object} inputData - */ - recognize: function(inputData) { - // make a new copy of the inputData - // so we can change the inputData without messing up the other recognizers - var inputDataClone = assign({}, inputData); - - // is is enabled and allow recognizing? - if (!boolOrFn(this.options.enable, [this, inputDataClone])) { - this.reset(); - this.state = STATE_FAILED; - return; - } - - // reset when we've reached the end - if (this.state & (STATE_RECOGNIZED | STATE_CANCELLED | STATE_FAILED)) { - this.state = STATE_POSSIBLE; - } - - this.state = this.process(inputDataClone); - - // the recognizer has recognized a gesture - // so trigger an event - if (this.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED | STATE_CANCELLED)) { - this.tryEmit(inputDataClone); - } - }, - - /** - * return the state of the recognizer - * the actual recognizing happens in this method - * @virtual - * @param {Object} inputData - * @returns {Const} STATE - */ - process: function(inputData) { }, // jshint ignore:line - - /** - * return the preferred touch-action - * @virtual - * @returns {Array} - */ - getTouchAction: function() { }, - - /** - * called when the gesture isn't allowed to recognize - * like when another is being recognized or it is disabled - * @virtual - */ - reset: function() { } -}; - -/** - * get a usable string, used as event postfix - * @param {Const} state - * @returns {String} state - */ -function stateStr(state) { - if (state & STATE_CANCELLED) { - return 'cancel'; - } else if (state & STATE_ENDED) { - return 'end'; - } else if (state & STATE_CHANGED) { - return 'move'; - } else if (state & STATE_BEGAN) { - return 'start'; - } - return ''; -} - -/** - * direction cons to string - * @param {Const} direction - * @returns {String} - */ -function directionStr(direction) { - if (direction == DIRECTION_DOWN) { - return 'down'; - } else if (direction == DIRECTION_UP) { - return 'up'; - } else if (direction == DIRECTION_LEFT) { - return 'left'; - } else if (direction == DIRECTION_RIGHT) { - return 'right'; - } - return ''; -} - -/** - * get a recognizer by name if it is bound to a manager - * @param {Recognizer|String} otherRecognizer - * @param {Recognizer} recognizer - * @returns {Recognizer} - */ -function getRecognizerByNameIfManager(otherRecognizer, recognizer) { - var manager = recognizer.manager; - if (manager) { - return manager.get(otherRecognizer); - } - return otherRecognizer; -} - -/** - * This recognizer is just used as a base for the simple attribute recognizers. - * @constructor - * @extends Recognizer - */ -function AttrRecognizer() { - Recognizer.apply(this, arguments); -} - -inherit(AttrRecognizer, Recognizer, { - /** - * @namespace - * @memberof AttrRecognizer - */ - defaults: { - /** - * @type {Number} - * @default 1 - */ - pointers: 1 - }, - - /** - * Used to check if it the recognizer receives valid input, like input.distance > 10. - * @memberof AttrRecognizer - * @param {Object} input - * @returns {Boolean} recognized - */ - attrTest: function(input) { - var optionPointers = this.options.pointers; - return optionPointers === 0 || input.pointers.length === optionPointers; - }, - - /** - * Process the input and return the state for the recognizer - * @memberof AttrRecognizer - * @param {Object} input - * @returns {*} State - */ - process: function(input) { - var state = this.state; - var eventType = input.eventType; - - var isRecognized = state & (STATE_BEGAN | STATE_CHANGED); - var isValid = this.attrTest(input); - - // on cancel input and we've recognized before, return STATE_CANCELLED - if (isRecognized && (eventType & INPUT_CANCEL || !isValid)) { - return state | STATE_CANCELLED; - } else if (isRecognized || isValid) { - if (eventType & INPUT_END) { - return state | STATE_ENDED; - } else if (!(state & STATE_BEGAN)) { - return STATE_BEGAN; - } - return state | STATE_CHANGED; - } - return STATE_FAILED; - } -}); - -/** - * Pan - * Recognized when the pointer is down and moved in the allowed direction. - * @constructor - * @extends AttrRecognizer - */ -function PanRecognizer() { - AttrRecognizer.apply(this, arguments); - - this.pX = null; - this.pY = null; -} - -inherit(PanRecognizer, AttrRecognizer, { - /** - * @namespace - * @memberof PanRecognizer - */ - defaults: { - event: 'pan', - threshold: 10, - pointers: 1, - direction: DIRECTION_ALL - }, - - getTouchAction: function() { - var direction = this.options.direction; - var actions = []; - if (direction & DIRECTION_HORIZONTAL) { - actions.push(TOUCH_ACTION_PAN_Y); - } - if (direction & DIRECTION_VERTICAL) { - actions.push(TOUCH_ACTION_PAN_X); - } - return actions; - }, - - directionTest: function(input) { - var options = this.options; - var hasMoved = true; - var distance = input.distance; - var direction = input.direction; - var x = input.deltaX; - var y = input.deltaY; - - // lock to axis? - if (!(direction & options.direction)) { - if (options.direction & DIRECTION_HORIZONTAL) { - direction = (x === 0) ? DIRECTION_NONE : (x < 0) ? DIRECTION_LEFT : DIRECTION_RIGHT; - hasMoved = x != this.pX; - distance = Math.abs(input.deltaX); - } else { - direction = (y === 0) ? DIRECTION_NONE : (y < 0) ? DIRECTION_UP : DIRECTION_DOWN; - hasMoved = y != this.pY; - distance = Math.abs(input.deltaY); - } - } - input.direction = direction; - return hasMoved && distance > options.threshold && direction & options.direction; - }, - - attrTest: function(input) { - return AttrRecognizer.prototype.attrTest.call(this, input) && - (this.state & STATE_BEGAN || (!(this.state & STATE_BEGAN) && this.directionTest(input))); - }, - - emit: function(input) { - - this.pX = input.deltaX; - this.pY = input.deltaY; - - var direction = directionStr(input.direction); - - if (direction) { - input.additionalEvent = this.options.event + direction; - } - this._super.emit.call(this, input); - } -}); - -/** - * Pinch - * Recognized when two or more pointers are moving toward (zoom-in) or away from each other (zoom-out). - * @constructor - * @extends AttrRecognizer - */ -function PinchRecognizer() { - AttrRecognizer.apply(this, arguments); -} - -inherit(PinchRecognizer, AttrRecognizer, { - /** - * @namespace - * @memberof PinchRecognizer - */ - defaults: { - event: 'pinch', - threshold: 0, - pointers: 2 - }, - - getTouchAction: function() { - return [TOUCH_ACTION_NONE]; - }, - - attrTest: function(input) { - return this._super.attrTest.call(this, input) && - (Math.abs(input.scale - 1) > this.options.threshold || this.state & STATE_BEGAN); - }, - - emit: function(input) { - if (input.scale !== 1) { - var inOut = input.scale < 1 ? 'in' : 'out'; - input.additionalEvent = this.options.event + inOut; - } - this._super.emit.call(this, input); - } -}); - -/** - * Press - * Recognized when the pointer is down for x ms without any movement. - * @constructor - * @extends Recognizer - */ -function PressRecognizer() { - Recognizer.apply(this, arguments); - - this._timer = null; - this._input = null; -} - -inherit(PressRecognizer, Recognizer, { - /** - * @namespace - * @memberof PressRecognizer - */ - defaults: { - event: 'press', - pointers: 1, - time: 251, // minimal time of the pointer to be pressed - threshold: 9 // a minimal movement is ok, but keep it low - }, - - getTouchAction: function() { - return [TOUCH_ACTION_AUTO]; - }, - - process: function(input) { - var options = this.options; - var validPointers = input.pointers.length === options.pointers; - var validMovement = input.distance < options.threshold; - var validTime = input.deltaTime > options.time; - - this._input = input; - - // we only allow little movement - // and we've reached an end event, so a tap is possible - if (!validMovement || !validPointers || (input.eventType & (INPUT_END | INPUT_CANCEL) && !validTime)) { - this.reset(); - } else if (input.eventType & INPUT_START) { - this.reset(); - this._timer = setTimeoutContext(function() { - this.state = STATE_RECOGNIZED; - this.tryEmit(); - }, options.time, this); - } else if (input.eventType & INPUT_END) { - return STATE_RECOGNIZED; - } - return STATE_FAILED; - }, - - reset: function() { - clearTimeout(this._timer); - }, - - emit: function(input) { - if (this.state !== STATE_RECOGNIZED) { - return; - } - - if (input && (input.eventType & INPUT_END)) { - this.manager.emit(this.options.event + 'up', input); - } else { - this._input.timeStamp = now(); - this.manager.emit(this.options.event, this._input); - } - } -}); - -/** - * Rotate - * Recognized when two or more pointer are moving in a circular motion. - * @constructor - * @extends AttrRecognizer - */ -function RotateRecognizer() { - AttrRecognizer.apply(this, arguments); -} - -inherit(RotateRecognizer, AttrRecognizer, { - /** - * @namespace - * @memberof RotateRecognizer - */ - defaults: { - event: 'rotate', - threshold: 0, - pointers: 2 - }, - - getTouchAction: function() { - return [TOUCH_ACTION_NONE]; - }, - - attrTest: function(input) { - return this._super.attrTest.call(this, input) && - (Math.abs(input.rotation) > this.options.threshold || this.state & STATE_BEGAN); - } -}); - -/** - * Swipe - * Recognized when the pointer is moving fast (velocity), with enough distance in the allowed direction. - * @constructor - * @extends AttrRecognizer - */ -function SwipeRecognizer() { - AttrRecognizer.apply(this, arguments); -} - -inherit(SwipeRecognizer, AttrRecognizer, { - /** - * @namespace - * @memberof SwipeRecognizer - */ - defaults: { - event: 'swipe', - threshold: 10, - velocity: 0.3, - direction: DIRECTION_HORIZONTAL | DIRECTION_VERTICAL, - pointers: 1 - }, - - getTouchAction: function() { - return PanRecognizer.prototype.getTouchAction.call(this); - }, - - attrTest: function(input) { - var direction = this.options.direction; - var velocity; - - if (direction & (DIRECTION_HORIZONTAL | DIRECTION_VERTICAL)) { - velocity = input.overallVelocity; - } else if (direction & DIRECTION_HORIZONTAL) { - velocity = input.overallVelocityX; - } else if (direction & DIRECTION_VERTICAL) { - velocity = input.overallVelocityY; - } - - return this._super.attrTest.call(this, input) && - direction & input.offsetDirection && - input.distance > this.options.threshold && - input.maxPointers == this.options.pointers && - abs(velocity) > this.options.velocity && input.eventType & INPUT_END; - }, - - emit: function(input) { - var direction = directionStr(input.offsetDirection); - if (direction) { - this.manager.emit(this.options.event + direction, input); - } - - this.manager.emit(this.options.event, input); - } -}); - -/** - * A tap is ecognized when the pointer is doing a small tap/click. Multiple taps are recognized if they occur - * between the given interval and position. The delay option can be used to recognize multi-taps without firing - * a single tap. - * - * The eventData from the emitted event contains the property `tapCount`, which contains the amount of - * multi-taps being recognized. - * @constructor - * @extends Recognizer - */ -function TapRecognizer() { - Recognizer.apply(this, arguments); - - // previous time and center, - // used for tap counting - this.pTime = false; - this.pCenter = false; - - this._timer = null; - this._input = null; - this.count = 0; -} - -inherit(TapRecognizer, Recognizer, { - /** - * @namespace - * @memberof PinchRecognizer - */ - defaults: { - event: 'tap', - pointers: 1, - taps: 1, - interval: 300, // max time between the multi-tap taps - time: 250, // max time of the pointer to be down (like finger on the screen) - threshold: 9, // a minimal movement is ok, but keep it low - posThreshold: 10 // a multi-tap can be a bit off the initial position - }, - - getTouchAction: function() { - return [TOUCH_ACTION_MANIPULATION]; - }, - - process: function(input) { - var options = this.options; - - var validPointers = input.pointers.length === options.pointers; - var validMovement = input.distance < options.threshold; - var validTouchTime = input.deltaTime < options.time; - - this.reset(); - - if ((input.eventType & INPUT_START) && (this.count === 0)) { - return this.failTimeout(); - } - - // we only allow little movement - // and we've reached an end event, so a tap is possible - if (validMovement && validTouchTime && validPointers) { - if (input.eventType != INPUT_END) { - return this.failTimeout(); - } - - var validInterval = this.pTime ? (input.timeStamp - this.pTime < options.interval) : true; - var validMultiTap = !this.pCenter || getDistance(this.pCenter, input.center) < options.posThreshold; - - this.pTime = input.timeStamp; - this.pCenter = input.center; - - if (!validMultiTap || !validInterval) { - this.count = 1; - } else { - this.count += 1; - } - - this._input = input; - - // if tap count matches we have recognized it, - // else it has began recognizing... - var tapCount = this.count % options.taps; - if (tapCount === 0) { - // no failing requirements, immediately trigger the tap event - // or wait as long as the multitap interval to trigger - if (!this.hasRequireFailures()) { - return STATE_RECOGNIZED; - } else { - this._timer = setTimeoutContext(function() { - this.state = STATE_RECOGNIZED; - this.tryEmit(); - }, options.interval, this); - return STATE_BEGAN; - } - } - } - return STATE_FAILED; - }, - - failTimeout: function() { - this._timer = setTimeoutContext(function() { - this.state = STATE_FAILED; - }, this.options.interval, this); - return STATE_FAILED; - }, - - reset: function() { - clearTimeout(this._timer); - }, - - emit: function() { - if (this.state == STATE_RECOGNIZED) { - this._input.tapCount = this.count; - this.manager.emit(this.options.event, this._input); - } - } -}); - -/** - * Simple way to create a manager with a default set of recognizers. - * @param {HTMLElement} element - * @param {Object} [options] - * @constructor - */ -function Hammer(element, options) { - options = options || {}; - options.recognizers = ifUndefined(options.recognizers, Hammer.defaults.preset); - return new Manager(element, options); -} - -/** - * @const {string} - */ -Hammer.VERSION = '2.0.7'; - -/** - * default settings - * @namespace - */ -Hammer.defaults = { - /** - * set if DOM events are being triggered. - * But this is slower and unused by simple implementations, so disabled by default. - * @type {Boolean} - * @default false - */ - domEvents: false, - - /** - * The value for the touchAction property/fallback. - * When set to `compute` it will magically set the correct value based on the added recognizers. - * @type {String} - * @default compute - */ - touchAction: TOUCH_ACTION_COMPUTE, - - /** - * @type {Boolean} - * @default true - */ - enable: true, - - /** - * EXPERIMENTAL FEATURE -- can be removed/changed - * Change the parent input target element. - * If Null, then it is being set the to main element. - * @type {Null|EventTarget} - * @default null - */ - inputTarget: null, - - /** - * force an input class - * @type {Null|Function} - * @default null - */ - inputClass: null, - - /** - * Default recognizer setup when calling `Hammer()` - * When creating a new Manager these will be skipped. - * @type {Array} - */ - preset: [ - // RecognizerClass, options, [recognizeWith, ...], [requireFailure, ...] - [RotateRecognizer, {enable: false}], - [PinchRecognizer, {enable: false}, ['rotate']], - [SwipeRecognizer, {direction: DIRECTION_HORIZONTAL}], - [PanRecognizer, {direction: DIRECTION_HORIZONTAL}, ['swipe']], - [TapRecognizer], - [TapRecognizer, {event: 'doubletap', taps: 2}, ['tap']], - [PressRecognizer] - ], - - /** - * Some CSS properties can be used to improve the working of Hammer. - * Add them to this method and they will be set when creating a new Manager. - * @namespace - */ - cssProps: { - /** - * Disables text selection to improve the dragging gesture. Mainly for desktop browsers. - * @type {String} - * @default 'none' - */ - userSelect: 'none', - - /** - * Disable the Windows Phone grippers when pressing an element. - * @type {String} - * @default 'none' - */ - touchSelect: 'none', - - /** - * Disables the default callout shown when you touch and hold a touch target. - * On iOS, when you touch and hold a touch target such as a link, Safari displays - * a callout containing information about the link. This property allows you to disable that callout. - * @type {String} - * @default 'none' - */ - touchCallout: 'none', - - /** - * Specifies whether zooming is enabled. Used by IE10> - * @type {String} - * @default 'none' - */ - contentZooming: 'none', - - /** - * Specifies that an entire element should be draggable instead of its contents. Mainly for desktop browsers. - * @type {String} - * @default 'none' - */ - userDrag: 'none', - - /** - * Overrides the highlight color shown when the user taps a link or a JavaScript - * clickable element in iOS. This property obeys the alpha value, if specified. - * @type {String} - * @default 'rgba(0,0,0,0)' - */ - tapHighlightColor: 'rgba(0,0,0,0)' - } -}; - -var STOP = 1; -var FORCED_STOP = 2; - -/** - * Manager - * @param {HTMLElement} element - * @param {Object} [options] - * @constructor - */ -function Manager(element, options) { - this.options = assign({}, Hammer.defaults, options || {}); - - this.options.inputTarget = this.options.inputTarget || element; - - this.handlers = {}; - this.session = {}; - this.recognizers = []; - this.oldCssProps = {}; - - this.element = element; - this.input = createInputInstance(this); - this.touchAction = new TouchAction(this, this.options.touchAction); - - toggleCssProps(this, true); - - each(this.options.recognizers, function(item) { - var recognizer = this.add(new (item[0])(item[1])); - item[2] && recognizer.recognizeWith(item[2]); - item[3] && recognizer.requireFailure(item[3]); - }, this); -} - -Manager.prototype = { - /** - * set options - * @param {Object} options - * @returns {Manager} - */ - set: function(options) { - assign(this.options, options); - - // Options that need a little more setup - if (options.touchAction) { - this.touchAction.update(); - } - if (options.inputTarget) { - // Clean up existing event listeners and reinitialize - this.input.destroy(); - this.input.target = options.inputTarget; - this.input.init(); - } - return this; - }, - - /** - * stop recognizing for this session. - * This session will be discarded, when a new [input]start event is fired. - * When forced, the recognizer cycle is stopped immediately. - * @param {Boolean} [force] - */ - stop: function(force) { - this.session.stopped = force ? FORCED_STOP : STOP; - }, - - /** - * run the recognizers! - * called by the inputHandler function on every movement of the pointers (touches) - * it walks through all the recognizers and tries to detect the gesture that is being made - * @param {Object} inputData - */ - recognize: function(inputData) { - var session = this.session; - if (session.stopped) { - return; - } - - // run the touch-action polyfill - this.touchAction.preventDefaults(inputData); - - var recognizer; - var recognizers = this.recognizers; - - // this holds the recognizer that is being recognized. - // so the recognizer's state needs to be BEGAN, CHANGED, ENDED or RECOGNIZED - // if no recognizer is detecting a thing, it is set to `null` - var curRecognizer = session.curRecognizer; - - // reset when the last recognizer is recognized - // or when we're in a new session - if (!curRecognizer || (curRecognizer && curRecognizer.state & STATE_RECOGNIZED)) { - curRecognizer = session.curRecognizer = null; - } - - var i = 0; - while (i < recognizers.length) { - recognizer = recognizers[i]; - - // find out if we are allowed try to recognize the input for this one. - // 1. allow if the session is NOT forced stopped (see the .stop() method) - // 2. allow if we still haven't recognized a gesture in this session, or the this recognizer is the one - // that is being recognized. - // 3. allow if the recognizer is allowed to run simultaneous with the current recognized recognizer. - // this can be setup with the `recognizeWith()` method on the recognizer. - if (session.stopped !== FORCED_STOP && ( // 1 - !curRecognizer || recognizer == curRecognizer || // 2 - recognizer.canRecognizeWith(curRecognizer))) { // 3 - recognizer.recognize(inputData); - } else { - recognizer.reset(); - } - - // if the recognizer has been recognizing the input as a valid gesture, we want to store this one as the - // current active recognizer. but only if we don't already have an active recognizer - if (!curRecognizer && recognizer.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED)) { - curRecognizer = session.curRecognizer = recognizer; - } - i++; - } - }, - - /** - * get a recognizer by its event name. - * @param {Recognizer|String} recognizer - * @returns {Recognizer|Null} - */ - get: function(recognizer) { - if (recognizer instanceof Recognizer) { - return recognizer; - } - - var recognizers = this.recognizers; - for (var i = 0; i < recognizers.length; i++) { - if (recognizers[i].options.event == recognizer) { - return recognizers[i]; - } - } - return null; - }, - - /** - * add a recognizer to the manager - * existing recognizers with the same event name will be removed - * @param {Recognizer} recognizer - * @returns {Recognizer|Manager} - */ - add: function(recognizer) { - if (invokeArrayArg(recognizer, 'add', this)) { - return this; - } - - // remove existing - var existing = this.get(recognizer.options.event); - if (existing) { - this.remove(existing); - } - - this.recognizers.push(recognizer); - recognizer.manager = this; - - this.touchAction.update(); - return recognizer; - }, - - /** - * remove a recognizer by name or instance - * @param {Recognizer|String} recognizer - * @returns {Manager} - */ - remove: function(recognizer) { - if (invokeArrayArg(recognizer, 'remove', this)) { - return this; - } - - recognizer = this.get(recognizer); - - // let's make sure this recognizer exists - if (recognizer) { - var recognizers = this.recognizers; - var index = inArray(recognizers, recognizer); - - if (index !== -1) { - recognizers.splice(index, 1); - this.touchAction.update(); - } - } - - return this; - }, - - /** - * bind event - * @param {String} events - * @param {Function} handler - * @returns {EventEmitter} this - */ - on: function(events, handler) { - if (events === undefined) { - return; - } - if (handler === undefined) { - return; - } - - var handlers = this.handlers; - each(splitStr(events), function(event) { - handlers[event] = handlers[event] || []; - handlers[event].push(handler); - }); - return this; - }, - - /** - * unbind event, leave emit blank to remove all handlers - * @param {String} events - * @param {Function} [handler] - * @returns {EventEmitter} this - */ - off: function(events, handler) { - if (events === undefined) { - return; - } - - var handlers = this.handlers; - each(splitStr(events), function(event) { - if (!handler) { - delete handlers[event]; - } else { - handlers[event] && handlers[event].splice(inArray(handlers[event], handler), 1); - } - }); - return this; - }, - - /** - * emit event to the listeners - * @param {String} event - * @param {Object} data - */ - emit: function(event, data) { - // we also want to trigger dom events - if (this.options.domEvents) { - triggerDomEvent(event, data); - } - - // no handlers, so skip it all - var handlers = this.handlers[event] && this.handlers[event].slice(); - if (!handlers || !handlers.length) { - return; - } - - data.type = event; - data.preventDefault = function() { - data.srcEvent.preventDefault(); - }; - - var i = 0; - while (i < handlers.length) { - handlers[i](data); - i++; - } - }, - - /** - * destroy the manager and unbinds all events - * it doesn't unbind dom events, that is the user own responsibility - */ - destroy: function() { - this.element && toggleCssProps(this, false); - - this.handlers = {}; - this.session = {}; - this.input.destroy(); - this.element = null; - } -}; - -/** - * add/remove the css properties as defined in manager.options.cssProps - * @param {Manager} manager - * @param {Boolean} add - */ -function toggleCssProps(manager, add) { - var element = manager.element; - if (!element.style) { - return; - } - var prop; - each(manager.options.cssProps, function(value, name) { - prop = prefixed(element.style, name); - if (add) { - manager.oldCssProps[prop] = element.style[prop]; - element.style[prop] = value; - } else { - element.style[prop] = manager.oldCssProps[prop] || ''; - } - }); - if (!add) { - manager.oldCssProps = {}; - } -} - -/** - * trigger dom event - * @param {String} event - * @param {Object} data - */ -function triggerDomEvent(event, data) { - var gestureEvent = document.createEvent('Event'); - gestureEvent.initEvent(event, true, true); - gestureEvent.gesture = data; - data.target.dispatchEvent(gestureEvent); -} - -assign(Hammer, { - INPUT_START: INPUT_START, - INPUT_MOVE: INPUT_MOVE, - INPUT_END: INPUT_END, - INPUT_CANCEL: INPUT_CANCEL, - - STATE_POSSIBLE: STATE_POSSIBLE, - STATE_BEGAN: STATE_BEGAN, - STATE_CHANGED: STATE_CHANGED, - STATE_ENDED: STATE_ENDED, - STATE_RECOGNIZED: STATE_RECOGNIZED, - STATE_CANCELLED: STATE_CANCELLED, - STATE_FAILED: STATE_FAILED, - - DIRECTION_NONE: DIRECTION_NONE, - DIRECTION_LEFT: DIRECTION_LEFT, - DIRECTION_RIGHT: DIRECTION_RIGHT, - DIRECTION_UP: DIRECTION_UP, - DIRECTION_DOWN: DIRECTION_DOWN, - DIRECTION_HORIZONTAL: DIRECTION_HORIZONTAL, - DIRECTION_VERTICAL: DIRECTION_VERTICAL, - DIRECTION_ALL: DIRECTION_ALL, - - Manager: Manager, - Input: Input, - TouchAction: TouchAction, - - TouchInput: TouchInput, - MouseInput: MouseInput, - PointerEventInput: PointerEventInput, - TouchMouseInput: TouchMouseInput, - SingleTouchInput: SingleTouchInput, - - Recognizer: Recognizer, - AttrRecognizer: AttrRecognizer, - Tap: TapRecognizer, - Pan: PanRecognizer, - Swipe: SwipeRecognizer, - Pinch: PinchRecognizer, - Rotate: RotateRecognizer, - Press: PressRecognizer, - - on: addEventListeners, - off: removeEventListeners, - each: each, - merge: merge, - extend: extend, - assign: assign, - inherit: inherit, - bindFn: bindFn, - prefixed: prefixed -}); - -// this prevents errors when Hammer is loaded in the presence of an AMD -// style loader but by script tag, not by the loader. -var freeGlobal = (typeof window !== 'undefined' ? window : (typeof self !== 'undefined' ? self : {})); // jshint ignore:line -freeGlobal.Hammer = Hammer; - -if (true) { - !(__WEBPACK_AMD_DEFINE_RESULT__ = (function() { - return Hammer; - }).call(exports, __webpack_require__, exports, module), - __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); -} else {} - -})(window, document, 'Hammer'); - - -/***/ }), - -/***/ "./src/example.scss": -/*!**************************!*\ - !*** ./src/example.scss ***! - \**************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -// extracted by mini-css-extract-plugin - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/__.js": -/*!*****************************************!*\ - !*** ./node_modules/riot/esm/api/__.js ***! - \*****************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "__": () => (/* binding */ __) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/binding-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/binding-types.js"); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/expression-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/expression-types.js"); -/* harmony import */ var _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js */ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js"); -/* harmony import */ var _core_css_manager_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../core/css-manager.js */ "./node_modules/riot/esm/core/css-manager.js"); -/* Riot v7.1.0, @license MIT */ - - - - - - -// expose some internal stuff that might be used from external tools -const __ = { - cssManager: _core_css_manager_js__WEBPACK_IMPORTED_MODULE_0__["default"], - DOMBindings: { - template: _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__.template, - createBinding: _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__.createBinding, - createExpression: _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__.createExpression, - bindingTypes: _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__["default"], - expressionTypes: _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_3__["default"] - }, - globals: { - DOM_COMPONENT_INSTANCE_PROPERTY: _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.DOM_COMPONENT_INSTANCE_PROPERTY, - PARENT_KEY_SYMBOL: _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL - } -}; - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/component.js": -/*!************************************************!*\ - !*** ./node_modules/riot/esm/api/component.js ***! - \************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "component": () => (/* binding */ component) -/* harmony export */ }); -/* harmony import */ var _node_modules_cumpa_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/cumpa/index.next.js */ "./node_modules/riot/esm/node_modules/cumpa/index.next.js"); -/* harmony import */ var _core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/create-component-from-wrapper.js */ "./node_modules/riot/esm/core/create-component-from-wrapper.js"); -/* Riot v7.1.0, @license MIT */ - - - -/** - * Helper method to create component without relying on the registered ones - * @param {Object} implementation - component implementation - * @returns {Function} function that will allow you to mount a riot component on a DOM node - */ -function component(implementation) { - return function (el, props, _temp) { - let { - slots, - attributes, - parentScope - } = _temp === void 0 ? {} : _temp; - return (0,_node_modules_cumpa_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(c => c.mount(el, parentScope), c => c({ - props, - slots, - attributes - }), _core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_1__.createComponentFromWrapper)(implementation); - }; -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/install.js": -/*!**********************************************!*\ - !*** ./node_modules/riot/esm/api/install.js ***! - \**********************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "install": () => (/* binding */ install) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* Riot v7.1.0, @license MIT */ - - - - -/** - * Define a riot plugin - * @param {Function} plugin - function that will receive all the components created - * @returns {Set} the set containing all the plugins installed - */ -function install(plugin) { - if (!(0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__.isFunction)(plugin)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('Plugins must be of type function'); - if (_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.PLUGINS_SET.has(plugin)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('This plugin was already installed'); - _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.PLUGINS_SET.add(plugin); - return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.PLUGINS_SET; -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/mount.js": -/*!********************************************!*\ - !*** ./node_modules/riot/esm/api/mount.js ***! - \********************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "mount": () => (/* binding */ mount) -/* harmony export */ }); -/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); -/* harmony import */ var _core_mount_component_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/mount-component.js */ "./node_modules/riot/esm/core/mount-component.js"); +(()=>{var t,e={837:(t,e,n)=>{"use strict";var i={};n.r(i),n.d(i,{__:()=>ee,component:()=>Zt,install:()=>qt,mount:()=>$t,pure:()=>Jt,register:()=>Wt,uninstall:()=>Kt,unmount:()=>Gt,unregister:()=>Vt,version:()=>te,withTypes:()=>Qt}); +/* Riot WIP, @license MIT */ +const r=new Map,s=Symbol("riot-component"),o=new Set,a="mount",u="update",c="unmount",l="shouldUpdate",h="onBeforeMount",p="onMounted",d="onBeforeUpdate",f="onUpdated",m="onBeforeUnmount",v="onUnmounted",g="props",y="state",b="slots",T="root",x=Symbol("pure"),E=Symbol("is_updating"),O=Symbol("parent"),A=Symbol("attributes"),w=Symbol("template"),_={ATTRIBUTE:0,EVENT:1,TEXT:2,VALUE:3};function N(t){return t.replace(/-(\w)/g,((t,e)=>e.toUpperCase()))} +/* Riot WIP, @license MIT */ +function S(t,e){throw new Error(t,{cause:e})}function j(t){const e=new Map,n=n=>(e.has(n)||e.set(n,t.call(this,n)))&&e.get(n);return n.cache=e,n}function C(t){return t.reduce(((t,e)=>{const{value:n,type:i}=e;switch(!0){case!e.name&&0===i:return Object.assign({},t,n);case 3===i:t.value=e.value;break;default:t[N(e.name)]=e.value}return t}),{})} +/* Riot WIP, @license MIT */ +function M(t,e){return typeof t===e}function I(t){const e=t.ownerSVGElement;return!!e||null===e}function P(t){return"template"===t.tagName.toLowerCase()}function D(t){return M(t,"function")}function R(t){return!k(t)&&t.constructor===Object}function k(t){return null==t} +/* Riot WIP, @license MIT */ +function z(){return this}function L(t){return D(t)?t.prototype&&t.prototype.constructor?new t:t():t} /* Riot v7.1.0, @license MIT */ - - - -/** - * Mounting function that will work only for the components that were globally registered - * @param {string|HTMLElement} selector - query for the selection or a DOM element - * @param {Object} initialProps - the initial component properties - * @param {string} name - optional component name - * @returns {Array} list of riot components - */ -function mount(selector, initialProps, name) { - return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector).map(element => (0,_core_mount_component_js__WEBPACK_IMPORTED_MODULE_1__.mountComponent)(element, initialProps, name)); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/pure.js": -/*!*******************************************!*\ - !*** ./node_modules/riot/esm/api/pure.js ***! - \*******************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "pure": () => (/* binding */ pure) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +const U=Object.freeze({[a]:z,[u]:z,[c]:z}),Y=Object.assign({},U,{clone:z,createDOM:z});function X(t){for(;t.firstChild;)t.removeChild(t.firstChild)}const F=t=>t.remove(),H=(t,e)=>e&&e.parentNode&&e.parentNode.insertBefore(t,e),B={EACH:0,IF:1,SIMPLE:2,TAG:3,SLOT:4}; +/* Riot WIP, @license MIT */ +function W(t,e,n,i){return void 0===i&&(i={}),Object.defineProperty(t,e,Object.assign({value:n,enumerable:!1,writable:!1,configurable:!0},i)),t}function q(t,e,n){return Object.entries(e).forEach((e=>{let[i,r]=e;W(t,i,r,n)})),t}function V(t,e){return Object.entries(e).forEach((e=>{let[n,i]=e;t[n]||(t[n]=i)})),t} +/* Riot WIP, @license MIT */ +const $=Symbol(),G=Symbol();function K(t){const e=t.dom.cloneNode(!0),{head:n,tail:i}=function(){const t=document.createTextNode(""),e=document.createTextNode("");return t[$]=!0,e[G]=!0,{head:t,tail:e}}();return{avoidDOMInjection:!0,fragment:e,head:n,tail:i,children:[n,...Array.from(e.childNodes),i]}}const Z=Symbol("unmount"),J={nodes:[],mount(t,e){return this.update(t,e)},update(t,e){const{placeholder:n,nodes:i,childrenMap:r}=this,s=t===Z?null:this.evaluate(t),o=s?Array.from(s):[],{newChildrenMap:a,batches:u,futureNodes:c}=function(t,e,n,i){const{condition:r,template:s,childrenMap:o,itemName:a,getKey:u,indexName:c,root:l,isTemplateTag:h}=i,p=new Map,d=[],f=[];return t.forEach(((t,i)=>{const m=function(t,e){let{itemName:n,indexName:i,index:r,item:s}=e;W(t,n,s),i&&W(t,i,r);return t}(Object.create(e),{itemName:a,indexName:c,index:i,item:t}),v=u?u(m):i,g=o.get(v),y=[];if(function(t,e){return!!t&&!t(e)}(r,m))return;const b=!g,T=g?g.template:s.clone(),x=T.el||l.cloneNode(),E=h&&b?K(T):T.meta;b?d.push((()=>T.mount(x,m,n,E))):d.push((()=>T.update(m,n))),h?y.push(...E.children):y.push(x),o.delete(v),f.push(...y),p.set(v,{nodes:y,template:T,context:m,index:i})})),{newChildrenMap:p,batches:d,futureNodes:f}}(o,t,e,this);return((t,e,n,i)=>{const r=e.length;let s=t.length,o=r,a=0,u=0,c=null;for(;ai-u){const r=n(t[a],0);for(;u{if(i<0){const n=t[t.length-1];if(n){const{template:i,nodes:r,context:s}=n;r.pop(),r.length||(t.pop(),i.unmount(s,e,null))}}return n}}(Array.from(r.values()),e),n),u.forEach((t=>t())),this.childrenMap=a,this.nodes=c,this},unmount(t,e){return this.update(Z,e),this}};const Q={mount(t,e){return this.update(t,e)},update(t,e){const n=!!this.evaluate(t),i=!this.value&&n,r=this.value&&!n,s=()=>{const n=this.node.cloneNode();H(n,this.placeholder),this.template=this.template.clone(),this.template.mount(n,t,e)};switch(!0){case i:s();break;case r:this.unmount(t);break;default:n&&this.template.update(t,e)}return this.value=n,this},unmount(t,e){return this.template.unmount(t,e,!0),this}};const tt="undefined"==typeof Element?{}:Element.prototype,et=j((t=>tt.hasOwnProperty(t)));function nt(t,e,n,i){let{name:r}=e;if(!r)return i&&function(t,e,n){const i=e?Object.keys(e):[];Object.keys(n).filter((t=>!i.includes(t))).forEach((e=>t.removeAttribute(e)))}(t,n,i),void(n&&function(t,e){Object.entries(e).forEach((e=>{let[n,i]=e;return nt(t,{name:n},i)}))}(t,n));!et(r)&&(function(t){return M(t,"boolean")}(n)||R(n)||D(n))&&(t[r]=n),!function(t){return!t&&0!==t}(n)?function(t){return!0===t||["string","number"].includes(typeof t)}(n)&&t.setAttribute(r,function(t,e){return!0===e?t:e}(r,n)):t.removeAttribute(r)}const it=/^on/,rt={handleEvent(t){this[t.type](t)}},st=new WeakMap;function ot(t){return k(t)?"":t}const at=(t,e)=>{const n=t.childNodes[e];if(n.nodeType===Node.COMMENT_NODE){const e=document.createTextNode("");return t.replaceChild(e,n),e}return n};const ut={0:nt,1:function(t,e,n){let{name:i}=e;const r=i.replace(it,""),s=st.get(t)||(t=>{const e=Object.create(rt);return st.set(t,e),e})(t),[o,a]=(t=>Array.isArray(t)?t:[t,!1])(n),u=s[r],c=o&&!u;u&&!o&&t.removeEventListener(r,s),c&&t.addEventListener(r,s,a),s[r]=o},2:function(t,e,n){t.data=ot(n)},3:function(t,e,n){t.value=ot(n)}},ct={mount(t){return this.value=this.evaluate(t),lt(this,this.value),this},update(t){const e=this.evaluate(t);return this.value!==e&&(lt(this,e),this.value=e),this},unmount(){return 1===this.type&<(this,null),this}};function lt(t,e){return ut[t.type](t.node,t,e,t.value)}function ht(t,e){return Object.assign({},ct,e,{node:2===e.type?at(t,e.childNodeIndex):t})}const pt=(t,e)=>t[O]||e,dt={attributes:[],getTemplateScope(t,e){return function(t,e,n){if(!t||!t.length)return n;const i=t.map((t=>Object.assign({},t,{value:t.evaluate(e)})));return Object.assign(Object.create(n||null),C(i))}(this.attributes,t,e)},mount(t,e){const n=!!t.slots&&t.slots.find((t=>{let{id:e}=t;return e===this.name})),{parentNode:i}=this.node,r=pt(t,e);return this.template=n&&Et(n.html,n.bindings).createDOM(i),this.template&&(X(this.node),this.template.mount(this.node,this.getTemplateScope(t,r),r),this.template.children=Array.from(this.node.childNodes)),ft(this.node),F(this.node),this},update(t,e){if(this.template){const n=pt(t,e);this.template.update(this.getTemplateScope(t,n),n)}return this},unmount(t,e,n){return this.template&&this.template.unmount(this.getTemplateScope(t,e),null,n),this}};function ft(t){const e=t&&t.firstChild;e&&(H(e,t),ft(t))}function mt(t){return t.reduce(((t,e)=>{let{bindings:n}=e;return t.concat(n)}),[])}const vt={mount(t){return this.update(t)},update(t,e){const n=this.evaluate(t);return n&&n===this.name?this.tag.update(t):(this.unmount(t,e,!0),this.name=n,this.tag=function(t,e,n){return void 0===e&&(e=[]),void 0===n&&(n=[]),t?t({slots:e,attributes:n}):Et(function(t){return t.reduce(((t,e)=>t+e.html),"")}(e),[...mt(e),{expressions:n.map((t=>Object.assign({type:0},t)))}])}(this.getComponent(n),this.slots,this.attributes),this.tag.mount(this.node,t)),this},unmount(t,e,n){return this.tag&&this.tag.unmount(n),this}};const gt={1:function(t,e){let{evaluate:n,template:i}=e;const r=document.createTextNode("");return H(r,t),F(t),Object.assign({},Q,{node:t,evaluate:n,placeholder:r,template:i.createDOM(t)})},2:function(t,e){let{expressions:n}=e;return Object.assign({},(i=n.map((e=>ht(t,e))),["mount","update","unmount"].reduce(((t,e)=>Object.assign({},t,{[e]:t=>i.map((n=>n[e](t)))&&r})),{})));var i,r},0:function(t,e){let{evaluate:n,condition:i,itemName:r,indexName:s,getKey:o,template:a}=e;const u=document.createTextNode(""),c=t.cloneNode();return H(u,t),F(t),Object.assign({},J,{childrenMap:new Map,node:t,root:c,condition:i,evaluate:n,isTemplateTag:P(c),template:a.createDOM(t),getKey:o,indexName:s,itemName:r,placeholder:u})},3:function(t,e){let{evaluate:n,getComponent:i,slots:r,attributes:s}=e;return Object.assign({},vt,{node:t,evaluate:n,slots:r,attributes:s,getComponent:i})},4:function(t,e){let{name:n,attributes:i}=e;return Object.assign({},dt,{attributes:i,node:t,name:n})}};function yt(t,e){return t.map((t=>2===t.type?Object.assign({},t,{childNodeIndex:t.childNodeIndex+e}):t))}function bt(t,e,n){const{selector:i,type:r,redundantAttribute:s,expressions:o}=e,a=i?t.querySelector(i):t;s&&a.removeAttribute(s);const u=o||[];return(gt[r]||gt[2])(a,Object.assign({},e,{expressions:n&&!i?yt(u,n):u}))}function Tt(t,e){return I(t)?function(t,e){return e.ownerDocument.importNode((new window.DOMParser).parseFromString(`${t}`,"application/xml").documentElement,!0)}(e,t):function(t,e){const n=P(e)?e:document.createElement("template");return n.innerHTML=t,n.content}(e,t)}const xt={createDOM(t){return this.dom=this.dom||function(t,e){return e&&("string"==typeof e?Tt(t,e):e)}(t,this.html)||document.createDocumentFragment(),this},mount(t,e,n,i){void 0===i&&(i={}),t||S("Please provide DOM node to mount properly your template"),this.el&&this.unmount(e);const{fragment:r,children:s,avoidDOMInjection:o}=i,{parentNode:a}=s?s[0]:t,u=P(t),c=u?function(t,e,n){const i=Array.from(t.childNodes);return Math.max(i.indexOf(e),i.indexOf(n.head)+1,0)}(a,t,i):null;this.createDOM(t);const l=r||this.dom.cloneNode(!0);return this.el=u?a:t,this.children=u?s||Array.from(l.childNodes):null,!o&&l&&function(t,e){switch(!0){case I(t):!function(t,e){for(;t.firstChild;)e.appendChild(t.firstChild)}(e,t);break;case P(t):t.parentNode.replaceChild(e,t);break;default:t.appendChild(e)}}(t,l),this.bindings=this.bindingsData.map((t=>bt(this.el,t,c))),this.bindings.forEach((t=>t.mount(e,n))),this.meta=i,this},update(t,e){return this.bindings.forEach((n=>n.update(t,e))),this},unmount(t,e,n){void 0===n&&(n=!1);const i=this.el;if(!i)return this;switch(this.bindings.forEach((i=>i.unmount(t,e,n))),!0){case i[x]||null===n:break;case Array.isArray(this.children):!function(t){for(let e=0;e { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "register": () => (/* binding */ register) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* harmony import */ var _core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../core/create-component-from-wrapper.js */ "./node_modules/riot/esm/core/create-component-from-wrapper.js"); +const Ot=(t,e)=>t[s]=e; /* Riot v7.1.0, @license MIT */ - - - - -/** - * Register a custom tag by name - * @param {string} name - component name - * @param {Object} implementation - tag implementation - * @returns {Map} map containing all the components implementations - */ -function register(name, _ref) { - let { - css, - template, - exports - } = _ref; - if (_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP.has(name)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)(`The component "${name}" was already registered`); - _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP.set(name, (0,_core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_2__.createComponentFromWrapper)({ - name, - css, - template, - exports - })); - return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP; -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/uninstall.js": -/*!************************************************!*\ - !*** ./node_modules/riot/esm/api/uninstall.js ***! - \************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "uninstall": () => (/* binding */ uninstall) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +function At(t){return[a,u,c].reduce(((e,n)=>(e[n]=t(n),e)),{})} +/* Riot WIP, @license MIT */ +function wt(t){return Array.isArray(t)?t:/^\[object (HTMLCollection|NodeList|Object)\]$/.test(Object.prototype.toString.call(t))&&"number"==typeof t.length?Array.from(t):[t]} +/* Riot WIP, @license MIT */ +function _t(t,e){return wt("string"==typeof t?(e||document).querySelectorAll(t):t)} /* Riot v7.1.0, @license MIT */ - - - -/** - * Uninstall a riot plugin - * @param {Function} plugin - plugin previously installed - * @returns {Set} the set containing all the plugins installed - */ -function uninstall(plugin) { - if (!_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET.has(plugin)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('This plugin was never installed'); - _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET["delete"](plugin); - return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET; -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/unmount.js": -/*!**********************************************!*\ - !*** ./node_modules/riot/esm/api/unmount.js ***! - \**********************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "unmount": () => (/* binding */ unmount) -/* harmony export */ }); -/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +const Nt=Object.freeze({$(t){return _t(t,this.root)[0]},$$(t){return _t(t,this.root)}}),St=Object.freeze({[l]:z,[h]:z,[p]:z,[d]:z,[f]:z,[m]:z,[v]:z}),jt=t=>1===t.length?t[0]:t;function Ct(t,e,n){const i="object"==typeof e?e:{[e]:n},r=Object.keys(i);return wt(t).forEach((t=>{r.forEach((e=>t.setAttribute(e,i[e])))})),t}function Mt(t,e){return function(t,e,n){const i="string"==typeof e?[e]:e;return jt(wt(t).map((t=>jt(i.map((e=>t[n](e)))))))}(t,e,"getAttribute")} /* Riot v7.1.0, @license MIT */ - - - -/** - * Sweet unmounting helper function for the DOM node mounted manually by the user - * @param {string|HTMLElement} selector - query for the selection or a DOM element - * @param {boolean|null} keepRootElement - if true keep the root element - * @returns {Array} list of nodes unmounted - */ -function unmount(selector, keepRootElement) { - return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector).map(element => { - if (element[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.DOM_COMPONENT_INSTANCE_PROPERTY]) { - element[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.DOM_COMPONENT_INSTANCE_PROPERTY].unmount(keepRootElement); - } - return element; - }); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/unregister.js": -/*!*************************************************!*\ - !*** ./node_modules/riot/esm/api/unregister.js ***! - \*************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "unregister": () => (/* binding */ unregister) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* harmony import */ var _core_css_manager_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../core/css-manager.js */ "./node_modules/riot/esm/core/css-manager.js"); +const It=new Map,Pt=()=>Dt||(Ct(Dt=_t("style[riot]")[0]||document.createElement("style"),"type","text/css"),Dt.parentNode||document.head.appendChild(Dt),Dt);var Dt;const Rt={CSS_BY_NAME:It,add(t,e){return It.has(t)||(It.set(t,e),this.inject()),this},inject(){return Pt().innerHTML=[...It.values()].join("\n"),this},remove(t){return It.has(t)&&(It.delete(t),this.inject()),this}}; +/* Riot WIP, @license MIT */ +function kt(t){for(var e=arguments.length,n=new Array(e>1?e-1:0),i=1;i { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "version": () => (/* binding */ version) -/* harmony export */ }); +function zt(t){return Mt(t,"is")||t.tagName.toLowerCase()} /* Riot v7.1.0, @license MIT */ -/** @type {string} current riot version */ -const version = 'v7.1.0'; - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/api/with-types.js": -/*!*************************************************!*\ - !*** ./node_modules/riot/esm/api/with-types.js ***! - \*************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "withTypes": () => (/* binding */ withTypes) -/* harmony export */ }); +function Lt(t,e){return Object.assign({},t,L(e))} /* Riot v7.1.0, @license MIT */ -/** - * no-op function needed to add the proper types to your component via typescript - * @param {Function|Object} component - component default export - * @returns {Function|Object} returns exactly what it has received - */ -/* istanbul ignore next */ -const withTypes = component => component; - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/add-css-hook.js": -/*!****************************************************!*\ - !*** ./node_modules/riot/esm/core/add-css-hook.js ***! - \****************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "addCssHook": () => (/* binding */ addCssHook) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _utils_dom_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/dom.js */ "./node_modules/riot/esm/utils/dom.js"); -/* harmony import */ var _node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/bianco.attr/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.attr/index.next.js"); +function Ut(t,e){return void 0===e&&(e={}),Object.assign({}, +/* Riot WIP, @license MIT */ +function(t){return Array.from(t.attributes).reduce(((t,e)=>(t[N(e.name)]=e.value,t)),{})}(t),L(e))} /* Riot v7.1.0, @license MIT */ - - - - -/** - * Add eventually the "is" attribute to link this DOM node to its css - * @param {HTMLElement} element - target root node - * @param {string} name - name of the component mounted - * @returns {undefined} it's a void function - */ - -function addCssHook(element, name) { - if ((0,_utils_dom_js__WEBPACK_IMPORTED_MODULE_0__.getName)(element) !== name) { - (0,_node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__.set)(element, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.IS_DIRECTIVE, name); - } -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js": -/*!***************************************************************************!*\ - !*** ./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js ***! - \***************************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "bindDOMNodeToComponentInstance": () => (/* binding */ bindDOMNodeToComponentInstance) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +function Yt(t,e){let{slots:n,attributes:i,props:r}=e;return s= /* Riot v7.1.0, @license MIT */ - - -/** - * Bind a DOM node to its component object - * @param {HTMLElement} node - html node mounted - * @param {Object} component - Riot.js component object - * @returns {Object} the component object received as second argument - */ -const bindDOMNodeToComponentInstance = (node, component) => node[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.DOM_COMPONENT_INSTANCE_PROPERTY] = component; - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/component-dom-selectors.js": -/*!***************************************************************!*\ - !*** ./node_modules/riot/esm/core/component-dom-selectors.js ***! - \***************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "COMPONENT_DOM_SELECTORS": () => (/* binding */ COMPONENT_DOM_SELECTORS) -/* harmony export */ }); -/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); +function(t){return[...o].reduce(((t,e)=>e(t)||t),t)}(q(R(t)?Object.create(t):t,{mount(e,s,o){return void 0===s&&(s={}),W(e,x,!1),this[O]=o,this[A]= /* Riot v7.1.0, @license MIT */ - - -const COMPONENT_DOM_SELECTORS = Object.freeze({ - // component helpers - $(selector) { - return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector, this.root)[0]; - }, - $$(selector) { - return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector, this.root); - } -}); - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/component-lifecycle-methods.js": -/*!*******************************************************************!*\ - !*** ./node_modules/riot/esm/core/component-lifecycle-methods.js ***! - \*******************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "COMPONENT_LIFECYCLE_METHODS": () => (/* binding */ COMPONENT_LIFECYCLE_METHODS) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +function(t,e){void 0===e&&(e=[]);const n=e.map((e=>ht(t,e))),i={};return Object.assign(i,Object.assign({expressions:n},At((t=>e=>(n.forEach((n=>n[t](e))),i)))))}(e,i).mount(o),W(this,g,Object.freeze(Object.assign({},Ut(e,r),C(this[A].expressions)))),this[y]=Lt(this[y],s),this[w]=this.template.createDOM(e).clone(),Ot(e,this),t.name&& /* Riot v7.1.0, @license MIT */ - - - -const COMPONENT_LIFECYCLE_METHODS = Object.freeze({ - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.SHOULD_UPDATE_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_BEFORE_MOUNT_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_MOUNTED_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_BEFORE_UPDATE_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_UPDATED_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_BEFORE_UNMOUNT_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_UNMOUNTED_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop -}); - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/component-template-factory.js": -/*!******************************************************************!*\ - !*** ./node_modules/riot/esm/core/component-template-factory.js ***! - \******************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "componentTemplateFactory": () => (/* binding */ componentTemplateFactory) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js */ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js"); -/* harmony import */ var _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/expression-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/expression-types.js"); -/* harmony import */ var _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/binding-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/binding-types.js"); +function(t,e){zt(t)!==e&&Ct(t,"is",e)}(e,t.name),W(this,T,e),W(this,b,n),this[h](this[g],this[y]),this[w].mount(e,this,o),this[p](this[g],this[y]),this},update(t,e){void 0===t&&(t={}),e&&(this[O]=e,this[A].update(e));const n=C(this[A].expressions);if(!1!==this[l](n,this[g]))return W(this,g,Object.freeze(Object.assign({},this[g],n))),this[y]=Lt(this[y],t),this[d](this[g],this[y]),this[E]||(this[E]=!0,this[w].update(this,this[O])),this[f](this[g],this[y]),this[E]=!1,this},unmount(t){return this[m](this[g],this[y]),this[A].unmount(),this[w].unmount(this,this[O],null===t?null:!t),this[v](this[g],this[y]),this}})),Object.keys(t).filter((e=>D(t[e]))).forEach((t=>{s[t]=s[t].bind(s)})),s;var s} /* Riot v7.1.0, @license MIT */ - - - - -/** - * Factory function to create the component templates only once - * @param {Function} template - component template creation function - * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object - * @param {Function} getChildComponent - getter function to return the children components - * @returns {TemplateChunk} template chunk object - */ -function componentTemplateFactory(template, componentWrapper, getChildComponent) { - return template(_node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__.template, _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__["default"], _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__["default"], getChildComponent); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/compute-component-state.js": -/*!***************************************************************!*\ - !*** ./node_modules/riot/esm/core/compute-component-state.js ***! - \***************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "computeComponentState": () => (/* binding */ computeComponentState) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +function Xt(t){let{css:e,template:n,componentAPI:i,name:r}=t;return e&&r&&Rt.add(r,e),kt(Yt)(q(V(i,Object.assign({},St,{[g]:{},[y]:{}})),Object.assign({[b]:null,[T]:null},Nt,{name:r,css:e,template:n})))}const Ft=t=>{const e=(void 0===(n=t.exports?t.exports.components:{})&&(n={}),Object.entries(L(n)).reduce(((t,e)=>{let[n,i]=e; +/* Riot WIP, @license MIT */ +var r;return t[(r=n,r.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase())]=Bt(i),t}),{})); /* Riot v7.1.0, @license MIT */ - - -/** - * Compute the component current state merging it with its previous state - * @param {Object} oldState - previous state object - * @param {Object} newState - new state given to the `update` call - * @returns {Object} new object state - */ -function computeComponentState(oldState, newState) { - return Object.assign({}, oldState, (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.callOrAssign)(newState)); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/compute-initial-props.js": -/*!*************************************************************!*\ - !*** ./node_modules/riot/esm/core/compute-initial-props.js ***! - \*************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "computeInitialProps": () => (/* binding */ computeInitialProps) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_dom_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/dom.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/dom.js"); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +var n;return n=>n===t.name?Ht(t):e[n]||r.get(n)},Ht=j(Bt);function Bt(t){const{css:e,template:n,exports:i,name:r}=t,s=n? /* Riot v7.1.0, @license MIT */ - - - -/** - * Evaluate the component properties either from its real attributes or from its initial user properties - * @param {HTMLElement} element - component root - * @param {Object} initialProps - initial props - * @returns {Object} component props key value pairs - */ -function computeInitialProps(element, initialProps) { - if (initialProps === void 0) { - initialProps = {}; - } - return Object.assign({}, (0,_node_modules_riotjs_util_dom_js__WEBPACK_IMPORTED_MODULE_0__.DOMattributesToObject)(element), (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.callOrAssign)(initialProps)); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/create-attribute-bindings.js": -/*!*****************************************************************!*\ - !*** ./node_modules/riot/esm/core/create-attribute-bindings.js ***! - \*****************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "createAttributeBindings": () => (/* binding */ createAttributeBindings) -/* harmony export */ }); -/* harmony import */ var _create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./create-core-api-methods.js */ "./node_modules/riot/esm/core/create-core-api-methods.js"); -/* harmony import */ var _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js */ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js"); +function(t,e,n){return t(Et,_,B,n)}(n,0,Ft(t)):Y;return t=>{let{slots:o,attributes:u,props:c}=t;if(i&&i[x]) +/* Riot v7.1.0, @license MIT */return function(t,e){let{slots:n,attributes:i,props:r,css:s,template:o}=e;o&&S("Pure components can not have html"),s&&S("Pure components do not have css");const u=V(t({slots:n,attributes:i,props:r}),U);return At((t=>function(){for(var e=arguments.length,n=new Array(e),i=0;ih.mount(t,n,e),update:(t,e)=>h.update(e,t),unmount:t=>h.unmount(t)}}} /* Riot v7.1.0, @license MIT */ - - - -/** - * Create the bindings to update the component attributes - * @param {HTMLElement} node - node where we will bind the expressions - * @param {Array} attributes - list of attribute bindings - * @returns {TemplateChunk} - template bindings object - */ -function createAttributeBindings(node, attributes) { - if (attributes === void 0) { - attributes = []; - } - const expressions = attributes.map(a => (0,_node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__.createExpression)(node, a)); - const binding = {}; - return Object.assign(binding, Object.assign({ - expressions - }, (0,_create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_1__.createCoreAPIMethods)(method => scope => { - expressions.forEach(e => e[method](scope)); - return binding; - }))); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/create-component-from-wrapper.js": -/*!*********************************************************************!*\ - !*** ./node_modules/riot/esm/core/create-component-from-wrapper.js ***! - \*********************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "createComponentFromWrapper": () => (/* binding */ createComponentFromWrapper) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_strings_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/strings.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/strings.js"); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* harmony import */ var _mocked_template_interface_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./mocked-template-interface.js */ "./node_modules/riot/esm/core/mocked-template-interface.js"); -/* harmony import */ var _component_template_factory_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./component-template-factory.js */ "./node_modules/riot/esm/core/component-template-factory.js"); -/* harmony import */ var _create_pure_component_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./create-pure-component.js */ "./node_modules/riot/esm/core/create-pure-component.js"); -/* harmony import */ var _instantiate_component_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./instantiate-component.js */ "./node_modules/riot/esm/core/instantiate-component.js"); +function Wt(t,e){let{css:n,template:i,exports:s}=e;return r.has(t)&&S(`The component "${t}" was already registered`),r.set(t,Bt({name:t,css:n,template:i,exports:s})),r} /* Riot v7.1.0, @license MIT */ - - - - - - - - - -/** - * Create the subcomponents that can be included inside a tag in runtime - * @param {Object} components - components imported in runtime - * @returns {Object} all the components transformed into Riot.Component factory functions - */ -function createChildrenComponentsObject(components) { - if (components === void 0) { - components = {}; - } - return Object.entries((0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.callOrAssign)(components)).reduce((acc, _ref) => { - let [key, value] = _ref; - acc[(0,_node_modules_riotjs_util_strings_js__WEBPACK_IMPORTED_MODULE_1__.camelToDashCase)(key)] = createComponentFromWrapper(value); - return acc; - }, {}); -} - -/** - * Create the getter function to render the child components - * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object - * @returns {Function} function returning the component factory function - */ -const createChildComponentGetter = componentWrapper => { - const childrenComponents = createChildrenComponentsObject(componentWrapper.exports ? componentWrapper.exports.components : {}); - return name => { - // improve support for recursive components - if (name === componentWrapper.name) return memoizedCreateComponentFromWrapper(componentWrapper); - // return the registered components - return childrenComponents[name] || _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.COMPONENTS_IMPLEMENTATION_MAP.get(name); - }; -}; - -/** - * Performance optimization for the recursive components - * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object - * @returns {Object} component like interface - */ -const memoizedCreateComponentFromWrapper = (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_3__.memoize)(createComponentFromWrapper); - -/** - * Create the component interface needed for the @riotjs/dom-bindings tag bindings - * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object - * @param {string} componentWrapper.css - component css - * @param {Function} componentWrapper.template - function that will return the dom-bindings template function - * @param {Object} componentWrapper.exports - component interface - * @param {string} componentWrapper.name - component name - * @returns {Object} component like interface - */ -function createComponentFromWrapper(componentWrapper) { - const { - css, - template, - exports, - name - } = componentWrapper; - const templateFn = template ? (0,_component_template_factory_js__WEBPACK_IMPORTED_MODULE_4__.componentTemplateFactory)(template, componentWrapper, createChildComponentGetter(componentWrapper)) : _mocked_template_interface_js__WEBPACK_IMPORTED_MODULE_5__.MOCKED_TEMPLATE_INTERFACE; - return _ref2 => { - let { - slots, - attributes, - props - } = _ref2; - // pure components rendering will be managed by the end user - if (exports && exports[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.IS_PURE_SYMBOL]) return (0,_create_pure_component_js__WEBPACK_IMPORTED_MODULE_6__.createPureComponent)(exports, { - slots, - attributes, - props, - css, - template - }); - const componentAPI = (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.callOrAssign)(exports) || {}; - const component = (0,_instantiate_component_js__WEBPACK_IMPORTED_MODULE_7__.instantiateComponent)({ - css, - template: templateFn, - componentAPI, - name - })({ - slots, - attributes, - props - }); - - // notice that for the components created via tag binding - // we need to invert the mount (state/parentScope) arguments - // the template bindings will only forward the parentScope updates - // and never deal with the component state - return { - mount(element, parentScope, state) { - return component.mount(element, state, parentScope); - }, - update(parentScope, state) { - return component.update(state, parentScope); - }, - unmount(preserveRoot) { - return component.unmount(preserveRoot); - } - }; - }; -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/create-core-api-methods.js": -/*!***************************************************************!*\ - !*** ./node_modules/riot/esm/core/create-core-api-methods.js ***! - \***************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "createCoreAPIMethods": () => (/* binding */ createCoreAPIMethods) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +function qt(t){return D(t)||S("Plugins must be of type function"),o.has(t)&&S("This plugin was already installed"),o.add(t),o} /* Riot v7.1.0, @license MIT */ - - -/** - * Wrap the Riot.js core API methods using a mapping function - * @param {Function} mapFunction - lifting function - * @returns {Object} an object having the { mount, update, unmount } functions - */ -function createCoreAPIMethods(mapFunction) { - return [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.MOUNT_METHOD_KEY, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UPDATE_METHOD_KEY, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UNMOUNT_METHOD_KEY].reduce((acc, method) => { - acc[method] = mapFunction(method); - return acc; - }, {}); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/create-pure-component.js": -/*!*************************************************************!*\ - !*** ./node_modules/riot/esm/core/create-pure-component.js ***! - \*************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "createPureComponent": () => (/* binding */ createPureComponent) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* harmony import */ var _node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); -/* harmony import */ var _pure_component_api_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./pure-component-api.js */ "./node_modules/riot/esm/core/pure-component-api.js"); -/* harmony import */ var _bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./bind-dom-node-to-component-instance.js */ "./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js"); -/* harmony import */ var _create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./create-core-api-methods.js */ "./node_modules/riot/esm/core/create-core-api-methods.js"); +function Vt(t){return r.has(t)||S(`The component "${t}" was never registered`),r.delete(t),Rt.remove(t),r} /* Riot v7.1.0, @license MIT */ - - - - - - - -/** - * Create a pure component - * @param {Function} pureFactoryFunction - pure component factory function - * @param {Array} options.slots - component slots - * @param {Array} options.attributes - component attributes - * @param {Array} options.template - template factory function - * @param {Array} options.template - template factory function - * @param {any} options.props - initial component properties - * @returns {Object} pure component object - */ -function createPureComponent(pureFactoryFunction, _ref) { - let { - slots, - attributes, - props, - css, - template - } = _ref; - if (template) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_0__.panic)('Pure components can not have html'); - if (css) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_0__.panic)('Pure components do not have css'); - const component = (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_1__.defineDefaults)(pureFactoryFunction({ - slots, - attributes, - props - }), _pure_component_api_js__WEBPACK_IMPORTED_MODULE_2__.PURE_COMPONENT_API); - return (0,_create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_3__.createCoreAPIMethods)(method => function () { - for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } - // intercept the mount calls to bind the DOM node to the pure object created - // see also https://github.com/riot/riot/issues/2806 - if (method === _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.MOUNT_METHOD_KEY) { - const [element] = args; - // mark this node as pure element - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_1__.defineProperty)(element, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_PURE_SYMBOL, true); - (0,_bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_5__.bindDOMNodeToComponentInstance)(element, component); - } - component[method](...args); - return component; - }); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/css-manager.js": -/*!***************************************************!*\ - !*** ./node_modules/riot/esm/core/css-manager.js ***! - \***************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "CSS_BY_NAME": () => (/* binding */ CSS_BY_NAME), -/* harmony export */ "STYLE_NODE_SELECTOR": () => (/* binding */ STYLE_NODE_SELECTOR), -/* harmony export */ "default": () => (/* binding */ cssManager) -/* harmony export */ }); -/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); -/* harmony import */ var _node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/bianco.attr/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.attr/index.next.js"); +function $t(t,e,n){return _t(t).map((t=> /* Riot v7.1.0, @license MIT */ - - - -const CSS_BY_NAME = new Map(); -const STYLE_NODE_SELECTOR = 'style[riot]'; - -// memoized curried function -const getStyleNode = (style => { - return () => { - // lazy evaluation: - // if this function was already called before - // we return its cached result - if (style) return style; - - // create a new style element or use an existing one - // and cache it internally - style = (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(STYLE_NODE_SELECTOR)[0] || document.createElement('style'); - (0,_node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__.set)(style, 'type', 'text/css'); - - /* istanbul ignore next */ - if (!style.parentNode) document.head.appendChild(style); - return style; - }; -})(); - -/** - * Object that will be used to inject and manage the css of every tag instance - */ -const cssManager = { - CSS_BY_NAME, - /** - * Save a tag style to be later injected into DOM - * @param { string } name - if it's passed we will map the css to a tagname - * @param { string } css - css string - * @returns {Object} self - */ - add(name, css) { - if (!CSS_BY_NAME.has(name)) { - CSS_BY_NAME.set(name, css); - this.inject(); - } - return this; - }, - /** - * Inject all previously saved tag styles into DOM - * innerHTML seems slow: http://jsperf.com/riot-insert-style - * @returns {Object} self - */ - inject() { - getStyleNode().innerHTML = [...CSS_BY_NAME.values()].join('\n'); - return this; - }, - /** - * Remove a tag style from the DOM - * @param {string} name a registered tagname - * @returns {Object} self - */ - remove(name) { - if (CSS_BY_NAME.has(name)) { - CSS_BY_NAME.delete(name); - this.inject(); - } - return this; - } -}; - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/instantiate-component.js": -/*!*************************************************************!*\ - !*** ./node_modules/riot/esm/core/instantiate-component.js ***! - \*************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "instantiateComponent": () => (/* binding */ instantiateComponent) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); -/* harmony import */ var _component_dom_selectors_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./component-dom-selectors.js */ "./node_modules/riot/esm/core/component-dom-selectors.js"); -/* harmony import */ var _component_lifecycle_methods_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./component-lifecycle-methods.js */ "./node_modules/riot/esm/core/component-lifecycle-methods.js"); -/* harmony import */ var _css_manager_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./css-manager.js */ "./node_modules/riot/esm/core/css-manager.js"); -/* harmony import */ var _node_modules_curri_index_next_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/curri/index.next.js */ "./node_modules/riot/esm/node_modules/curri/index.next.js"); -/* harmony import */ var _manage_component_lifecycle_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./manage-component-lifecycle.js */ "./node_modules/riot/esm/core/manage-component-lifecycle.js"); +function(t,e,n,i){const s=n||zt(t);return r.has(s)||S(`The component named "${s}" was never registered`),r.get(s)({props:e,slots:i}).mount(t)}(t,e,n)))} /* Riot v7.1.0, @license MIT */ - - - - - - - - -/** - * Component definition function - * @param {Object} implementation - the component implementation will be generated via compiler - * @param {Object} component - the component initial properties - * @returns {Object} a new component implementation object - */ -function instantiateComponent(_ref) { - let { - css, - template, - componentAPI, - name - } = _ref; - // add the component css into the DOM - if (css && name) _css_manager_js__WEBPACK_IMPORTED_MODULE_0__["default"].add(name, css); - return (0,_node_modules_curri_index_next_js__WEBPACK_IMPORTED_MODULE_1__["default"])(_manage_component_lifecycle_js__WEBPACK_IMPORTED_MODULE_2__.manageComponentLifecycle)((0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_3__.defineProperties)( - // set the component defaults without overriding the original component API - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_3__.defineDefaults)(componentAPI, Object.assign({}, _component_lifecycle_methods_js__WEBPACK_IMPORTED_MODULE_4__.COMPONENT_LIFECYCLE_METHODS, { - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.PROPS_KEY]: {}, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.STATE_KEY]: {} - })), Object.assign({ - // defined during the component creation - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.SLOTS_KEY]: null, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.ROOT_KEY]: null - }, _component_dom_selectors_js__WEBPACK_IMPORTED_MODULE_6__.COMPONENT_DOM_SELECTORS, { - name, - css, - template - }))); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/manage-component-lifecycle.js": -/*!******************************************************************!*\ - !*** ./node_modules/riot/esm/core/manage-component-lifecycle.js ***! - \******************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "manageComponentLifecycle": () => (/* binding */ manageComponentLifecycle) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* harmony import */ var _node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); -/* harmony import */ var _add_css_hook_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./add-css-hook.js */ "./node_modules/riot/esm/core/add-css-hook.js"); -/* harmony import */ var _bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./bind-dom-node-to-component-instance.js */ "./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js"); -/* harmony import */ var _compute_component_state_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./compute-component-state.js */ "./node_modules/riot/esm/core/compute-component-state.js"); -/* harmony import */ var _compute_initial_props_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./compute-initial-props.js */ "./node_modules/riot/esm/core/compute-initial-props.js"); -/* harmony import */ var _create_attribute_bindings_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./create-attribute-bindings.js */ "./node_modules/riot/esm/core/create-attribute-bindings.js"); -/* harmony import */ var _run_plugins_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./run-plugins.js */ "./node_modules/riot/esm/core/run-plugins.js"); +function Gt(t,e){return _t(t).map((t=>(t[s]&&t[s].unmount(e),t)))} /* Riot v7.1.0, @license MIT */ - - - - - - - - - - - - -/** - * Component creation factory function that will enhance the user provided API - * @param {Object} component - a component implementation previously defined - * @param {Array} options.slots - component slots generated via riot compiler - * @param {Array} options.attributes - attribute expressions generated via riot compiler - * @returns {Riot.Component} a riot component instance - */ -function manageComponentLifecycle(component, _ref) { - let { - slots, - attributes, - props - } = _ref; - return (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.autobindMethods)((0,_run_plugins_js__WEBPACK_IMPORTED_MODULE_1__.runPlugins)((0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperties)((0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_3__.isObject)(component) ? Object.create(component) : component, { - mount(element, state, parentScope) { - if (state === void 0) { - state = {}; - } - // any element mounted passing through this function can't be a pure component - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(element, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_PURE_SYMBOL, false); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL] = parentScope; - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL] = (0,_create_attribute_bindings_js__WEBPACK_IMPORTED_MODULE_5__.createAttributeBindings)(element, attributes).mount(parentScope); - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY, Object.freeze(Object.assign({}, (0,_compute_initial_props_js__WEBPACK_IMPORTED_MODULE_6__.computeInitialProps)(element, props), (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_7__.evaluateAttributeExpressions)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].expressions)))); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY] = (0,_compute_component_state_js__WEBPACK_IMPORTED_MODULE_8__.computeComponentState)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY], state); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL] = this.template.createDOM(element).clone(); - - // link this object to the DOM node - (0,_bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_9__.bindDOMNodeToComponentInstance)(element, this); - // add eventually the 'is' attribute - component.name && (0,_add_css_hook_js__WEBPACK_IMPORTED_MODULE_10__.addCssHook)(element, component.name); - - // define the root element - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ROOT_KEY, element); - // define the slots array - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.SLOTS_KEY, slots); - - // before mount lifecycle event - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_BEFORE_MOUNT_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); - // mount the template - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL].mount(element, this, parentScope); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_MOUNTED_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); - return this; - }, - update(state, parentScope) { - if (state === void 0) { - state = {}; - } - if (parentScope) { - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL] = parentScope; - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].update(parentScope); - } - const newProps = (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_7__.evaluateAttributeExpressions)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].expressions); - if (this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.SHOULD_UPDATE_KEY](newProps, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY]) === false) return; - (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY, Object.freeze(Object.assign({}, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], newProps))); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY] = (0,_compute_component_state_js__WEBPACK_IMPORTED_MODULE_8__.computeComponentState)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY], state); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_BEFORE_UPDATE_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); - - // avoiding recursive updates - // see also https://github.com/riot/riot/issues/2895 - if (!this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_COMPONENT_UPDATING]) { - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_COMPONENT_UPDATING] = true; - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL].update(this, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL]); - } - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_UPDATED_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_COMPONENT_UPDATING] = false; - return this; - }, - unmount(preserveRoot) { - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_BEFORE_UNMOUNT_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].unmount(); - // if the preserveRoot is null the template html will be left untouched - // in that case the DOM cleanup will happen differently from a parent node - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL].unmount(this, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL], preserveRoot === null ? null : !preserveRoot); - this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_UNMOUNTED_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); - return this; - } - })), Object.keys(component).filter(prop => (0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_3__.isFunction)(component[prop]))); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/mocked-template-interface.js": -/*!*****************************************************************!*\ - !*** ./node_modules/riot/esm/core/mocked-template-interface.js ***! - \*****************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "MOCKED_TEMPLATE_INTERFACE": () => (/* binding */ MOCKED_TEMPLATE_INTERFACE) -/* harmony export */ }); -/* harmony import */ var _pure_component_api_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./pure-component-api.js */ "./node_modules/riot/esm/core/pure-component-api.js"); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +function Kt(t){return o.has(t)||S("This plugin was never installed"),o.delete(t),o} /* Riot v7.1.0, @license MIT */ - - - -const MOCKED_TEMPLATE_INTERFACE = Object.assign({}, _pure_component_api_js__WEBPACK_IMPORTED_MODULE_0__.PURE_COMPONENT_API, { - clone: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - createDOM: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop -}); - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/mount-component.js": -/*!*******************************************************!*\ - !*** ./node_modules/riot/esm/core/mount-component.js ***! - \*******************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "mountComponent": () => (/* binding */ mountComponent) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* harmony import */ var _utils_dom_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/dom.js */ "./node_modules/riot/esm/utils/dom.js"); +function Zt(t){return function(e,n,i){let{slots:r,attributes:s,parentScope:o}=void 0===i?{}:i; +/* Riot WIP, @license MIT */ +return function(){for(var t=arguments.length,e=new Array(t),n=0;nfunction(){return t(e(...arguments))}))}((t=>t.mount(e,o)),(t=>t({props:n,slots:r,attributes:s})),Bt)(t)}} /* Riot v7.1.0, @license MIT */ - - - - -/** - * Component initialization function starting from a DOM node - * @param {HTMLElement} element - element to upgrade - * @param {Object} initialProps - initial component properties - * @param {string} componentName - component id - * @param {Array} slots - component slots - * @returns {Object} a new component instance bound to a DOM node - */ -function mountComponent(element, initialProps, componentName, slots) { - const name = componentName || (0,_utils_dom_js__WEBPACK_IMPORTED_MODULE_0__.getName)(element); - if (!_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.COMPONENTS_IMPLEMENTATION_MAP.has(name)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_2__.panic)(`The component named "${name}" was never registered`); - const component = _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.COMPONENTS_IMPLEMENTATION_MAP.get(name)({ - props: initialProps, - slots - }); - return component.mount(element); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/pure-component-api.js": -/*!**********************************************************!*\ - !*** ./node_modules/riot/esm/core/pure-component-api.js ***! - \**********************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "PURE_COMPONENT_API": () => (/* binding */ PURE_COMPONENT_API) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +function Jt(t){return D(t)||S('riot.pure accepts only arguments of type "function"'),t[x]=!0,t} /* Riot v7.1.0, @license MIT */ - - - -const PURE_COMPONENT_API = Object.freeze({ - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.MOUNT_METHOD_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UPDATE_METHOD_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, - [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UNMOUNT_METHOD_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop -}); - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/core/run-plugins.js": -/*!***************************************************!*\ - !*** ./node_modules/riot/esm/core/run-plugins.js ***! - \***************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "runPlugins": () => (/* binding */ runPlugins) -/* harmony export */ }); -/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +const Qt=t=>t,te="v7.1.0",ee={cssManager:Rt,DOMBindings:{template:Et,createBinding:bt,createExpression:ht,bindingTypes:B,expressionTypes:_},globals:{DOM_COMPONENT_INSTANCE_PROPERTY:s,PARENT_KEY_SYMBOL:O}}; /* Riot v7.1.0, @license MIT */ - - -/** - * Run the component instance through all the plugins set by the user - * @param {Object} component - component instance - * @returns {Object} the component enhanced by the plugins - */ -function runPlugins(component) { - return [..._node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET].reduce((c, fn) => fn(c) || c, component); -} - - - - -/***/ }), - -/***/ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js": -/*!******************************************************************************************!*\ - !*** ./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js ***! - \******************************************************************************************/ -/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { - -"use strict"; -__webpack_require__.r(__webpack_exports__); -/* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ "bindingTypes": () => (/* reexport safe */ _util_binding_types_js__WEBPACK_IMPORTED_MODULE_0__["default"]), -/* harmony export */ "createBinding": () => (/* binding */ create$1), -/* harmony export */ "createExpression": () => (/* binding */ create$4), -/* harmony export */ "expressionTypes": () => (/* reexport safe */ _util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__["default"]), -/* harmony export */ "template": () => (/* binding */ create) -/* harmony export */ }); -/* harmony import */ var _util_dom_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../util/dom.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/dom.js"); -/* harmony import */ var _util_constants_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); -/* harmony import */ var _util_binding_types_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../util/binding-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/binding-types.js"); -/* harmony import */ var _util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../util/expression-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/expression-types.js"); -/* harmony import */ var _util_objects_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); -/* harmony import */ var _util_checks_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); -/* harmony import */ var _util_misc_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); -/* Riot WIP, @license MIT */ - - - - - - - - - - -const HEAD_SYMBOL = Symbol(); -const TAIL_SYMBOL = Symbol(); - -/** - * Create the