/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
/*
* Table styles
*/
table.dataTable {
width: 100%;
margin: 0 auto;
clear: both;
border-collapse: separate;
border-spacing: 0;
/*
* Header and footer styles
*/
/*
* Body styles
*/
}
table.dataTable thead th,
table.dataTable tfoot th {
font-weight: bold;
}
table.dataTable thead th,
table.dataTable thead td {
padding: 10px 18px;
border-bottom: 1px solid #111111;
}
table.dataTable thead th:active,
table.dataTable thead td:active {
outline: none;
}
table.dataTable tfoot th,
table.dataTable tfoot td {
padding: 10px 18px 6px 18px;
border-top: 1px solid #111111;
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
cursor: pointer;
*cursor: hand;
background-repeat: no-repeat;
background-position: center right;
}
table.dataTable thead .sorting {
background-image: url("../images/sort_both.png");
}
table.dataTable thead .sorting_asc {
background-image: url("../images/sort_asc.png");
}
table.dataTable thead .sorting_desc {
background-image: url("../images/sort_desc.png");
}
table.dataTable thead .sorting_asc_disabled {
background-image: url("../images/sort_asc_disabled.png");
}
table.dataTable thead .sorting_desc_disabled {
background-image: url("../images/sort_desc_disabled.png");
}
table.dataTable tbody tr {
background-color: white;
}
table.dataTable tbody tr.selected {
background-color: #b0bed9;
}
table.dataTable tbody th,
table.dataTable tbody td {
padding: 8px 10px;
}
table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
border-top: 1px solid #dddddd;
}
table.dataTable.row-border tbody tr:first-child th,
table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th,
table.dataTable.display tbody tr:first-child td {
border-top: none;
}
table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
border-top: 1px solid #dddddd;
border-right: 1px solid #dddddd;
}
table.dataTable.cell-border tbody tr th:first-child,
table.dataTable.cell-border tbody tr td:first-child {
border-left: 1px solid #dddddd;
}
table.dataTable.cell-border tbody tr:first-child th,
table.dataTable.cell-border tbody tr:first-child td {
border-top: none;
}
table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
background-color: #f9f9f9;
}
table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected {
background-color: #abb9d3;
}
table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {
background-color: whitesmoke;
}
table.dataTable.hover tbody tr:hover.selected, table.dataTable.display tbody tr:hover.selected {
background-color: #a9b7d1;
}
table.dataTable.order-column tbody tr > .sorting_1,
table.dataTable.order-column tbody tr > .sorting_2,
table.dataTable.order-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1,
table.dataTable.display tbody tr > .sorting_2,
table.dataTable.display tbody tr > .sorting_3 {
background-color: #f9f9f9;
}
table.dataTable.order-column tbody tr.selected > .sorting_1,
table.dataTable.order-column tbody tr.selected > .sorting_2,
table.dataTable.order-column tbody tr.selected > .sorting_3, table.dataTable.display tbody tr.selected > .sorting_1,
table.dataTable.display tbody tr.selected > .sorting_2,
table.dataTable.display tbody tr.selected > .sorting_3 {
background-color: #acbad4;
}
table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
background-color: #f1f1f1;
}
table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
background-color: #f3f3f3;
}
table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
background-color: whitesmoke;
}
table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
background-color: #a6b3cd;
}
table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
background-color: #a7b5ce;
}
table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
background-color: #a9b6d0;
}
table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
background-color: #f9f9f9;
}
table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
background-color: #fbfbfb;
}
table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
background-color: #fdfdfd;
}
table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
background-color: #acbad4;
}
table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
background-color: #adbbd6;
}
table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
background-color: #afbdd8;
}
table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
background-color: #eaeaea;
}
table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
background-color: #ebebeb;
}
table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
background-color: #eeeeee;
}
table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
background-color: #a1aec7;
}
table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
background-color: #a2afc8;
}
table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
background-color: #a4b2cb;
}
table.dataTable.no-footer {
border-bottom: 1px solid #111111;
}
table.dataTable.nowrap th, table.dataTable.nowrap td {
white-space: nowrap;
}
table.dataTable.compact thead th,
table.dataTable.compact thead td {
padding: 4px 17px 4px 4px;
}
table.dataTable.compact tfoot th,
table.dataTable.compact tfoot td {
padding: 4px;
}
table.dataTable.compact tbody th,
table.dataTable.compact tbody td {
padding: 4px;
}
table.dataTable th.dt-left,
table.dataTable td.dt-left {
text-align: left;
}
table.dataTable th.dt-center,
table.dataTable td.dt-center,
table.dataTable td.dataTables_empty {
text-align: center;
}
table.dataTable th.dt-right,
table.dataTable td.dt-right {
text-align: right;
}
table.dataTable th.dt-justify,
table.dataTable td.dt-justify {
text-align: justify;
}
table.dataTable th.dt-nowrap,
table.dataTable td.dt-nowrap {
white-space: nowrap;
}
table.dataTable thead th.dt-head-left,
table.dataTable thead td.dt-head-left,
table.dataTable tfoot th.dt-head-left,
table.dataTable tfoot td.dt-head-left {
text-align: left;
}
table.dataTable thead th.dt-head-center,
table.dataTable thead td.dt-head-center,
table.dataTable tfoot th.dt-head-center,
table.dataTable tfoot td.dt-head-center {
text-align: center;
}
table.dataTable thead th.dt-head-right,
table.dataTable thead td.dt-head-right,
table.dataTable tfoot th.dt-head-right,
table.dataTable tfoot td.dt-head-right {
text-align: right;
}
table.dataTable thead th.dt-head-justify,
table.dataTable thead td.dt-head-justify,
table.dataTable tfoot th.dt-head-justify,
table.dataTable tfoot td.dt-head-justify {
text-align: justify;
}
table.dataTable thead th.dt-head-nowrap,
table.dataTable thead td.dt-head-nowrap,
table.dataTable tfoot th.dt-head-nowrap,
table.dataTable tfoot td.dt-head-nowrap {
white-space: nowrap;
}
table.dataTable tbody th.dt-body-left,
table.dataTable tbody td.dt-body-left {
text-align: left;
}
table.dataTable tbody th.dt-body-center,
table.dataTable tbody td.dt-body-center {
text-align: center;
}
table.dataTable tbody th.dt-body-right,
table.dataTable tbody td.dt-body-right {
text-align: right;
}
table.dataTable tbody th.dt-body-justify,
table.dataTable tbody td.dt-body-justify {
text-align: justify;
}
table.dataTable tbody th.dt-body-nowrap,
table.dataTable tbody td.dt-body-nowrap {
white-space: nowrap;
}
table.dataTable,
table.dataTable th,
table.dataTable td {
box-sizing: content-box;
}
/*
* Control feature layout
*/
.dataTables_wrapper {
position: relative;
clear: both;
*zoom: 1;
zoom: 1;
}
.dataTables_wrapper .dataTables_length {
float: left;
}
.dataTables_wrapper .dataTables_filter {
float: right;
text-align: right;
}
.dataTables_wrapper .dataTables_filter input {
margin-left: 0.5em;
}
.dataTables_wrapper .dataTables_info {
clear: both;
float: left;
padding-top: 0.755em;
}
.dataTables_wrapper .dataTables_paginate {
float: right;
text-align: right;
padding-top: 0.25em;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
box-sizing: border-box;
display: inline-block;
min-width: 1.5em;
padding: 0.5em 1em;
margin-left: 2px;
text-align: center;
text-decoration: none !important;
cursor: pointer;
*cursor: hand;
color: #333333 !important;
border: 1px solid transparent;
border-radius: 2px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
color: #333333 !important;
border: 1px solid #979797;
background-color: white;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, gainsboro));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, white 0%, gainsboro 100%);
/* Chrome10+,Safari5.1+ */
background: -moz-linear-gradient(top, white 0%, gainsboro 100%);
/* FF3.6+ */
background: -ms-linear-gradient(top, white 0%, gainsboro 100%);
/* IE10+ */
background: -o-linear-gradient(top, white 0%, gainsboro 100%);
/* Opera 11.10+ */
background: linear-gradient(to bottom, white 0%, gainsboro 100%);
/* W3C */
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
cursor: default;
color: #666 !important;
border: 1px solid transparent;
background: transparent;
box-shadow: none;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
color: white !important;
border: 1px solid #111111;
background-color: #585858;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111111));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #585858 0%, #111111 100%);
/* Chrome10+,Safari5.1+ */
background: -moz-linear-gradient(top, #585858 0%, #111111 100%);
/* FF3.6+ */
background: -ms-linear-gradient(top, #585858 0%, #111111 100%);
/* IE10+ */
background: -o-linear-gradient(top, #585858 0%, #111111 100%);
/* Opera 11.10+ */
background: linear-gradient(to bottom, #585858 0%, #111111 100%);
/* W3C */
}
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
outline: none;
background-color: #2b2b2b;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
/* Chrome10+,Safari5.1+ */
background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
/* FF3.6+ */
background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
/* IE10+ */
background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
/* Opera 11.10+ */
background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);
/* W3C */
box-shadow: inset 0 0 3px #111;
}
.dataTables_wrapper .dataTables_paginate .ellipsis {
padding: 0 1em;
}
.dataTables_wrapper .dataTables_processing {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 40px;
margin-left: -50%;
margin-top: -25px;
padding-top: 20px;
text-align: center;
font-size: 1.2em;
background-color: white;
background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
color: #333333;
}
.dataTables_wrapper .dataTables_scroll {
clear: both;
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
*margin-top: -1px;
-webkit-overflow-scrolling: touch;
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {
vertical-align: middle;
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td > div.dataTables_sizing {
height: 0;
overflow: hidden;
margin: 0 !important;
padding: 0 !important;
}
.dataTables_wrapper.no-footer .dataTables_scrollBody {
border-bottom: 1px solid #111111;
}
.dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
.dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
border-bottom: none;
}
.dataTables_wrapper:after {
visibility: hidden;
display: block;
content: "";
clear: both;
height: 0;
}
@media screen and (max-width: 767px) {
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
float: none;
text-align: center;
}
.dataTables_wrapper .dataTables_paginate {
margin-top: 0.5em;
}
}
@media screen and (max-width: 640px) {
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
float: none;
text-align: center;
}
.dataTables_wrapper .dataTables_filter {
margin-top: 0.5em;
}
}
/*
* easy-autocomplete
* jQuery plugin for autocompletion
*
* @author Łukasz Pawełczak (http://github.com/pawelczak)
* @version 1.3.5
* Copyright License:
*/
.easy-autocomplete {
position: relative;
}
.easy-autocomplete input {
border-color: #ccc;
border-radius: 4px;
border-style: solid;
border-width: 1px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
color: #555;
float: none;
padding: 6px 12px;
}
.easy-autocomplete input:hover, .easy-autocomplete input:focus {
box-shadow: none;
}
.easy-autocomplete a {
display: block;
}
.easy-autocomplete.eac-blue-light input:hover, .easy-autocomplete.eac-blue-light input:focus {
border-color: #66afe9;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
}
.easy-autocomplete.eac-blue-light ul {
border-color: #66afe9;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
}
.easy-autocomplete.eac-blue-light ul li, .easy-autocomplete.eac-blue-light ul .eac-category {
border-color: #66afe9;
}
.easy-autocomplete.eac-blue-light ul li.selected, .easy-autocomplete.eac-blue-light ul .eac-category.selected {
background-color: #ecf5fc;
}
.easy-autocomplete.eac-green-light input:hover, .easy-autocomplete.eac-green-light input:focus {
border-color: #41DB00;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(146, 237, 107, 0.6);
}
.easy-autocomplete.eac-green-light ul {
border-color: #41DB00;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(146, 237, 107, 0.6);
}
.easy-autocomplete.eac-green-light ul li, .easy-autocomplete.eac-green-light ul .eac-category {
border-color: #41DB00;
}
.easy-autocomplete.eac-green-light ul li.selected, .easy-autocomplete.eac-green-light ul .eac-category.selected {
background-color: #9eff75;
}
.easy-autocomplete.eac-red-light input:hover, .easy-autocomplete.eac-red-light input:focus {
border-color: #ff5b5b;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 90, 90, 0.6);
}
.easy-autocomplete.eac-red-light ul {
border-color: #ff5b5b;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 90, 90, 0.6);
}
.easy-autocomplete.eac-red-light ul li, .easy-autocomplete.eac-red-light ul .eac-category {
border-color: #ff5b5b;
}
.easy-autocomplete.eac-red-light ul li.selected, .easy-autocomplete.eac-red-light ul .eac-category.selected {
background-color: #ff8e8e;
}
.easy-autocomplete.eac-yellow-light input:hover, .easy-autocomplete.eac-yellow-light input:focus {
border-color: #ffdb00;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 231, 84, 0.6);
}
.easy-autocomplete.eac-yellow-light ul {
border-color: #ffdb00;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 231, 84, 0.6);
}
.easy-autocomplete.eac-yellow-light ul li, .easy-autocomplete.eac-yellow-light ul .eac-category {
border-color: #ffdb00;
}
.easy-autocomplete.eac-yellow-light ul li.selected, .easy-autocomplete.eac-yellow-light ul .eac-category.selected {
background-color: #ffe233;
}
.easy-autocomplete.eac-dark-light input:hover, .easy-autocomplete.eac-dark-light input:focus {
border-color: #333;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(55, 55, 55, 0.6);
}
.easy-autocomplete.eac-dark-light ul {
border-color: #333;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(55, 55, 55, 0.6);
}
.easy-autocomplete.eac-dark-light ul li, .easy-autocomplete.eac-dark-light ul .eac-category {
border-color: #333;
}
.easy-autocomplete.eac-dark-light ul li.selected, .easy-autocomplete.eac-dark-light ul .eac-category.selected {
background-color: #4d4d4d;
color: #fff;
}
.easy-autocomplete.eac-dark {
color: #fff;
}
.easy-autocomplete.eac-dark input {
background-color: #404040;
border-radius: 4px;
box-shadow: 0;
color: #f6f6f6;
}
.easy-autocomplete.eac-dark input:hover, .easy-autocomplete.eac-dark input:focus {
border-color: #333;
box-shadow: 0;
}
.easy-autocomplete.eac-dark ul {
border-color: #333;
}
.easy-autocomplete.eac-dark ul li, .easy-autocomplete.eac-dark ul .eac-category {
background-color: #404040;
border-color: #333;
}
.easy-autocomplete.eac-dark ul li.selected, .easy-autocomplete.eac-dark ul .eac-category.selected {
background-color: #737373;
color: #f6f6f6;
}
.easy-autocomplete.eac-dark-glass {
color: #fff;
}
.easy-autocomplete.eac-dark-glass input {
background-color: rgba(0, 0, 0, 0.8);
border-radius: 4px;
box-shadow: 0;
color: #f6f6f6;
}
.easy-autocomplete.eac-dark-glass input:hover, .easy-autocomplete.eac-dark-glass input:focus {
border-color: rgba(0, 0, 0, 0.8);
box-shadow: 0;
}
.easy-autocomplete.eac-dark-glass ul {
border-color: rgba(0, 0, 0, 0.8);
}
.easy-autocomplete.eac-dark-glass ul li, .easy-autocomplete.eac-dark-glass ul .eac-category {
background-color: rgba(0, 0, 0, 0.8);
border-color: rgba(0, 0, 0, 0.8);
}
.easy-autocomplete.eac-dark-glass ul li.selected, .easy-autocomplete.eac-dark-glass ul .eac-category.selected {
background-color: rgba(64, 64, 64, 0.8);
color: #f6f6f6;
}
.easy-autocomplete.eac-dark-glass ul li:last-child, .easy-autocomplete.eac-dark-glass ul .eac-category:last-child {
border-radius: 0 0 4px 4px;
}
.easy-autocomplete.eac-blue {
color: #fff;
}
.easy-autocomplete.eac-blue input {
background-color: #6d9ed1;
border-radius: 4px;
box-shadow: 0;
color: #f6f6f6;
}
.easy-autocomplete.eac-blue input::-webkit-input-placeholder {
color: #f6f6f6;
}
.easy-autocomplete.eac-blue input:-moz-placeholder {
color: #f6f6f6;
}
.easy-autocomplete.eac-blue input::-moz-placeholder {
color: #f6f6f6;
}
.easy-autocomplete.eac-blue input:-ms-input-placeholder {
color: #f6f6f6;
}
.easy-autocomplete.eac-blue input:hover, .easy-autocomplete.eac-blue input:focus {
border-color: #5A91CB;
box-shadow: 0;
}
.easy-autocomplete.eac-blue ul {
border-color: #5A91CB;
}
.easy-autocomplete.eac-blue ul li, .easy-autocomplete.eac-blue ul .eac-category {
background-color: #6d9ed1;
border-color: #5A91CB;
}
.easy-autocomplete.eac-blue ul li.selected, .easy-autocomplete.eac-blue ul .eac-category.selected {
background-color: #94b8dd;
color: #f6f6f6;
}
.easy-autocomplete.eac-yellow {
color: #333;
}
.easy-autocomplete.eac-yellow input {
background-color: #ffdb7e;
border-color: #333;
border-radius: 4px;
box-shadow: 0;
color: #333;
}
.easy-autocomplete.eac-yellow input:hover, .easy-autocomplete.eac-yellow input:focus {
border-color: #333;
box-shadow: 0;
}
.easy-autocomplete.eac-yellow ul {
border-color: #333;
}
.easy-autocomplete.eac-yellow ul li, .easy-autocomplete.eac-yellow ul .eac-category {
background-color: #ffdb7e;
border-color: #333;
}
.easy-autocomplete.eac-yellow ul li.selected, .easy-autocomplete.eac-yellow ul .eac-category.selected {
background-color: #ffe9b1;
color: #333;
}
.easy-autocomplete.eac-purple {
color: #333;
}
.easy-autocomplete.eac-purple input {
background-color: #d6d1e7;
border-color: #b8afd5;
box-shadow: 0;
color: #333;
}
.easy-autocomplete.eac-purple input:hover, .easy-autocomplete.eac-purple input:focus {
border-color: #333;
box-shadow: 0;
}
.easy-autocomplete.eac-purple ul {
border-color: #333;
}
.easy-autocomplete.eac-purple ul li, .easy-autocomplete.eac-purple ul .eac-category {
background-color: #d6d1e7;
border-color: #333;
}
.easy-autocomplete.eac-purple ul li.selected, .easy-autocomplete.eac-purple ul .eac-category.selected {
background-color: #ebe8f3;
color: #333;
}
.easy-autocomplete.eac-bootstrap input {
border-color: #ccc;
border-radius: 4px;
border-style: solid;
border-width: 1px;
color: #555;
padding: 6px 12px;
}
.easy-autocomplete-container {
left: 0;
position: absolute;
width: 100%;
z-index: 2;
}
.easy-autocomplete-container ul {
background: none repeat scroll 0 0 #ffffff;
border-top: 1px dotted #ccc;
display: none;
margin-top: 0;
padding-bottom: 0;
padding-left: 0;
position: relative;
top: -1px;
}
.easy-autocomplete-container ul li, .easy-autocomplete-container ul .eac-category {
background: inherit;
border-color: #ccc;
border-image: none;
border-style: solid;
border-width: 0 1px;
display: block;
font-size: 14px;
font-weight: normal;
padding: 4px 12px;
}
.easy-autocomplete-container ul li:last-child {
border-radius: 0 0 2px 2px;
border-width: 0 1px 1px;
}
.easy-autocomplete-container ul li.selected {
background: none repeat scroll 0 0 #ebebeb;
cursor: pointer;
}
.easy-autocomplete-container ul li.selected div {
font-weight: normal;
}
.easy-autocomplete-container ul li div {
display: block;
font-weight: normal;
word-break: break-all;
}
.easy-autocomplete-container ul li b {
font-weight: bold;
}
.easy-autocomplete-container ul .eac-category {
font-color: #aaa;
font-style: italic;
}
.eac-description .eac-item span {
color: #aaa;
font-style: italic;
font-size: 0.9em;
}
.eac-icon-left .eac-item img {
margin-right: 4px;
max-height: 30px;
}
.eac-icon-right .eac-item {
margin-top: 8px;
min-height: 24px;
position: relative;
}
.eac-icon-right .eac-item img {
margin-left: 4px;
max-height: 30px;
position: absolute;
right: -4px;
top: -8px;
}
/*# sourceMappingURL=easy-autocomplete.css.map */
/*
* easy-autocomplete
* jQuery plugin for autocompletion
*
* @author Łukasz Pawełczak (http://github.com/pawelczak)
* @version 1.3.5
* Copyright License:
*/
.easy-autocomplete {
/* Theme Square */
/* Round */
/* Funky */
/* Solid */
/* Plate */
}
.easy-autocomplete.eac-square {
font-family: "Roboto", "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.easy-autocomplete.eac-square input {
border: 1px solid #7f8c8d;
border-radius: 0;
color: #7f8c8d;
font-family: inherit;
font-size: 18px;
font-style: italic;
font-weight: 300;
margin: 0;
min-width: 350px;
padding: 12px 43px 12px 15px;
}
.easy-autocomplete.eac-square ul {
border-color: #7f8c8d;
border-top: 0;
box-shadow: none;
top: 0;
}
.easy-autocomplete.eac-square ul li, .easy-autocomplete.eac-square ul .eac-category {
border-color: #7f8c8d;
font-family: inherit;
font-size: 16px;
font-weight: 300;
padding: 6px 12px;
transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-square ul li *, .easy-autocomplete.eac-square ul .eac-category * {
font-weight: 300;
}
.easy-autocomplete.eac-square ul li.selected, .easy-autocomplete.eac-square ul .eac-category.selected {
background-color: #f1f1f1;
font-weight: 300;
}
.easy-autocomplete.eac-square ul li b, .easy-autocomplete.eac-square ul .eac-category b {
font-weight: 600;
}
.easy-autocomplete.eac-round {
font-family: "Open Sans", "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.easy-autocomplete.eac-round input {
border: 2px solid #888;
border-radius: 10px;
color: #888;
font-family: inherit;
font-size: 16px;
font-weight: 400;
margin: 0;
min-width: 300px;
padding: 10px;
}
.easy-autocomplete.eac-round input:hover, .easy-autocomplete.eac-round input:focus {
border-color: #3079ed;
}
.easy-autocomplete.eac-round ul {
background: none;
border-color: #888;
border-width: 0;
box-shadow: none;
min-width: 300px;
top: 20px;
}
.easy-autocomplete.eac-round ul li, .easy-autocomplete.eac-round ul .eac-category {
background: #fff;
border-color: #3079ed;
border-width: 0 2px;
font-size: 14px;
padding: 8px 12px;
transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-round ul li.selected, .easy-autocomplete.eac-round ul .eac-category.selected {
background-color: #d4e3fb;
}
.easy-autocomplete.eac-round ul li:first-child, .easy-autocomplete.eac-round ul .eac-category:first-child {
border-radius: 10px 10px 0 0;
border-width: 2px 2px 0;
}
.easy-autocomplete.eac-round ul li:last-child, .easy-autocomplete.eac-round ul .eac-category:last-child {
border-radius: 0 0 10px 10px;
border-width: 0 2px 2px;
}
.easy-autocomplete.eac-round ul li b, .easy-autocomplete.eac-round ul .eac-category b {
font-weight: 700;
}
.easy-autocomplete.eac-funky {
font-family: "Inconsolata", "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.easy-autocomplete.eac-funky input {
background: #07ED89;
border: 0;
border-radius: 0;
color: #ED076B;
font-family: inherit;
font-size: 18px;
min-width: 240px;
padding: 12px;
}
.easy-autocomplete.eac-funky ul {
background: transparent;
border: 0;
}
.easy-autocomplete.eac-funky ul li, .easy-autocomplete.eac-funky ul .eac-category {
background: transparent;
border: 0;
color: #ED076B;
font-size: 18px;
padding: 4px 12px;
transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-funky ul li.selected, .easy-autocomplete.eac-funky ul .eac-category.selected {
color: #8907ED;
}
.easy-autocomplete.eac-solid input {
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) inset;
border-color: #ddd;
color: #666;
font-size: 13px;
min-height: 0;
padding: 6px 12px;
}
.easy-autocomplete.eac-solid ul li, .easy-autocomplete.eac-solid ul .eac-category {
transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-solid ul li.selected, .easy-autocomplete.eac-solid ul .eac-category.selected {
background-color: #f2f2f2;
}
.easy-autocomplete.eac-plate {
font-family: "Open Sans", "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.easy-autocomplete.eac-plate input {
font-size: 13px;
padding: 6px 12px;
}
.easy-autocomplete.eac-plate ul {
background: #b5b5b5;
border-radius: 6px;
border-width: 0;
top: 10px;
}
.easy-autocomplete.eac-plate ul li, .easy-autocomplete.eac-plate ul .eac-category {
background: #b5b5b5;
color: #FAFAFA;
font-size: 12px;
transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-plate ul li b, .easy-autocomplete.eac-plate ul .eac-category b {
color: #ffd464;
}
.easy-autocomplete.eac-plate ul li.selected, .easy-autocomplete.eac-plate ul .eac-category.selected {
background: #656565;
}
.easy-autocomplete.eac-plate ul li:first-child, .easy-autocomplete.eac-plate ul .eac-category:first-child {
border-radius: 6px 6px 0 0;
}
.easy-autocomplete.eac-plate ul li:last-child, .easy-autocomplete.eac-plate ul .eac-category:last-child {
border-radius: 0 0 6px 6px;
}
.easy-autocomplete.eac-plate-dark {
font-family: "Open Sans", "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.easy-autocomplete.eac-plate-dark input {
font-size: 13px;
padding: 6px 12px;
}
.easy-autocomplete.eac-plate-dark ul {
background: #212121;
border-radius: 6px;
border-width: 0;
top: 10px;
}
.easy-autocomplete.eac-plate-dark ul li, .easy-autocomplete.eac-plate-dark ul .eac-category {
background: #212121;
color: #FAFAFA;
font-size: 12px;
transition: all 0.4s ease 0s;
}
.easy-autocomplete.eac-plate-dark ul li b, .easy-autocomplete.eac-plate-dark ul .eac-category b {
color: #ffd464;
}
.easy-autocomplete.eac-plate-dark ul li.selected, .easy-autocomplete.eac-plate-dark ul .eac-category.selected {
background: #656565;
}
.easy-autocomplete.eac-plate-dark ul li:first-child, .easy-autocomplete.eac-plate-dark ul .eac-category:first-child {
border-radius: 6px 6px 0 0;
}
.easy-autocomplete.eac-plate-dark ul li:last-child, .easy-autocomplete.eac-plate-dark ul .eac-category:last-child {
border-radius: 0 0 6px 6px;
}
/*# sourceMappingURL=easy-autocomplete.themes.css.map */
/*
##Plugin Details##
Plugin Name: Pair Select
Version: 1.0.0
Plugin by: Void Canvas
Website: www.voidcanvas.com
Author: Paul Shan
License: MIT License
##Example##
==HTML==
==Javascript==
$('#MasterSelectBox').pairMaster();
$('#btnAdd').click(function(){
$('#MasterSelectBox').addSelected('#PairedSelectBox');
});
$('#btnRemove').click(function(){
$('#PairedSelectBox').removeSelected('#MasterSelectBox');
});
*/
//==============================================================================================================================================================//
//==============================================================================================================================================================//
(function($) {
// Creating the master object. It will work like a handler
function PairSelect(el, options) {
//defaults are the object where the default values are stored
this.defaults = {
attribute: 'value' //the attribute is the key according to which the matching will be done. Defaultly it's 'value', but it can be anything. Like: class, id etc.
};
this.opts = $.extend({}, this.defaults, options); //extending the properties in a common property named 'opts'
this.$el = $(el);
this.items = new Array();
};
PairSelect.prototype = {
init: function() {
var _this = this;
//to store all the given options of the selectbox in the PairSelect object
$('option', this.$el).each(function(i, obj) {
var $el = $(obj);
$el.data('status', 'enabled');
_this.items.push({
attribute: $el.attr(_this.opts.attribute),
$el: $el
});
});
},
//This is used to move an option item from our master selectbox
transferElement: function(item){
var key=$(item).attr($(this)[0].opts.attribute)
$.each(this.items, function(i, item){
if(item.attribute == key ){
item.$el.remove();
item.$el.data('status', 'disabled');
}
});
},
//This is used to bring back an option element to our master selectbox
bringBackElement: function(item){
var _this = this;
var key=$(item).attr($(this)[0].opts.attribute)
$.each(this.items, function(i, item){
if(item.attribute == key){
var t = i + 1;
while(true)
{
if(t < _this.items.length) {
if(_this.items[t].$el.data('status') == 'enabled') {
_this.items[t].$el.before(item.$el);
item.$el.data('status', 'enabled');
break;
}
else {
t++;
}
}
else {
_this.$el.append(item.$el);
item.$el.data('status', 'enabled');
break;
}
}
}
});
}
};
//This is sort of an init function for the whole pare-select plugin.
//This is basically used with the master selectbox.
//Eg: $('#MasterSelectBox').pairMaster({ attribute: 'value' });
//Eg: $('#MasterSelectBox').pairMaster();
$.fn.pairMaster = function(options) {
if (this.length) {
this.each(function() {
var rev = new PairSelect(this, options);
rev.init();
$(this).data('pairselect', rev);
});
}
};
//This is to add the selected items of our MasterSelectBox to a paired selectbox
//once any add or similar button is clicked or any other add event is raised you've to place the following code
//$('#MasterSelectBox').addSelected('#PairedSelectBox');
$.fn.addSelected=function(to){
var allSelected=$(this).find(':selected');
var from=this;
$.each(allSelected,function(index,item){
$(from).data('pairselect').transferElement(item);
if(to){
$(to).append(item)
}
});
}
//This is to remove the selected items of a paired selectbox and add them back to our MasterSelectBox
//once any remove, back or similar buttons are clicked or any other remove event is raised you've to place the following code
//$('#PairedSelectBox').removeSelected('#MasterSelectBox');
$.fn.removeSelected=function(to){
var allSelected=$(this).find(':selected');
$.each(allSelected,function(index,item){
$(item).remove();
if(to){
$(to).data('pairselect').bringBackElement(item);
}
});
}
})(jQuery);
var selected = [];
$(document).ready( function(){
$('#MasterSelectBox').pairMaster();
$('#btnAdd').click(function(e){
e.preventDefault();
$('#MasterSelectBox').addSelected('#PairedSelectBox');
updateSelectValues(e)
});
$('#btnRemove').click(function(e){
e.preventDefault();
$('#PairedSelectBox').removeSelected('#MasterSelectBox');
updateSelectValues(e)
});
});
function updateSelectValues(e){
selected = [];
$('#PairedSelectBox option').each(function(i, e){
// console.log([i, e]);
selected.push(e.value)
});
console.log(selected);
$("#selected").val(JSON.stringify(selected));
}
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var defaults = {
lines: 12,
length: 7,
width: 5,
radius: 10,
scale: 1.0,
corners: 1,
color: '#000',
fadeColor: 'transparent',
animation: 'spinner-line-fade-default',
rotate: 0,
direction: 1,
speed: 1,
zIndex: 2e9,
className: 'spinner',
top: '50%',
left: '50%',
shadow: '0 0 1px transparent',
position: 'absolute',
};
var Spinner = /** @class */ (function () {
function Spinner(opts) {
if (opts === void 0) { opts = {}; }
this.opts = __assign({}, defaults, opts);
}
/**
* Adds the spinner to the given target element. If this instance is already
* spinning, it is automatically removed from its previous target by calling
* stop() internally.
*/
Spinner.prototype.spin = function (target) {
this.stop();
this.el = document.createElement('div');
this.el.className = this.opts.className;
this.el.setAttribute('role', 'progressbar');
css(this.el, {
position: this.opts.position,
width: 0,
zIndex: this.opts.zIndex,
left: this.opts.left,
top: this.opts.top,
transform: "scale(" + this.opts.scale + ")",
});
if (target) {
target.insertBefore(this.el, target.firstChild || null);
}
drawLines(this.el, this.opts);
return this;
};
/**
* Stops and removes the Spinner.
* Stopped spinners may be reused by calling spin() again.
*/
Spinner.prototype.stop = function () {
if (this.el) {
if (typeof requestAnimationFrame !== 'undefined') {
cancelAnimationFrame(this.animateId);
}
else {
clearTimeout(this.animateId);
}
if (this.el.parentNode) {
this.el.parentNode.removeChild(this.el);
}
this.el = undefined;
}
return this;
};
return Spinner;
}());
// export { Spinner };
/**
* Sets multiple style properties at once.
*/
function css(el, props) {
for (var prop in props) {
el.style[prop] = props[prop];
}
return el;
}
/**
* Returns the line color from the given string or array.
*/
function getColor(color, idx) {
return typeof color == 'string' ? color : color[idx % color.length];
}
/**
* Internal method that draws the individual lines.
*/
function drawLines(el, opts) {
var borderRadius = (Math.round(opts.corners * opts.width * 500) / 1000) + 'px';
var shadow = 'none';
if (opts.shadow === true) {
shadow = '0 2px 4px #000'; // default shadow
}
else if (typeof opts.shadow === 'string') {
shadow = opts.shadow;
}
var shadows = parseBoxShadow(shadow);
for (var i = 0; i < opts.lines; i++) {
var degrees = ~~(360 / opts.lines * i + opts.rotate);
var backgroundLine = css(document.createElement('div'), {
position: 'absolute',
top: -opts.width / 2 + "px",
width: (opts.length + opts.width) + 'px',
height: opts.width + 'px',
background: getColor(opts.fadeColor, i),
borderRadius: borderRadius,
transformOrigin: 'left',
transform: "rotate(" + degrees + "deg) translateX(" + opts.radius + "px)",
});
var delay = i * opts.direction / opts.lines / opts.speed;
delay -= 1 / opts.speed; // so initial animation state will include trail
var line = css(document.createElement('div'), {
width: '100%',
height: '100%',
background: getColor(opts.color, i),
borderRadius: borderRadius,
boxShadow: normalizeShadow(shadows, degrees),
animation: 1 / opts.speed + "s linear " + delay + "s infinite " + opts.animation,
});
backgroundLine.appendChild(line);
el.appendChild(backgroundLine);
}
}
function parseBoxShadow(boxShadow) {
var regex = /^\s*([a-zA-Z]+\s+)?(-?\d+(\.\d+)?)([a-zA-Z]*)\s+(-?\d+(\.\d+)?)([a-zA-Z]*)(.*)$/;
var shadows = [];
for (var _i = 0, _a = boxShadow.split(','); _i < _a.length; _i++) {
var shadow = _a[_i];
var matches = shadow.match(regex);
if (matches === null) {
continue; // invalid syntax
}
var x = +matches[2];
var y = +matches[5];
var xUnits = matches[4];
var yUnits = matches[7];
if (x === 0 && !xUnits) {
xUnits = yUnits;
}
if (y === 0 && !yUnits) {
yUnits = xUnits;
}
if (xUnits !== yUnits) {
continue; // units must match to use as coordinates
}
shadows.push({
prefix: matches[1] || '',
x: x,
y: y,
xUnits: xUnits,
yUnits: yUnits,
end: matches[8],
});
}
return shadows;
}
/**
* Modify box-shadow x/y offsets to counteract rotation
*/
function normalizeShadow(shadows, degrees) {
var normalized = [];
for (var _i = 0, shadows_1 = shadows; _i < shadows_1.length; _i++) {
var shadow = shadows_1[_i];
var xy = convertOffset(shadow.x, shadow.y, degrees);
normalized.push(shadow.prefix + xy[0] + shadow.xUnits + ' ' + xy[1] + shadow.yUnits + shadow.end);
}
return normalized.join(', ');
}
function convertOffset(x, y, degrees) {
var radians = degrees * Math.PI / 180;
var sin = Math.sin(radians);
var cos = Math.cos(radians);
return [
Math.round((x * cos + y * sin) * 1000) / 1000,
Math.round((-x * sin + y * cos) * 1000) / 1000,
];
}